This tutorial is the ultimate starting point for learning the development fundamentals for Webflow Apps. In this tutorial, you’ll learn how to register, build, and deploy a Webflow App that uses the Data and Designer APIs. By the end of this video, you’ll have a fully functional Webflow App that can interact with the page using the Designer APIs, and upload custom code to a site using the Data APIs.
Learn the ins-and-outs of Webflow App development, and build your very first starter App along the way.
00:00 — Intro to building Webflow Apps
00:28 — Workspace setup + Clone site
01:43 — App registration
05:03 — Cloning the code example
06:26 — Code review: Data Client
07:13 — Code review: API routes
11:43 — Code review: Designer Extension
13:58 — Running your App
15:40 — Hybrid App authentication
17:26 — Working with elements
22:48 — Working with custom code
26:13 — Bundling your App
29:54 — Outro
Webflow Developer Documentation: https://developers.webflow.com
Get started with Webflow Apps - Data Clients: https://developers.webflow.com/v2.0.0/data/docs/getting-started-data-clients
Get started with Webflow Apps - Data Extensions: https://developers.webflow.com/v2.0.0/designer/docs/getting-started-designer-extensions
Cloneable Site :https://webflow.com/@webflow-developers
Hybrid App Example: https://github.com/Webflow-Examples/hybrid-app-starter
Developer Workspace Plan: https://developers.webflow.com/data/docs/developer-workspace
Submit your Webflow App: https://developers.webflow.com/submit