Awesome Open Source
Awesome Open Source

react-starter-boilerplate-hmr

React Starter Boilerplate with React Fast Refresh and Webpack 5

Tutorial

The tutorial on my blog site is the most up-to-date with this template. Visit my blog entry where I go step-by-step on how to build this boilerplate from scratch.

Features

  • React 17
  • React Fast Refresh
  • React Router 5
  • Webpack 5
  • Semantic UI as the CSS Framework
  • CSS Autoprefixer
  • CSS Modules with SourceMap
  • @babel/plugin-proposal-class-properties
  • @babel/plugin-syntax-dynamic-import
  • Code splitting by Route and Vendor
  • Webpack Bundle Analyzer
  • Take a look at package.json

Usage

Install dependencies

$ yarn

Run development server

$ yarn dev

Building

$ yarn build

Will create a dist directory containing your compiled code.

Depending on your needs, you might want to do more optimization to the production build.

Webpack Bundle Analyzer

Run in development

$ yarn dev:bundleanalyzer

Run on the production oprimized build

$ yarn build:bundleanalyzer

Giving Back

If you would like to support my work and the time I put in making tutorials, you can click the image below to get me a coffee. I would really appreciate it (but is not required).

Buy Me A Coffee

-Esau Silva


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (68,071
react (5,167
boilerplate (604
css-modules (72
code-splitting (43
semantic-ui (37
react-boilerplate (25
babel7 (23

Find Open Source By Browsing 7,000 Topics Across 59 Categories