React Responsive Seed

This project is a responsive web app starter using typescript with react v16.

The project follows facebooks "thinking in react" guidelines and is preconfigured to install the react framework and a bunch of development and testing tools for instant web development gratification such as React Dependency Injection and React Router v4.

For styling, a react component implementation of google's Material Design is used to build the user interface as clean and understanding as possible. The setup provides dynamic breaks for responsiveness and mobile views as well as TypeStyle for a typesafe binding of theme, state & design.

Currently the beta version of material-ui is used.

Installation

Requirements

node.js, npm (npm comes with node.js) and yarn are required

Dependencies

yarn install / npm install

Build tool

fuse-box is used for all build processes (automatically installed with yarn install). fuse-box can be configured in fuse.ts

Development server

Run development server with

npm run start

For production environment:

npm run prod

Optionally the Port on which the server listens can be provided, by setting PORT= before. If not provided, the application uses the configured fallback port, which can be adapted in the package (Default Port 4444)

Example:

PORT=1337 npm run start

Testing

Run tests with

npm test

Test configurations can be found in /test directory. Unit tests are realized with Enzyme, End-To-End tests will be written with Cypress

Code coverage

Run test with code coverage with

npm run cover

Code coverage requirements can be defined in package.json under nyc.

Linting

For linting code, tslint is used and can be configured in tslint.json.

Deployment & build

Build final bundle with

npm run build