Please note that this project, while it served its purpose well, is no longer maintained. Thank you for understanding.
A React boilerplate that's always ahead! Click here to check out the live demo.
This boilerplate has one thing in mind - use as few dependencies as possible, while having all the best features. If something is not absolutely necessary, you won't find it here.
Reactizer's goal is mainly to provide you with the best practices of building a modern React application. Feel free to open an issue or a pull request!
All the tech I chose is super new, sometimes even in an alpha version - thus if you'd like to use it for production, I recommend scaling those unstable versions down.
To check out the backend, click here!
The features currently present in the demo are as follows:
- Server-side rendering, data fetching and i18n
- Persistent, real-world example - your registration and TODOs are saved on my heroku app. Mind: it's just a demo. I recommend making up some arbitary username/email/password. I use
test
, with passwordTesttest1
. - Truly universal architecture - shared Redux code in mobile, browser and server
- Protected routes with JWT authentication
- Immutable data
- Full-out Webpack: hot-reloading, tree-shaking
- React and React Native as the core libs
- React Router for web routing
- Redux with React Redux data flow
- Reselect derives the data
- Redux Observable for async flow
- Redux Form Lite makes forms uber-easy
- React Intl i18n
- Immutable data
- Jest testing
- Babel for all the ES6+ goodness
- Material UI makes the web sexy
- Webpack 2 client compilation + Hot Reloading
- ESlint and Airbnb level code quality
- Gulp tasks, because
npm
just doesn't scale
Also in the bundle:
- Sprites with
gulp.spritesmith
- Translation message collection with
babel-plugin-react-intl
- Server compilation with Babel, because that's the way it's supposed to be
- No
react-hot-loader
,react-transform
norwebpack-isomorphic-tools
- I keep HMR and Webpack vanilla
React Native requires (due to it's Babel 5 dependency) babel-core
and babel-cli
to be placed in dependencies, instead of dev dependencies.
Having problems? Try running watchman watch-del-all
Simply npm i
. Then you have these following tasks available:
CORE
Web:
npm start
- starts HMR and server (default at :8080)npm run server
- runs the servernpm run bundle
- prepares all assets and builds the client and server code
Native:
npm run ios
- runs react native iosnpm run android
- runs react native androidnpm run native
- runs react native servernpm run native:clean
- runs react native server and clears the cache
Common:
npm test
- runs testsnpm run lint
- runs eslint
OTHER
npm run messages
- fetch all messagesnpm run lint:fix
- runs eslint and fixes problems, if it cannpm run test:coverage
- runs tests and generates coverage infonpm run test:watch
- runs tests in watch mode
- Koa2 (once Node supports
async await
)