react-fullstack-quickstart

I figured out i could learn how to setup my own fullstack boilerplate with React, Webpack and Express.

Quick Setup

# Clones the repository
$ git clone https://github.com/smokes/react-fullstack-quickstart.git
# Changes directory
$ cd react-fullstack-quickstart
# Installs all dependencies
$ npm install
# Bundles react code and injects it into the template html file
$ npm run build

Features

Latest ECMAScript features

It uses @babel/preset-env and @babel/preset-react for transpiling code

Express.js backend

Uses Express.js for server-side with hot reloading thanks to nodemon

Code linting + formatting on save

Thanks to Eslint and Prettier code formatting is much easier and is done automatically on file save

Unit testing with jest and enzyme

Jest is already configured to work with enzyme so you could easily test your React Components

Sass support

Done through node-sass with Webpack's sass-loader

NPM Scripts

# Builds your React application and runs an express instance to serve them with the api
$ npm start
# Builds your React application into the /builds directory without the express server
$ npm run build
# Runs the the express.js server with nodemon
$ npm run server
# Spawns a webpack-dev-server for realtime jsx editing with hot reload
$ npm run client
# Runs a webpack-dev-server on port 3000 with an express api proxified from port 8080
$ npm run fullstack
# Runs unit tests with jest
$ npm run test
# Runs unit tests with jest and watches for file changes
$ npm run test-watch

LICENSE

Published under the MIT LICENSE, for more info check