redandblue :: Razzle x After.js
This is a basic, bare-bones starter template. It has been kick-started with Razzle and After.js. It also includes styled-components, Prettier for code style and Jest for testing. Basically, all you'll need to build magnificent web application.
Clone it, modify it and you have your own custom project with all the cool stuff.
ℹ️ This project needs a nice name!
How to use
git clone https://github.com/redandbluefi/redandblue-after.git <customer-folder>
cd <customer-folder>
npm install
npm run dev
First time setup
- Install Prettier plugin to your text editor!
- More details: https://prettier.io/docs/en/editors.html
- Setup your NODE_ENV
- e.g. Add
export NODE_ENV=development
to your ~/.bash_profile
- e.g. Add
How to run tests
npm test
Project also includes Prettier, which automatically formats your code on each commit.
You can also run it manually with npm run prettify
.
How to run production build and server
npm start
Features
- Great developer experience
- Universal ES6, ES7, ES8...
- Server-side rendering
- Top-notch performance
- ➡️ Bundling
- ➡️ Tree shaking
- ➡️ Code splitting
- ➡️ Critical CSS
- gzip
- Internationalization & Localization (see
docs/Internationalization.md
) - Progressive Web App (Service Worker)
- Error handling
- Environment-specific configurations
- Easy deployment
Additional we could consider adding (or should be easy to add per project)
- HTTP/2
- Font Awesome
- AMP (Accelerated Mobile Pages)
- Redux
- GraphQL
- Improved logging
Recommended development tools
Some tools that work well with this setup and make development easier. All optional, but highly recommended.
- Google Chrome
- Chrome's developer tool (F12) 💙
- Postman (Chrome application)
- For manual testing of APIs
- React (Chrome plugin)
- Redux (Chrome plugin)
- JSON Viewer (Chrome plugin)
- Gliffy diagrams (Chrome application)
- Atom
- language-babel (Plugin)
- Markdown Preview Plus (Plugin)
- Color picker (Plugin)
- file-icons (Plugin)
- autocomplete-emojis (Plugin)
How to customize this setup
This setup is based on Razzle, which provides pre-configured everything. However, those everything can also be customized. See details on jaredpalmer/razzle.
Credits
Big thanks to open source community!