├── .eslintignore
├── .gitignore
├── readme.md
├── .prettierignore
├── .prettierrc
├── testSetup.js
├── jest.config.js
├── src
    ├── App.spec.js
    ├── App.js
    ├── styles.css
    ├── index.html
    ├── index.js
    └── DefaultErrorBoundary.js
├── webpack.config.dev.js
├── .babelrc
├── webpack.config.prod.js
├── .eslintrc.json
├── webpack.config.base.js
└── package.json


/.eslintignore:
--------------------------------------------------------------------------------
1 | dist


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | dist


--------------------------------------------------------------------------------
/readme.md:
--------------------------------------------------------------------------------
1 | # React Boilerplate
2 | 


--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | dist
2 | package-lock.json


--------------------------------------------------------------------------------
/.prettierrc:
--------------------------------------------------------------------------------
1 | {
2 |   "tabWidth": 2,
3 |   "semi": false,
4 |   "singleQuote": true
5 | }


--------------------------------------------------------------------------------
/testSetup.js:
--------------------------------------------------------------------------------
1 | import 'jest-dom/extend-expect'
2 | import 'react-testing-library/cleanup-after-each'
3 | 


--------------------------------------------------------------------------------
/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   setupTestFrameworkScriptFile: '<rootDir>/testSetup.js'
3 | }
4 | 


--------------------------------------------------------------------------------
/src/App.spec.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import { render } from 'react-testing-library'
 3 | import App from './App'
 4 | 
 5 | describe('App', () => {
 6 |   it('Renders without error', () => {
 7 |     render(<App />)
 8 |   })
 9 | })
10 | 


--------------------------------------------------------------------------------
/webpack.config.dev.js:
--------------------------------------------------------------------------------
 1 | const merge = require('webpack-merge')
 2 | const baseConfig = require('./webpack.config.base')
 3 | 
 4 | module.exports = merge(baseConfig, {
 5 |   mode: 'development',
 6 |   devServer: {
 7 |     port: 9000
 8 |   },
 9 |   devtool: 'source-map'
10 | })
11 | 


--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import { hot } from 'react-hot-loader'
 3 | 
 4 | class App extends React.Component {
 5 |   render() {
 6 |     return (
 7 |       <div>
 8 |         <h1>Hello World.</h1>
 9 |       </div>
10 |     )
11 |   }
12 | }
13 | 
14 | export default hot(module)(App)
15 | 


--------------------------------------------------------------------------------
/src/styles.css:
--------------------------------------------------------------------------------
 1 | html {
 2 |   box-sizing: border-box;
 3 |   font-size: 16px;
 4 |   font-family: sans-serif;
 5 | }
 6 | 
 7 | *,
 8 | *:before,
 9 | *:after {
10 |   box-sizing: inherit;
11 | }
12 | 
13 | body,
14 | h1,
15 | h2,
16 | h3,
17 | h4,
18 | h5,
19 | h6,
20 | p,
21 | ol,
22 | ul {
23 |   margin: 0;
24 |   padding: 0;
25 | }
26 | 
27 | ol,
28 | ul {
29 |   list-style: none;
30 | }
31 | 
32 | img {
33 |   max-width: 100%;
34 |   height: auto;
35 | }
36 | 


--------------------------------------------------------------------------------
/.babelrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "presets": [
 3 |     ["@babel/preset-env", {
 4 |     "targets": [
 5 |       "last 2 versions",
 6 |       "not dead",
 7 |       "not < 2%",
 8 |       "not ie 11"
 9 |     ],
10 |     "useBuiltIns": "entry"
11 |   }],
12 |   "@babel/preset-react"
13 |   ],
14 |   "plugins": [
15 |     "react-hot-loader/babel",
16 |     "@babel/plugin-proposal-class-properties",
17 |     "@babel/plugin-syntax-dynamic-import"
18 |   ],
19 |   "env": {
20 |     "test": {
21 |       "plugins": ["dynamic-import-node"]
22 |     }
23 |   }
24 | }


--------------------------------------------------------------------------------
/src/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 |   <meta charset="utf-8" />
 5 |   <meta http-equiv="X-UA-Compatible" content="IE=edge">
 6 |   <title>React Boilerplate</title>
 7 | </head>
 8 | <body>
 9 |   <div id="app"></div>
10 |   <% if(process.env.NODE_ENV === 'production') { %>
11 |   <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
12 |   <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
13 |   <% } %>
14 | </body>
15 | </html>


--------------------------------------------------------------------------------
/webpack.config.prod.js:
--------------------------------------------------------------------------------
 1 | const merge = require('webpack-merge')
 2 | const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
 3 | const baseConfig = require('./webpack.config.base')
 4 | 
 5 | module.exports = merge(baseConfig, {
 6 |   mode: 'production',
 7 |   plugins: [
 8 |     new BundleAnalyzerPlugin({
 9 |       analyzerMode: 'static',
10 |       openAnalyzer: false,
11 |       reportFilename: 'bundle_sizes.html'
12 |     })
13 |   ],
14 |   externals: {
15 |     react: 'React',
16 |     'react-dom': 'ReactDOM'
17 |   }
18 | })
19 | 


--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import ReactDOM from 'react-dom'
 3 | import '@babel/polyfill'
 4 | import App from './App'
 5 | import DefaultErrorBoundary from './DefaultErrorBoundary'
 6 | import './styles.css'
 7 | 
 8 | if (process.env.NODE_ENV === 'development') {
 9 |   const axe = require('react-axe')
10 |   axe(React, ReactDOM, 1000)
11 | }
12 | 
13 | ReactDOM.render(
14 |   <React.StrictMode>
15 |     <DefaultErrorBoundary>
16 |       <App />
17 |     </DefaultErrorBoundary>
18 |   </React.StrictMode>,
19 |   document.getElementById('app')
20 | )
21 | 


--------------------------------------------------------------------------------
/src/DefaultErrorBoundary.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import propTypes from 'prop-types'
 3 | 
 4 | export default class DefaultErrorBoundary extends React.Component {
 5 |   state = {
 6 |     isError: false
 7 |   }
 8 | 
 9 |   static getDerivedStateFromError() {
10 |     return { isError: true }
11 |   }
12 | 
13 |   static propTypes = {
14 |     children: propTypes.node.isRequired
15 |   }
16 | 
17 |   render() {
18 |     const { isError } = this.state
19 |     const { children } = this.props
20 |     return isError ? <div>Something went wrong!</div> : children
21 |   }
22 | }
23 | 


--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "parser": "babel-eslint",
 3 |   "env": {
 4 |     "browser": true,
 5 |     "commonjs": true,
 6 |     "es6": true,
 7 |     "node": true,
 8 |     "jest": true
 9 |   },
10 |   "settings": {
11 |     "react": {
12 |       "version": "16.6.1"
13 |     }
14 |   },
15 |   "extends": [
16 |     "eslint:recommended",
17 |     "plugin:react/recommended",
18 |     "plugin:jsx-a11y/recommended"
19 |   ],
20 |   "parserOptions": {
21 |     "ecmaFeatures": {
22 |       "jsx": true
23 |     },
24 |     "ecmaVersion": 2018,
25 |     "sourceType": "module"
26 |   },
27 |   "plugins": ["react", "jsx-a11y"]
28 | }
29 | 


--------------------------------------------------------------------------------
/webpack.config.base.js:
--------------------------------------------------------------------------------
 1 | const path = require('path')
 2 | const HtmlWebpackPlugin = require('html-webpack-plugin')
 3 | 
 4 | module.exports = {
 5 |   entry: './src/index.js',
 6 |   output: {
 7 |     path: path.join(__dirname, 'dist'),
 8 |     filename: 'app.bundle.js'
 9 |   },
10 |   module: {
11 |     rules: [
12 |       {
13 |         test: /\.js$/,
14 |         loader: 'babel-loader',
15 |         exclude: /node_modules/
16 |       },
17 |       {
18 |         test: /\.css$/,
19 |         use: ['style-loader', 'css-loader'],
20 |         exclude: /node_modules/
21 |       }
22 |     ]
23 |   },
24 |   plugins: [
25 |     new HtmlWebpackPlugin({
26 |       template: './src/index.html'
27 |     })
28 |   ]
29 | }
30 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "react-boilerplate",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "build": "webpack --config webpack.config.prod.js",
 8 |     "dev": "webpack-dev-server --open --config webpack.config.dev.js",
 9 |     "dev:hot": "npm run dev -- --hot",
10 |     "test": "jest",
11 |     "format": "pretty-quick",
12 |     "lint": "eslint ./"
13 |   },
14 |   "husky": {
15 |     "hooks": {
16 |       "pre-commit": "pretty-quick --staged && npm run lint && npm run test"
17 |     }
18 |   },
19 |   "author": "",
20 |   "license": "ISC",
21 |   "repository": {
22 |     "type": "git",
23 |     "url": "git+https://github.com/avanslaars/egghead-react-boilerplate.git"
24 |   },
25 |   "keywords": [],
26 |   "bugs": {
27 |     "url": "https://github.com/avanslaars/egghead-react-boilerplate/issues"
28 |   },
29 |   "homepage": "https://github.com/avanslaars/egghead-react-boilerplate#readme",
30 |   "devDependencies": {
31 |     "@babel/cli": "^7.1.5",
32 |     "@babel/core": "^7.1.5",
33 |     "@babel/plugin-proposal-class-properties": "^7.1.0",
34 |     "@babel/plugin-syntax-dynamic-import": "^7.0.0",
35 |     "@babel/preset-env": "^7.1.5",
36 |     "@babel/preset-react": "^7.0.0",
37 |     "babel-core": "^7.0.0-bridge.0",
38 |     "babel-eslint": "^10.0.1",
39 |     "babel-jest": "^23.6.0",
40 |     "babel-loader": "^8.0.4",
41 |     "babel-plugin-dynamic-import-node": "^2.2.0",
42 |     "css-loader": "^1.0.1",
43 |     "eslint": "^5.9.0",
44 |     "eslint-plugin-jsx-a11y": "^6.1.2",
45 |     "eslint-plugin-react": "^7.11.1",
46 |     "html-webpack-plugin": "^3.2.0",
47 |     "husky": "^1.1.4",
48 |     "jest": "^23.6.0",
49 |     "jest-dom": "^2.1.1",
50 |     "prettier": "^1.15.2",
51 |     "pretty-quick": "^1.8.0",
52 |     "react-axe": "^3.0.2",
53 |     "react-testing-library": "^5.2.3",
54 |     "style-loader": "^0.23.1",
55 |     "webpack": "^4.25.1",
56 |     "webpack-bundle-analyzer": "^3.0.3",
57 |     "webpack-cli": "^3.1.2",
58 |     "webpack-dev-server": "^3.1.10",
59 |     "webpack-merge": "^4.1.4"
60 |   },
61 |   "dependencies": {
62 |     "@babel/polyfill": "^7.0.0",
63 |     "prop-types": "^15.6.2",
64 |     "react": "^16.6.1",
65 |     "react-dom": "^16.6.1",
66 |     "react-hot-loader": "^4.3.12"
67 |   }
68 | }
69 | 


--------------------------------------------------------------------------------