webf-quickstart
WebF Quickstart
Note: Building WebF apps is nearly identical to building regular web apps with Vite + React/Vue/Svelte. The only difference is you replace your browser with WebF Go for testing during development. Everything else - project structure, build tools, testing frameworks, and deployment - works the same way.
⚠️ IMPORTANT: WebF Go is for development and testing ONLY. For production, you must build a Flutter app with WebF integration. Do NOT distribute WebF Go to end users.
Get up and running with WebF in minutes. This skill guides you through setting up your development environment, creating your first project, and loading it in WebF Go.
What You Need
Only Node.js is required - that's it!
- Node.js (LTS version recommended) from nodejs.org
- You do NOT need: Flutter SDK, Xcode, or Android Studio
WebF lets web developers build native apps using familiar web tools.
Step-by-Step Setup
More from openwebf/webf
webf-infinite-scrolling
Create high-performance infinite scrolling lists with pull-to-refresh and load-more capabilities using WebFListView. Use when building feed-style UIs, product catalogs, chat messages, or any scrollable list that needs optimal performance with large datasets.
15webf-native-ui
Setup and use WebF's Cupertino UI library to build native iOS-style UIs with pre-built components instead of crafting everything with HTML/CSS. Use when building iOS apps, adding native UI components, or improving UI performance.
14webf-async-rendering
Understand and work with WebF's async rendering model - handle onscreen/offscreen events and element measurements correctly. Use when getBoundingClientRect returns zeros, computed styles are incorrect, measurements fail, or elements don't layout as expected.
14webf-native-ui-dev
Develop custom native UI libraries based on Flutter widgets for WebF. Create reusable component libraries that wrap Flutter widgets as web-accessible custom elements. Use when building UI libraries, wrapping Flutter packages, or creating native component systems.
13webf-native-plugin-dev
Develop custom WebF native plugins based on Flutter packages. Create reusable plugins that wrap Flutter/platform capabilities as JavaScript APIs. Use when building plugins for native features like camera, payments, sensors, file access, or wrapping existing Flutter packages.
13webf-api-compatibility
Check Web API and CSS feature compatibility in WebF - determine what JavaScript APIs, DOM methods, CSS properties, and layout modes are supported. Use when planning features, debugging why APIs don't work, or finding alternatives for unsupported features like IndexedDB, WebGL, float layout, or CSS Grid.
13