react-native-vs-flutter
The exact same app developed in React Native and in Flutter. Allows an apples-to-apples comparison
Accompanying Blog Posts
- React Native or Flutter: Which should I choose? (Part 1)
- React Native or Flutter: Which should I choose? (Part 2)
- React Native or Flutter: Which should I choose? (Part 3)
Comparison Metrics
Lines of Code
Requirements
| Need | Why we need it | Where to get it |
|---|---|---|
| node and npm | We run a RESTful API to serve data | nodejs.org |
| mongoDB | For the movie database | mongoDB.com |
| flutter tools | To run Flutter projects | flutter.io |
| expo client | To run React Native projects | npm install --global expo@latest |
To run the Flutter project
To run the React Native project
- Setup the database (if you haven't already)
- Run the node/Express web server
- Run the React Native project
To set up the database
- Make sure a mongod server is running
- Open a bash/Powershell/terminal window
- cd to the "server" folder
- npm install (You only need to do this once)
- npm run setup This will create a new mongoDB database called 'daam' and load it up with realistic-looking data. You only need to do this one time, but feel free to do it as many times as you like to refresh the database.
To run the node/Express web server
- cd to the "server" folder
- npm run server
To run the Flutter project
- Make sure a device is connected or an emulator is running
- cd to the "daam_flutter" folder
- flutter run Or you can open the flutter project in your favorite IDE and run the project in the debugger. This has been tested in VS Code and Android Studio.
To run the React Native project
- Make sure a device is connected or an emulator is running
- cd to the "daam-react-native" folder
- npm run start