Web 2.0 Frontend

Minimal starter kit with hot module replacement (HMR) for rapid development.

• React (16.x)
• Webpack (4.x)
• Typescript (2.x)
• Hot Module Replacement (HMR) using React Hot Loader (4.x)
• Babel (6.x)
• SASS
• Jest - Testing framework for React applications
• Production build script
• Image loading/minification using Image Webpack Loader
• Typescript compiling using TS-Loader
• Code quality (linting) for Typescript and SASS/CSS.

Installation

1. Clone/download repo
2. npm install

Usage

Development

npm start

• Build app continously (HMR enabled)
• App served @ http://localhost:3000

Create new component

npm run plop

• Create a new component interactively using plop templates

Production

npm run start-prod

• Build app once (HMR disabled)
• App served @ http://localhost:3000

---

All commands

Command	Description
npm run start-dev	Build app continously (HMR enabled) and serve @ http://localhost:3000
npm run start-prod	Build app once (HMR disabled) and serve @ http://localhost:3000
npm run build	Build app to /dist/
npm run test	Run e2e and unit tests
npm run test:unit	Run unit tests with Jest
npm run test:e2e	Run end-to-end tests with TestCafé
npm run lint	Run Typescript and SASS linter
npm run lint:ts	Run Typescript linter
npm run lint:sass	Run SASS linter
npm run start	(alias of npm run start-dev)

See also

• React Webpack Babel Starter
• Isomorphic Webapp Starter

Copyright

Aalto-yliopiston Sähköinsinöörikilta ry