https://github.com/smokes/react-fullstack-quickstart
Fullstack boilerplate to quickstart a project with React, Webpack and Express
https://github.com/smokes/react-fullstack-quickstart
babel boilerplate create-react-app-manually express jsx react webpack
Last synced: about 1 year ago
JSON representation
Fullstack boilerplate to quickstart a project with React, Webpack and Express
- Host: GitHub
- URL: https://github.com/smokes/react-fullstack-quickstart
- Owner: smokes
- License: mit
- Created: 2018-11-10T12:25:05.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2022-02-10T16:45:34.000Z (over 4 years ago)
- Last Synced: 2023-03-21T10:16:10.983Z (over 3 years ago)
- Topics: babel, boilerplate, create-react-app-manually, express, jsx, react, webpack
- Language: JavaScript
- Size: 29.3 KB
- Stars: 5
- Watchers: 1
- Forks: 1
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# react-fullstack-quickstart
[](https://travis-ci.org/smokes/react-fullstack-quickstart)
[](https://GitHub.com/smokes/react-fullstack-quickstart/issues/)
[](https://www.codacy.com/app/smokes/react-fullstack-quickstart?utm_source=github.com&utm_medium=referral&utm_content=smokes/react-fullstack-quickstart&utm_campaign=Badge_Grade)
I figured out i could learn how to setup my own fullstack boilerplate with React, Webpack and Express.
## Quick Setup
```bash
# 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
```bash
# 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
[](https://raw.githubusercontent.com/smokes/react-fullstack-quickstart/master/LICENSE)