https://github.com/alexilyaev/react-es6-starter

A modern boilerplate for React projects
https://github.com/alexilyaev/react-es6-starter

es6 react starter webpack

Last synced: 2 days ago
JSON representation

A modern boilerplate for React projects

• Host: GitHub
• URL: https://github.com/alexilyaev/react-es6-starter
• Owner: alexilyaev
• Created: 2017-04-07T18:12:48.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2021-03-30T18:51:27.000Z (over 3 years ago)
• Last Synced: 2024-05-29T06:51:45.268Z (5 months ago)
• Topics: es6, react, starter, webpack
• Language: JavaScript
• Homepage:
• Size: 873 KB
• Stars: 6
• Watchers: 2
• Forks: 2
• Open Issues: 8
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# [React ES6 Starter](https://github.com/alexilyaev/react-es6-starter)

[![CircleCI](https://circleci.com/gh/alexilyaev/react-es6-starter.svg?style=shield&circle-token=e51a95d02f9b923f13cb91e1ba62d9250bc3b961)](https://circleci.com/gh/alexilyaev/react-es6-starter)

[![codebeat badge](https://codebeat.co/badges/9b379fde-5e50-4c18-81b5-3b27b9bf7fae)](https://codebeat.co/projects/github-com-alexilyaev-react-es6-starter-master)

[![Dependency Status](https://david-dm.org/alexilyaev/react-es6-starter.svg)](https://david-dm.org/alexilyaev/react-es6-starter)

[![Dependency Status](https://david-dm.org/alexilyaev/react-es6-starter/dev-status.svg)](https://david-dm.org/alexilyaev/react-es6-starter#info=devDependencies)

## Features

- **Webpack 4**

  - Transpiles `.js` files using **Babel 7** (settings in `.babelrc`)

  - Transpiles `.scss` files using **node-sass**

  - **ESLint** - Lints `js` files on changes (rules in `.eslintrc`)

  - **Stylelint** - Lints `scss` files on changes (rules in `.stylelintrc`)

  - **PostCSS** plugins (settings in `postcss.config.js`)

    - Autoprefixer (supported browsers list in `browserslist` file)

    - cssnano - To compress the resulting CSS

  - Dynamic `index.html` generation

  - Dynamic build file names with hash for cache busting

  - Automatically builds a `vendor` bundle with all packages imported from `node_modules`

- React

  - **React Hot Loader v4** - Simplified hot reloading setup

  - **React Router v4**

    - HTML5 History API (non hash routes)

## Getting Started

1. Install Node.js (choose Current)

   - From [nodejs.org](https://nodejs.org/) (All platforms)

   - Or using [Homebrew](http://blog.teamtreehouse.com/install-node-js-npm-mac) (Mac)

   - Or any other [package manager](https://github.com/joyent/node/wiki/Installing-Node.js-via-package-manager)

1. `git clone` or [Download](https://github.com/alexilyaev/react-es6-starter/archive/master.zip) this repo

   - If using clone, remove the `.git` folder and [init a new Git repo](https://help.github.com/articles/adding-an-existing-project-to-github-using-the-command-line/) (name it something else)

1. Update the README to your needs

1. Install dependencies (at the root of the repo):

   ```

   npm install

   ```

## Development

#### Run webpack-dev-server

```

npm start

```

- Open `http://localhost:8080`

## Build the project for deployment

```

npm run build

```

- Must use a server that serves missing routes as `index.html`

### To run the build locally

```

npm i -g serve

serve -s dist

```