/webpack-4-react-boilerplate

A simple Webpack 4 React Boilerplate

Primary LanguageJavaScriptMIT LicenseMIT

webpack 4 React boilerplate GitHub license

A simple and complete Webpack 4 React Boilerplate.

  • Ready to start React App ⚡
  • Image loader configured 📷
  • SASS and CSS loaders configured 🎨
  • Hot reload configured ☀️
  • Unit test tools configured 🔬
  • Production build optimized 📈

Motivation

The purpose of this boilerplate is help to create new apps and projects. It's easy to customize and if you need help to understand you can check the commits for a step-by-step guide.

It´s a solid base which will help to understand webpack core concepts.

Getting Started

To start you can simply download the boilerplate and unzip it into your working directory. You can also clone if you want to contribute.

Prerequisites

  • Node.js v8 or above

You can check your node version using the command:

node --version

Installing

Install dependencies and start using yarn:

yarn install
yarn start

Or via npm:

npm install
npm start

Testing

You can run your tests using:

yarn test

It´s possible to generate the code coverage of your code. Jest will generate a HTML file with all information from your tests. To do this run the command:

yarn test:coverage

Production build

You can generate an optimized distribution bundle. To do this run the command:

yarn build

It´s possible to check the size and content of your bundled file. To do this run the command:

yarn analyze

That´s it! Remember to change the project information in package.json, README and LICENSE if necessary. 🎓

Give the project a star if you liked it. Happy Hacking! 😎 ⭐

Built With

  • webpack - Static module bundler
  • React - JavaScript library for building user interfaces
  • Babel - EcmaScript Transpiler
  • Yarn - Dependency Management
  • Jest - JavaScript Testing
  • Enzyme - Component tests for React

Contributing

Suggestions or pull requests are welcome.

For major changes, please open an issue first to discuss what you would like to change.

Versions

  • v1.0 - A complete webpack 4 configuration
  • v1.1 - Production build optimization

Click here to see or download the project in a specific tag.

License

This project is licensed under the MIT Licensed - see the LICENSE file for details