Dart Create React App #

Create Dart + React apps with no build configuration.

• Getting Started – How to create a new app.
• Todo List Example – How to develop an app bootstrapped with Dart Create React App.

Quick Overview #

pub global activate dart_create_react_app
export PATH=$PATH:~/.pub-cache/bin

dart_create_react_app my_app
cd my_app/
pub serve

Then open http://localhost:8080/ to see your app.

When you’re ready to deploy to production, create a minified bundle with pub build.

Get Started Immediately #

You don’t need to install or configure any extra tooling. They are preconfigured so that you can focus on the code.

Just create a project, and you’re good to go.

Getting Started #

Installation #

If you don't already have Dart installed, you can install using Homebrew on macOS.

$ brew tap dart-lang/dart
$ brew install dart --with-content-shell --with-dartium

Then, you can install dart_create_react_app globally.

pub global activate dart_create_react_app
export PATH=$PATH:~/.pub-cache/bin

Creating an App #

To create a new app, run:

dart_create_react_app my_app
cd my_app/

It will create a directory called my_app inside the current folder.

Inside that directory, it will generate the initial project structure and install the transitive dependencies:

my_app/
├── lib/
│   └── src/
│   |   └── my_app 
│   |   |    └── app.dart
│   └── my_app.dart
├── tool/
├── test/
│   └── unit/
│   |   └── my_app 
│   |   |    └── my_app_test.dart
├── web/
│   └── main.dart
│   └── index.css
│   └── index.html
│   └── logo.svg
├── .gitignore
├── pubspec.lock
├── pubspec.yaml
└── README.md

No configuration or complicated folder structures, just the files you need to build your app. Once the installation is done, you can run some commands inside the project folder:

pub serve #

Runs the app in development mode.

Open http://localhost:8080 to view it in the browser.

pub run dart_dev test #

Runs all tests located in the /test folder.

pub build #

Builds the app for production to the build folder.

It correctly bundles React in production mode and optimizes the build for the best performance.