https://github.com/fullstackreact/react-gen-generator
Generator for the yelp-clone template format
https://github.com/fullstackreact/react-gen-generator
Last synced: 8 months ago
JSON representation
Generator for the yelp-clone template format
- Host: GitHub
- URL: https://github.com/fullstackreact/react-gen-generator
- Owner: fullstackreact
- License: mit
- Created: 2016-05-27T20:30:40.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-08-06T03:56:29.000Z (over 9 years ago)
- Last Synced: 2025-04-20T19:37:00.784Z (9 months ago)
- Language: JavaScript
- Size: 45.9 KB
- Stars: 17
- Watchers: 2
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Generate a starting point for your react app
The `react-gen` generator is a yeoman generator that creates an app using the same structure detailed in the the [blog post detailing cloning yelp with React](http://fullstackreact.com/articles/react-tutorial-cloning-yelp/).
Using this generator gives you a sane react structure with the following technologies:
* Webpack with hot module reloading (hjs-webpack)
* PostCSS and CSS modules, including autoprefixer, precss
* Global CSS loading
* React / ReactDOM
* react-router
* Nested routing with multiple views
* Testing with karma, mocha, chai
* React component testing helper enzyme
* Multiple deployment environments with dotenv configuration
* Babel with react, stage-0, and es2015
* font-awesome
* and more
## Installation
First, install [Yeoman](http://yeoman.io) and generator-react-gen using [npm](https://www.npmjs.com/) (we assume you have pre-installed [node.js](https://nodejs.org/)).
```bash
npm install -g yo
npm install -g generator-react-gen
```
Then generate your new project, answer some questions about your project, and go!
```bash
yo react-gen
```
## Workflow
Open your app in a text editor and start to work. To run the application, use the `npm start` script. This will boot a server with hot module reloading:
```bash
npm run start
```
To run the tests in our app, we can use the `npm run test` script. This sets up enzyme, boots the tests with karma, and executes them:
```bash
npm run test
```
As we're writing tests, sometimes it's just easier to run the tests as we update and edit files. The generator makes this easy using the `npm run test:watch` script. Run this command and then any changes to the files in our project will cause the tests to be run:
```bash
npm run test:watch
```
To build the app for distribution, we can use the `npm run build` command:
```bash
npm run build
```
## Features
Wanna add redux to the mix? No problem, pass the feature flag of `--redux` when calling generate, i.e.:
```bash
yo react-gen --redux
```
The `--redux` flag will also install the [redux-devtools](https://github.com/gaearon/redux-devtools), hidden by default. Pressing the combination of `Ctrl+h` will make them visible.
## Contributing
```shell
git clone https://github.com/fullstackreact/redux-modules.git
cd redux-modules
npm install
npm start
```
___
# Fullstack React Book
This generator was built alongside the blog post [React Tutorial: Cloning Yelp](https://www.fullstackreact.com/articles/react-tutorial-cloning-yelp/).
This repo was written and is maintained by the [Fullstack React](https://fullstackreact.com) team. In the book, we cover many more projects like this. We walk through each line of code, explain why it's there and how it works.
## License
[MIT](/LICENSE)