Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/djizco/react-boilerplate
A Simple React Boilerplate for Web Apps. Uses React, Redux, Webpack, Hot Reloading for JS and CSS, Testing, and more.
https://github.com/djizco/react-boilerplate
babel bulma css eslint ramda react redux webpack
Last synced: 2 days ago
JSON representation
A Simple React Boilerplate for Web Apps. Uses React, Redux, Webpack, Hot Reloading for JS and CSS, Testing, and more.
- Host: GitHub
- URL: https://github.com/djizco/react-boilerplate
- Owner: djizco
- License: mit
- Created: 2016-07-04T05:56:22.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-10-14T04:41:32.000Z (about 1 year ago)
- Last Synced: 2024-05-04T00:17:16.515Z (6 months ago)
- Topics: babel, bulma, css, eslint, ramda, react, redux, webpack
- Language: JavaScript
- Homepage:
- Size: 461 KB
- Stars: 18
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Boilerplate
You can try out this project [here](http://react-boilerplate.surge.sh)
## Requirements
* Operating System: MacOS or Linux
* [Node.js](https://nodejs.org/) (I recommend installing with [NVM](https://github.com/nvm-sh/nvm))
## Quick Start
#### Setup
```bash
npm install
```
#### for Development
```bash
npm start
```
#### for Production
```bash
npm install -g serve
npm run build
npm run serve
```
#### for Deployment (using surge)
```bash
npm install -g surge
npm run build
npm run deploy
# You may have to create an account
```
#### Other Commands
```bash
npm test
npm run test:watch
npm run test:verbose
npm run test:coverage
npm run lint
npm run lint:fix
```
## Setup Instructions
To setup your own project, you will need to copy the contents of this project into a new repo.
You will need to update the content in these files to names of your project and yourself:
* package.json: name, version, description, repository, author, bugs, homepage
* LICENSE: (update to your preferred license)
* client/index.html: description and title
* this README.md
This is also a good time to go through the included libraries to add or remove features that you want.
After this you can commit the files into a new repository and push up to your github.
You can now start updating files in your client to begin working on your own project!
## Features
* Webpack conveniently bundles your code for you.
* Babel lets you use ES6/7 features.
* CSS pre-processor setup for LESS and SASS lets you keep your styles clean and organized.
* ESLint helps you maintain a high level of code quality.
* Jest gives you a robust testing frame work to make sure your code works.
## Code Structure
```
- config
- scripts
- client
- assets
- images
- icons
- components
- pages
- environment
- hooks
- store
- actions
- reducers
- thunks
- tests
- styles
- utils
```
## Technologies
[React](https://facebook.github.io/react/) - View Library
[React-Router](https://reacttraining.com/react-router/) - Routing Library for React
[Redux](http://redux.js.org/) - State Manager
[Redux-Persist](https://github.com/rt2zz/redux-persist) - Persistent State
[Webpack](https://webpack.github.io/) - Module Bundler
[Material-UI](http://material-ui.com/) - React Component Library
[Bulma](http://bulma.io/) - CSS Framework
[React Bulma Companion](https://github.com/djizco/react-bulma-companion) - Bulma Component Library
[FontAwesome](http://fontawesome.io/) - Icons
[Ramda](http://ramdajs.com/) - Functional Library
[date-fns](https://date-fns.org/) - Date Functions Library
[ESLint](http://eslint.org/) - Code Linter
[Jest](https://jestjs.io/) - Testing Framework
[Surge](https://surge.sh/) - Static Web Deployment