The grid is a necessity now. Most designers have probably been made aware of this in some way or another, since use of grids is in everything from print media and books, to websites and apps. In fact, grids were used in design even all the way back in the 13th century! Why so important now, especially for developers?
Well, today a quick google search tells us that well over half of all website traffic is on mobile devices. However, laptops and more powerful desktops are still popular, and therefore, a developer has to construct the website to be easily operated on a variety of screen sizes. A big frustration that I sometimes encounter as a developer is having been given a desktop ready design, without any clues as to how a mobile design should even be approached. This becomes increasingly difficult as designs continue to become more and more complex.
So what’s the solution? Start with a grid. I typically design with a 12-column grid. This makes it easy to define spacing between elements (the gutter), and the sizing of each element, while still allowing for quite a bit of flexibility in the number of elements in a row.
Doing this helps the developer understand the underlying structure of the product. This is because the developer is building the app in almost the same way you are designing, meaning everyone is synced up and saving time. Grids also make responsive (desktop -> mobile) design much easier, since each element can include a set of rules as to how many columns it should take up at each screen size, and how the content should change to fit the layout.