Webflow Custom Development

‍We make code-heavy Webflow sites easy.

How we Develop

We build a LOT of projects on Webflow.

For most projects, we prefer to develop with TypeScript. It adds readability, code consistency, and modularity across projects and source code files.

We protect and version your code in a GitHub repository. , which keeps messy code outside of the Webflow designer where it's safe from accidental edits.

And we use a high-performance Content Delivery Network ( CDN ) such as jsDelivr or Netlify to deliver the code into your Webflow site.

Sound complex? It's not, and it means a better Webflow site, and a far better development environment for you to add features in.

This setup gives you the development environment Webflow is sorely missing, and it adds ZERO cost to your monthly hosting.

On top of all this awesomeness, we have a special testing framework we call DevProxy, which makes it possible to test code changes against your live site, before you deploy them.

TypeScript

For most projects, we prefer to develop with TypeScript.

TypeScript is based on JavaScript and includes all of its features - plus additional capabilities that make TypeScript code far more maintainable, scalable, and robust for Webflow development.

Here are a few;

‍Static Typing: TypeScript allows you to define variable types. This helps catch type-related errors at compile-time rather than runtime.
Interfaces: You can define interfaces, which allow you to shape object structures and enforce contracts within your code.
Generics: Generics provide a way to make components work with any data type and not restrict them to a single data type.
Enums: TypeScript supports enumerations, which are a way of giving friendly names to sets of numeric values. More readable code.
Access Modifiers: With TypeScript, you can use public, private, and protected modifiers to control the accessibility of class members.
Namespaces: TypeScript supports namespaces for organizing code and preventing naming collisions.
Advanced Types: TypeScript offers advanced types like union types, intersection types, and type guards, which are not available in regular JavaScript.
Advanced Tooling: With the static types, editors and IDEs can provide richer autocompletion, navigation, and refactoring capabilities, making development faster and more efficient.
Build targets: When you transpile TypeScript into JavaScript, you can choose different configurations for the features your want. Code can be minified and bundled for hyper-fast downloads.

The TypeScript Advantage

Using TypeScript gives us an edge;

Better, faster development
Less risk of errors
Far more readable code with better documentation
Better structured projects, highly modularized
More reusable code, with better class structures

We highly recommend it, and use it whenever possible.

GitHub Repository

Keep your code and version history safe.

GitHub is the industry standard for source control management ( SCM ). It keeps your code secure and well-protected, and remembers every past version you've had as well so work is never lost.

We typically;

Setup a GitHub repo for every project.
Use GitHub codespaces for the development work.
Serve from GitHub codespaces for dynamic testing work.
Deploy updates from GitHub when you are ready to release new changes to your public website.

It's an ideal environment for team development too.

jsDelivr | Netlify CDN Delivery

Deliver your code FAST.

Rather than embed huge amounts of code directly into the custom code areas of your Webflow site, we deploy and serve from CDNs. This is far easier to manage, and avoid the risk of accidental code damage as you're editing your Webflow project.

There are two we use most often;

jsDelivr is FREE and is great for versioned releases, but requires that your GitHub repository be public.
Netlify supports CDN delivery from private repositories, however requires the paid service to do this.

Sygnal DevProxy

TEST your code against your live Webflow site, before you deploy it.

On top of all of the other benefits this setup offers, you can now test your LIVE site with new code changes, before the public gets those changes.

We call this technology DevProxy, and it's become a core part of our advanced testing framework.

And guess what? It's also free to our valued clients, as part of our development service.