I want to show you how this code can be converted into native, and can be built and run on Android and iOS platforms.įirst we need to create a separate branch and adapt its pubspec.yaml for native Flutter.
Adds welcome text Widget addWelcomeText() Ĭheckout my article about making this page responsive Part-2: Flutter-to-fly landing page for Native platform Navigate to current working directory and get all dependencies. web/index.html and web/main.dart needs to be added as mentioned here com /flutter/ flutter_web path : packages / flutter_web_testĬreate a web directory to host the entry point for the web app at root level (same level as lib directory). com /flutter/ flutter_web path : packages / flutter_web_ui flutter_web_test : git : url : https :// github. com /flutter/ flutter_web path : packages / flutter_web flutter_web_ui : git : url : https :// github. 4 # These overrides tell the package tools to get them from GitHub dependency_overrides : flutter_web : git : url : https :// github. 0 + 1 dependencies : flutter_web : any dev_dependencies : flutter_web_test : any # dependencies to enable the Dart web build system build_runner : ^ 1.2. Name : landingpage description : Cross platform sample landing page implemented in Flutter version : 1.0. This is how pubspec.yaml for web app will look like: I would keep native code in default branch master.Īdapt pubspec.yaml for Web as described in this link. We would need this for native project in another branch say master. Its recommended to create a git branch to host web app code for now until web comes out of tech-preview and experimentation.Ĭreate a Flutter Project in Android Studio.Ĭopy pubspec.yaml to for backing up native platform settings. Plug-ins used in flutter native apps can't be used in web apps. Web app's code uses specific web libraries. Note: As of now (June 3rd, 2019), there's no actually one code base solution exists for cross-platform Flutter. This post will have two sections to it:įlutter-to-fly landing page for Web ( web branch of source code).įlutter-to-fly landing page for Native Android and iOS platforms ( native branch of source code).Ĭheckout the companion video tutorial Part - 1:Ĭheckout the companion video tutorial Part - 2: Part-1: Flutter-to-fly landing page for Web
This post is about how to design landing page for a hypothetical mobile and web app for Flutter resources say "Flutter-to-Fly !".