Menu
I have this project where I have to code a website and ios and android apps.
I have to do this with a very limited team (basically myself). So I want to share as much code between those platforms, to avoid maintaining different codebases as much as possible.
I have come to consider flutter : the logic (and interaction with the backend) in dart can be compiled to both ios and android, and to javascript for the web site to call. I also like how the UI is built using flutter.
For the web site, I know there is flutter web that can be used to do a web app, but I want my website to feel like a web site more than a single page app. I have thought about using React+Gatsby to do the website's ui, while calling the dart compiled js for the logic. That would enable high page loading speed, good seo, while keeping the interactivity of a react app and the single codebase logic through dart to js compilation.
I am wondering if this seems like a good approach to you, and if not, how you would do it.
In this approach, I am wondering if it would be possible to embedded flutter web widgets inside of react js components, always in a concern of maintaining as low platform specific code as possible. I have not found any other way of doing this than embedding them into iframes, which does not seem like a good idea, or does it ?
793
Flutter Web opens the door to building progressive web apps (PWAs) entirely in Dart. However, your Dart code will likely need to interop with JavaScript at some point to access browser APIs and/or your own custom JS apps. The following snippet demonstrates how access JS from a Flutter web app.
Now that you can run the weather app in the browser using Flutter, the next step is to build and copy it to the Node.js server to run alongside the API. The build command will produce the build/web folder containing all the static files that make up the weather app.
Well, to be honest, for many of the same reasons that you’d choose Node.js for your other web apps and APIs: it is incredibly good at servicing large volumes of simple requests, you can code your front end and back end in JavaScript, and so on. You might already have a Node.js API that serves data to your Flutter iOS or Android apps.
The fetchWeatherData function uses Dart’s http package to connect to the server over HTTP. There are other Dart packages that you could use, but this is the officially recommended package if you plan on adding web support to your Flutter app. Also make note of the WEATHER_API_URL constant.
Flutter Web is now available in a stable version for production.
Below answer is relevant back to the time when question was asked.
At the current date, I would recommend not to use Flutter Web for production as it's in Beta. The Flutter Team is still working on improving quality, performance and browser compatibility. You must be cautious about using it as you may run into bugs and some other complications.
Also, I believe that the community support for Flutter Web might be on a lower side as it's pretty new.
Another factor which bugs me is that the Flutter web apps can run on limited browsers as of now which would affect the reach to your user base:
Well, although it might be a hassle to handle different codebases for mobile and web platforms, I would still prefer to stick with React JS as it's much stable with better browser & community support as opposed to Flutter Web.
Good luck with your app! :)
130
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
