Editor’s Note: We’ve partnered with toddle.dev to bring you this article by Andreas, their co-founder. At Codrops, we’re always excited to highlight tools that push the boundaries of web development, and we believe toddle is a standout in bridging the gap between design and development. Curious to try it? Use our link for a 10% discount. Here’s Andreas in his own words.
Why use a text editor to build visual web apps? That question has been looming in my head for the past 5 years.
Before I founded toddle, I spent 20 years building web applications for anything from small startups to large enterprises. I saw many new tools and frameworks come and go during that time. The tools we use today are much better than what was available in the early 2000s, but one thing remains unchanged: We still build web applications by writing code into a text editor.
While I was coding web applications, my co-founder was working as a product designer. While coding might not have changed much in 20 years, design tools are a different story. Tools like Figma have enabled designers to build powerful design prototypes without technical knowledge, which was impossible when I started developing years ago.
Throughout our careers, we have spent countless hours handing work back and forth from designer to developer. This made us wonder: What if we could eliminate design handoffs?
Figma is a great design tool, but what if you could build the UI right there instead of just creating a design to be handed off to a developer? What if you could build applications using the same tools you use to make designs in Figma?
That’s toddle.dev, a visual interface where you can build feature-rich web applications. It’s designed to bring large-scale dev teams together in the same development environment, removing duplicate work. The visual interface makes it much faster to set up the standard boilerplate work that comes with web applications, such as setting up API calls and building out UI components.
Toddle’s visual framework is a new take on modern web development. It’s built around the latest development advances in the past 10+ years. It brings it front and center in a visual development environment accessible to developers and designers.
Isn’t this just no-code?
A visual editor is nothing new. One of the first reported cases was GRAIL from the 1960s, when you could draw to create a program.
Since then, we’ve seen tools like Dreamweaver, Flash, and Bubble try to move developers to a visual editor. However, the consensus is still that a text editor is the superior tool to build visual web apps. It’s odd because the visual editor has taken other industries by storm; we build AAA games in editors like the Unreal engine and Unity.
Although most websites are built in WordPress and Webflow, web developers still prefer to recreate Figma files in a text editor.
The main reasons?
- Flexibility
- Collaboration
- Sharing
Developers thrive on flexibility. They prefer tools that let them build without limits, so their tool of choice for web development is often a simple text editor. It doesn’t come loaded with features, but it offers complete creative freedom and connects seamlessly with tools that help bring ideas to life. Toddle is a low-level abstraction programming language designed to ensure maximum flexibility. It’s designed around the well-established and ever-evolving web platform and is designed to grow with it.
Collaboration is the cornerstone of effective teams. Without it, progress slows—a problem Linus Torvalds solved when he created Git. Toddle has a robust version-control system to ensure large teams can work in parallel and ship at maximum speed. While visual tools can accelerate workflows, the adage still holds: “The best line of code is the one you don’t have to write.” Writing code for visual interfaces takes time, but access to prebuilt modules from other developers eliminates redundant effort and speeds up development. Toddle’s package system enables you to benefit from the community.
What does toddle look like?
Here’s a video where you can see me build a button component in toddle to understand better what to expect.
Built for the web by builders of the web
There are distinct details between developers and designers, and we needed to build a system that works for both. Developers see modules. Designers see a canvas. Visual developers see both. A great development tool empowers users to design, build, and customize without compromise. Default components are helpful, but they shouldn’t box you in. You need the flexibility to create your standards, styles, and elements.
None of this should come at the cost of performance. Toddle is performant by default—rendering as quickly, if not faster, than hand-written custom code.
The real challenge was never the visual approach—it was the tools. They simply weren’t good enough. A modern visual framework must perform flawlessly, offer unlimited creative potential, reduce time to market, and enable seamless collaboration across multi-tenant teams.
Toddle unlocks a new way of working. It brings designers and developers together in a shared environment where creativity flows, collaboration thrives, and the tools you love are always at your fingertips.It’s a different way to develop for the web, and we are trying to bring the fun back into web development. We recently concluded the Bad UI World Cup, where developers and designers could build bad UIs that would shame even the most aggressive online travel agency.
A tool for professionals
You can build anything in toddle, so this tool takes a minute to learn. If you’d like to see if toddle is for you, I recommend starting with the course First week in toddle; this tutorial is an excellent introduction to toddle and its core concepts.
If you want to explore this further, I recommend a tutorial by our product designer, Miguel. Miguel builds a neat MacOS dock animation. It still blows my mind when I see how a product designer can unleash themselves in toddle.
Prebuilt templates and UI kits are also available. One of my favorites is this free eCommerce template with a backend that creates a fully-fledged e-commerce store. It’s almost as easy as Shopify but with much more customization. We are regularly making more templates available to the community, and all you have to do to access them is sign up for toddle and start a project.
I’m quite excited to hear your thoughts, and if you have any feedback or questions, please feel free to reach out to me on Bluesky or X.