4 min.

Embracing Webflow as a Frontend Developer

  • opinion
  • webflow

Throughout the rather short history of software development, there have been many evolutions in the tools we use to build software. Despite the very nature of software development being rapid change, there’s always been a resistant, change-adverse group downplaying the legitimacy of newer tools.

When we advanced from Assembly to the familiar C-like languages commonly used today, there were no doubt programmers who scoffed at C and thought the abstractions went too far — that real programmers wrote Assembly, and C was just a toy for the simpletons. We often hear, more recently, the same sentiments expressed towards languages like PHP and Visual Basic. In an interview once, I saw my chances of getting the job disappear in a swift evanescence when I mentioned to my interviewer that my last job was primarily working with PHP.

Real Programmers (Source: https://xkcd.com/378/)

It’s rampant in our industry to preach some version of the no true Scotsman fallacy when it comes to the tools we use to build software. We bicker over programming languages, text editors, and a variety of other tools. This brings us to Webflow (Webflow): a visual tool for building websites without writing any code. Should real web developers use Webflow despite already knowing how to code?

Image result for https://webflow gif

My initial thoughts when I first learned of Webflow was something along these lines: Oh great… another Adobe Dreamweaver.

I thought Webflow wasn’t a serious tool for real developers. I thought it would be better if people just learned how to code instead of using these clunky, inefficient tools. Just like some people once thought with C, I thought a visual abstraction would go too far, too high level, to be a legitimate tool.

But it wasn’t long before I changed my mind about Webflow. It’s not some clunky tool that generates messy code as Dreamweaver did. It doesn’t dumb down fundamental paradigms of the web as we’ve seen in recent website builders like Squarespace, Wix, and countless others. Instead, it embraces concepts like the box model, flexbox, selectors, and responsive design and presents them in a visual interface.

What ultimately changed my mind was an interview with the CEO of Webflow, Vlad Magdalin, where he compared Webflow to the 3D animation software (18:10):

Travis Neilson (DevTips) interviews Vlad Magdalin (CEO, Webflow), and Barrett Johnson Barrett Johnson (Product Marketing Manager, Webflow)

I see Webflow as kind of like 3D animation software. Twenty years ago people had to understand vertex math, nerves, non-uniform rational B-splines — like these technical people had to do animation at Pixar — and then we created an abstraction layer […] where now, creative people, they still have to understand all these constraints […] but all this stuff is visual. […] We’re creating these visual abstraction to help people harness the power of that medium. We’re doing the same thing with Webflow.

Drawing this parallel changed my mind because it didn’t downplay the importance of core concepts. So many disciplines that were previously only practicable by people with a certain technical skillset — film, photography, music — have been made accessible to a wider range of people with the advent of tools that created visual abstractions for the medium. Webflow is making web development more accessible to people who don’t know how to code.

Does Webflow threaten our careers as developers?

This all sounds great for the average person or a designer who doesn’t know how to code, but what about us developers? Does this threaten our careers? Certainly. Tools like Webflow could eventually make handwritten code a thing of the past. Designers no longer need to work with web developers to build a website. However, worrying about this will not help save our careers.

So what should we do then? Embrace Webflow.

As web developers, I think we have a huge advantage over designers when it comes to learning to use Webflow, which is the importance of core concepts I mentioned earlier. We already know how the box model works. We know how to structure websites in order to create complex, responsive layouts. What we have is a very well-refined mental model of exactly how the web platform works which many designers lack.

Because of my knowledge HTML, CSS, and JavaScript, I became comfortable with developing websites in Webflow in just a couple days whereas someone who is not familiar with web technologies would have a much harder time.

Even when Webflow, or some other tool, progresses to the point where you can visually create complex apps with advanced logic, we will have even more of an advantage. We already know how program flow-control works. We know how to create loops, conditionals, and data structures from our knowledge of code. These core concepts will remain, but instead of programming with code, we can program with Webflow.

Code is just a byproduct of our thought processes.

As real developers, just because we know how to code, doesn’t mean we should always code. Code is just a byproduct of our thought processes. Instead of downplaying the legitimacy of tools like Webflow, we should do what we’ve always done as developers and embrace new tools and technologies that allow us to work more efficiently.

What really attracted me to Webflow in the first place was not the code-free designer — I love to code so that was initially a bit of a turnoff for me — but rather the integrated CMS, hosting, and e-commerce support (coming soon). These are often huge hurdles to overcome when building websites as a freelancer. Having these challenges taken care of out of the box means I can spend far less time per project, allowing me to accomplish more in less time.

Webflow is not perfect and it isn’t for every project, but I’m certainly not going to romanticize over handwritten code. Sometimes Webflow is the right tool for the job. We shouldn’t dig in our heels and dismiss Webflow as maybe good for prototyping. The tools we use to develop on the web are changing. We should embrace them.

More Posts

(c) 2020, David Leger