Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/elliotjreed/react-website-template

A frontend template with React, Bulma, Typescript, SASS, and PWA support.
https://github.com/elliotjreed/react-website-template

boilerplate bulma hacktoberfest jest pwa react scss typescript webpack

Last synced: about 1 month ago
JSON representation

A frontend template with React, Bulma, Typescript, SASS, and PWA support.

Awesome Lists containing this project

README

        

# React Website Template

This template is a quick boilerplate for setting up a React project with testing, Bulma CSS, SASS / SCSS, and Typescript.

## Installing Yarn

For instructions on how to install Yarn visit [yarnpkg.com](https://yarnpkg.com/lang/en/).

## Installing dependencies

The frontend uses [Typescript](https://www.typescriptlang.org/) and [SASS](https://sass-lang.com/), and is bundled using [Webpack](https://webpack.js.org/).

The [Bulma](https://bulma.io/) framework is included by default.

To install the required dependencies run:

```
yarn install
```

## Running for development

To run the Webpack development server run:

```
yarn start
```

## Building for production

To build the production-optimised application run:

```
yarn build
```

## Testing

[React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) and [Jest](https://jestjs.io/) are used for testing. Example tests are included.

To run all tests run:

```
yarn test
```

## Linting / Code Style

To run Javascript / Typescript, and CSS / SCSS linters run:

```
yarn lint
```

### Javascript / Typescript

The code formatting is provided by [Prettier](https://prettier.io/) and linting by [ESLint](https://eslint.org/).

To run the linter run:

```
yarn lint:js
```

### CSS / SCSS

CSS / SCSS linting is by [Stylelint](https://stylelint.io/).

To run the linter run:

```
yarn lint:css
```

## Built With

- [Typescript](https://www.typescriptlang.org/)
- [Yarn](https://yarnpkg.com/lang/en/)
- [Webpack](https://webpack.js.org/)
- [Bulma CSS](https://bulma.io/)

## License

This project is licensed under the MIT License - see the [LICENCE](LICENSE) file for details.