In the world of web development, it’s incredibly important to keep the code in your projects clean and organized. This has multiple benefits, including easy navigation, more efficient build processes, and easy handoff to other developers.
Here at Ammo we use Webflow, a visual development platform for building completely custom websites. It is incredibly powerful and is quickly becoming the go-to for building on the web. Webflow is unique in that you can create and manipulate CSS classes similarly to traditional web development. This provides a lot of power to the developer, but opens up the possibility of creating messy, unorganized code.
As we’ve grown as a studio and have taken on more and bigger projects, we’ve seen the importance and positive impact of clean development practices and systems. One of the systems that we lean on heavily at Ammo is Client-first, a class-naming system developed by Finsweet.
Why use Client-first?
Here are several reasons why we love using Client-first (and class-naming conventions in general) in all of our projects:
Clean, organized builds
This is likely the most obvious benefit to using Client-first, or any other class-naming convention. If you’re coming from a traditional front-end dev background, you likely understand the impact that organized code has on a project. For those who are maybe newer to front-end development, class naming conventions give you a framework to work within. They provide a starting point and a level of consistency throughout your project that makes working in a project much easier and enjoyable.
With Client-first, our devs don’t need to create new frameworks for each new project. They have a foundation to work from that creates numerous positive impacts for both our team and the clients we work with.
Quicker development times
Working in clean and organized projects makes it easy to build quickly without fumbling over elements. Outside of the Webflow ecosystem, a popular CSS framework that provides a similar result is Tailwind CSS. Think of Client-first and Tailwind like tools that you
Easy handoff to clients
This is one of the biggest reasons we use Client-first in our projects. With public documentation and a naming system that is easy to understand, we always feel confident that when we hand off Webflow projects to clients, they will be able to open up the Designer on their own and understand how we built their site. Not only that, but they can then go in and build out new components for themselves or make edits to things like spacing and typography without ruining styles in the rest of their project.
Easy transition from other developers
Within our team and other teams who use this framework, Client-first serves as a shared language. It’s such a solid system that when we need to pass a project between devs on our team, each devs feels as if they are in a project that they built themselves. With more of the Webflow industry leaning into Client-first, we know that when projects transition between dev teams who use the system, the client will not have to experience
What this means for our clients
As mentioned above, there are several tangible benefits that our customers inherit as a result of our use of Client-first in projects. There are also a few non-tangible, or less obvious things that our clients benefit from. They can expect consistency in build quality and practice. They can feel confident that the code that makes their projects run is reliable and clean. Maybe most importantly, when we use Client-first, we give our clients the power to own and improve their projects if and whenever they desire.