Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
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: 3 months ago
JSON representation
A frontend template with React, Bulma, Typescript, SASS, and PWA support.
- Host: GitHub
- URL: https://github.com/elliotjreed/react-website-template
- Owner: elliotjreed
- License: mit
- Created: 2020-05-12T14:51:28.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T04:47:11.000Z (almost 2 years ago)
- Last Synced: 2023-03-02T04:22:14.152Z (almost 2 years ago)
- Topics: boilerplate, bulma, hacktoberfest, jest, pwa, react, scss, typescript, webpack
- Language: TypeScript
- Homepage:
- Size: 4.78 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 17
-
Metadata Files:
- Readme: README.md
- License: LICENSE
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.