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

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!