lit-and-flutter
Lit and Flutter
In this article I will go over how to set up a Lit web component and use it inline in the Flutter widget tree.
TLDR You can find the final source here.
The reason you would want this integration is so you can take an existing web app, or just a single part of it and embed it in the widget tree.
With it wrapped in Flutter you can call device APIs from event listeners on your web component.
For example you may have an app that handles purchases, and now you can call the in app purchase API or other device specific features not available on the web.
You also get a cross platform app that can be delivered to both Google Play and the App Store.
The web component will receive new code each time you update your site, so you do not have to ship an update each time the web component changes.
Prerequisites
More from rodydavis/skills
flutter-control-and-screenshot
Guide on how to control a Flutter app using flutter_driver via MCP and capture screenshots.
197how-to-build-a-native-cross-platform-project-with-flutter
Learn how to import `dart:html` and `dart:io` in the same Flutter project to create cross-platform plugins that work seamlessly on mobile and web.
59install-flutter-from-git
Install Flutter SDK via git clone and configure for all platforms
56how-to-build-a-webrtc-signal-server-with-pocketbase
Learn how to build a simple WebRTC video call application using PocketBase as a signaling server, enabling peer-to-peer communication with SQLite on the server and realtime updates via Server Sent Events.
55how-to-do-full-text-search-with-sqlite
Learn how to supercharge your SQLite databases with full-text search capabilities using the built-in fts5 extension, enabling efficient and powerful querying with the `MATCH` keyword.
55flutter-fastlane-one-click-beta
Deploy your Flutter app to the App Store and Google Play with ease using this step-by-step guide covering installation, project setup, Fastlane integration, and automated deployments with Automator.
55