Pinegrow for Dreamweaver Users – User Review

This review is originally published on a Dreamweaver forum by rayek.elfin.  It is republished here with the author’s permission.

I worked with and tried pretty much all the visual editors in my lifetime as a front-end coder since the nineties, and I can state without a doubt that Pinegrow is the ONLY product so far that I have purchased and integrated in my workflow. It doesn’t attempt to be a visual editor like Muse (yuk!) catering to beginners or designers who do not want to learn or cannot learn to code, but is aimed at front-end developers with good code sense to speed up development.

The only thing I can compare Pinegrow with is with a visual IDE GUI builder – such as Visual Studio has, or Netbeans: it’s not meant for designers, but for coders who want to speed up visual component design and coding. Pinegrow integrates a bit like that in your existing workflow. With Atom it’s a strong combo, since any edit you make in either app (Atom or Pinegrow) is instantly reflected in both (without saving!). But it works fine with other code editors as well.

It’s also great for quick prototyping, and the latest version 4 (just released) supports plain html, Bootstrap 3 and 4, Foundation 5 and 6, Materialize, AngularJS, Bootstrap blocks for WP, and WP out of the box. Flex is integrated, and SASS and LESS can be edited live without the need for external tools.

Master pages, custom reusable components with editable areas are quite handy for quick static sites (like DW). It is also quick to do copy editing in the visual view, rather than in code.

But to me it is really the testing and prototyping where it really delivers. So easy to test stuff, and have multiple breakpoints open side by side, and target styles for a particular breakpoint. For prototyping it literally takes minutes to test concepts, and MOST IMPORTANTLY the code Pinegrow writes is actually USABLE and standard. It’s like having a super-charged Inspect Element view on your side. It even offers an option to open any web page url for quick inspection and editing.

The visual editor is handy to quickly try out visual concepts and designs – much faster than doing it by hand in code (in this regard it is similar to DW, but support for modern CSS properties is already built-in). If you are working as a WP theme developer, the WP components make quick work of converting a static html design to a functional WP theme. Again, Pinegrow isn’t a WP visual builder that requires no knowledge of theme development; instead, it assists the WP theme developer in their task, rather than restricting them.

In short, Pinegrow avoids patronizing the front-end developer, like most other visual editing tools.

I’ve been working with PineGrow since the first version: that version didn’t quite make the cut for me, but by version 2 I began to use it more and more – and now it’s a very useful addition in my toolbox. It’s brilliant for prototyping and testing. I really don’t understand why anyone familiar with html and css would EVER prefer to use a visual tool like Photoshop/illustrator or even Sketch for web page prototyping/mockups when Pinegrow is available.

The nice thing about Pinegrow is that it is quickly integrated in your pipeline, and just makes life easier for the front-end coder. In my opinion Pinegrow is what Dreamweaver would have been in a parallel universe.

My two cents. If you consider yourself a professional front-end developer and UX designer, you owe it to yourself to (at the very least) download the trial and give it a good whirl.