The Top 4 ‘In-Browser’ Front End Development Tools of 2015

The Top 4 'In-Browser' Front End Development Tools of 2015

It wasn’t that long ago that we depended solely on photoshop as a means to design the visual look of a website. That of course meant that someone (usually someone else) was tasked with the job of coding it. This usually lead to more than a few headaches along the way as the designer tries to visually describe and detail exactly how the webpages should come together, look, animate, etc. The developer was then obliged to describe and detail how none of that was either possible, useful or likely to happen.

It’s not always quite so dramatic, but as you can see, it can lead to some problems.

In the past 2 or so years, a few tools have come together to bring the two worlds together. Why not create an application that sort functions like Adobe Photoshop but instead of creating an image that looks like a website, it is actually building a ‘real’ website?

Let’s take a look at some of the leading applications in the field:

1. Froont


Froont was the first version I had a chance to try.  I have had the opportunity to chat a few times with one of the developers, Sandijs Ruluks. The app is everything one could hope for. I still have some issues moving content around as easily as I’d like, but that is likely due to the fact that I haven’t learned the app well enough yet. Aside from a few simple issues like that, Froont is a fantastic application.

 2. Webflow


Webflow is probably the biggest player on the block for in-browser web development. It is sophisticated, detailed, and can be a bit of a steep learning curve for some. It is also pricey. I’ve had some success with using this app, but frankly, the price is a bit too steep for me to use it as much as I’d like to. All that aside, it is the tool of choice for someone with the pockets to choose the best. I would consider this application as the Photoshop of the pack.

3. Stackhive


Stackhive started its existence as ‘dockPHP’….”lets code websites visually”. A very noble idea.  This is exactly what we’re talking about here today.

However, it seems somewhere along the way, they decided to re-brand as Stackhive. Along with their re-branding, it appears that they decided to pivot exactly what their app would look like. Some argue that they pivoted a little too close to Webflow.

I, however, am not going to enter this debate. I will, however, say that I find Stackhive to be every bit as sophisticated and detailed as Webflow is and in some ways, a bit easier to work with. It is also much more accessible for the pocketbook. The regular account has cost me nothing so far, and I can already do a few more things with it than I can with the free account on Webflow. All of the power of Webflow, some extra tools and gimmicks but for less money, makes me a happy camper.

I’ve noticed one or two bugs with Stackhive, but with any luck, they’ll sort that out.  The main bug being that you can download a zip of the project that you’re currently working on but unfortunately the zip comes up with errors, making it useless.

4. Generator


Generator is quite possibly the easiest to use, and the simplest version of these apps. It is also one of my favourites. It allows you to quickly put together a simple page by dragging and dropping simple template pieces. Once the page is complete, you can simply output the the html/css code and save it. The beauty of this for me, is that I can use it to quickly throw the basics of a page together in a few minutes, then spit out the html/css to then go further and tweak and expand upon the page. It’s a really fantastic way to get a project started quickly.