Introduction to “No Code”

Objectives and Overview

Webflow is a key company and product leading the “No Code Movement” that’s gained momentum in 2019. This phrase can be confusing, as Webflow and many of these other visual tools are built with code and output code. This lesson provides some context around this phrase.

Lesson Objectives

  • Identify what is meant by the phrase “no code” as an approach to web and app creation

Why “No Code”?

Visual design tools such as Webflow allow you to focus on building confidence with core skills such as solving user needs and creating experiences using core design principles. Much like how Scratch’s block-based approach lets new learners focus on foundational programming concepts, Webflow and other visual tools let creators focus on building a website, app, or product without worrying about programming.

Using “no code” tools such as Webflow allows you to focus on design decisions without needing to worry about having the HTML, CSS, and JavaScript knowledge to implement them. These types of tools work best when you can leverage your underlying knowledge of web technology, so try not to consider this an absolute replacement for those skills. Instead, use Webflow while simultaneously learning the underlying technologies.

Jeremy Q. Ho wrote an article about no code from the perspective of a programmer. You can read their article here: No Code is New Programming.

“No Code” for Web Development

Webflow is an effective, flexible, and powerful tool for creating websites for clients. The visual editor allows you to focus on solving problems, meeting client needs, and emphasize creating a positive user experience. The visual editor uses actual CSS properties, so you’re able to leverage (and grow) your CSS skill as you use Webflow.

Since Webflow’s visual editor is so thorough, you’re able to quickly get up and running with creating a site. While the free tier is limited, you’re more than able to experiment with the tool to see if you like it. Webflow’s pricing plans are affordable and there is support for transferring the billing to clients, making it an excellent tool for freelancers.

Familiarity and comfort with HTML and CSS aren’t required to use Webflow, but knowing how these technologies work enhances your ability to be productive. Webflow is built on these technologies and transforms your visual designs into HTML, CSS, and JavaScript. The design language used in Webflow’s editor is the same language used in HTML and CSS.

“No Code” for Product Development

Ryan Hoover, the founder of Product Hunt, wrote an article about how “no code” products. Check it out here: The Rise of “No Code” – Medium. Several of the featured products (apps, tools, and resources) on Product Hunt are created with “no code” tools such as Webflow. One of the key reasons for this is that these tools allow folks to create an MVP (minimum viable product) of an idea. Tools like Webflow help with this process and allow creators to focus on designing their product or site.

Ran Segall, an early Webflow adopter, content creator, and entrepreneur posts several videos about design and why he loves Webflow. Here’s a video from 2016 where he discusses why he uses Webflow and walks through a timelapse of building one of his business sites with Webflow:

Ran’s YouTube channel Flux has lots of high-quality content. Be sure to keep it on your radar as a resource.