Nevertheless! Party Metaphorically

    generator-react-gen

    1.1.0 • Public • Published

    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.

    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 and generator-react-gen using npm (we assume you have pre-installed node.js).

    npm install -g yo
    npm install -g generator-react-gen

    Then generate your new project, answer some questions about your project, and go!

    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:

    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:

    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:

    npm run test:watch

    To build the app for distribution, we can use the npm run build command:

    npm run build

    Features

    Wanna add redux to the mix? No problem, pass the feature flag of --redux when calling generate, i.e.:

    yo react-gen --redux

    The --redux flag will also install the redux-devtools, hidden by default. Pressing the combination of Ctrl+h will make them visible.

    Contributing

    git clone https://github.com/fullstackreact/redux-modules.git
    cd redux-modules
    npm install
    npm start

    Fullstack React Book

    Fullstack React Book

    This generator was built alongside the blog post React Tutorial: Cloning Yelp.

    This repo was written and is maintained by the Fullstack React 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

    Install

    npm i generator-react-gen

    DownloadsWeekly Downloads

    3

    Version

    1.1.0

    License

    MIT

    Last publish

    Collaborators

    • auser