Repository files navigation

Built with ❤️ byVinay.

About •Features •Requirements •Installation •Documentation •Road Map •Contributing •License

Rapid React is an interactive CLI tool which automates the repetitive steps involved every time a new React app is setup. Usually developers 👨‍💻 go through a time consuming process which involves waiting forcreate-react-app to finish it's boilerplate setup, followed by installation of dependencies & dev dependencies, setup of folder structure, routing, state management, e.t.c. before it can finally start working on the app. 🚧

Well, now you can grab a cup of ☕ whileRapid React scaffolds the app for you! 😌

Thanks for showing your love forRapid React which has motivated further to work on some cool new features!

• Rapid React has been re-written fromReact Redux toRedux Toolkit APIs. This would dramatically reduce the boilerplate code required to work with Redux and further cut down your development efforts. 🏋️

This has been considered after an in-depth advice fromMark Erikson who is a Redux maintainer. You may check his suggestionshere which coverRTK as the recommended way to write Redux logic. This would be abreaking change for existing users.

• Added support for Redux Thunk middleware!

• A much more comprehensive and better looking version update notification!

• A notification sound would play once the setup is complete! 🛎️

• Get notification every time an update is available. ⚙️
• Supports bothJavaScript andTypeScript. 😍
• Installs both dependencies and dev dependencies.
• Supports popularly used CSS preprocessorSASS! 🔥
• Choose from commonly used folders (assets,components,hooks,services,utils, e.t.c.) to scaffold.
• Scaffolds custom folder as well.
• Choose preferredexport type: named/default. 🤔
• Setupsrouting with user defined routes.
• SetupsRedux state management with user defined reducers along with:
  • Redux Thunk
  • Redux Saga
  • Redux Logger
• SetupsMobX state management with user defined stores.
• ...and much more! 🎉

• Node.js installed on your system.
• An active internet connection for CLI to work.

From your terminal run:

# install the package from NPM$ npm install rapid-react

Rapid React installsrapid-react command in your system. To run the tool, you need to invoke this command from your terminal:

# that's it!$ rapid-react

As soon as run the command you are greeted by the CLI.

From there on, you are asked a couple of question for a tailored experience for your app setup.

The utility would walk you through from following:

• Language Preference
  Choose between JavaScript and TypeScript

• App Name
  Enter your app name. By default it fallbacks tomy-app.
  

  ✅ valid app names
  foo
  123foo
  foo123
  foo-bar
  

  ❌ invalid app names
  Foo
  Foo-Bar
  FooBar
  

• Export Type Preference
  Choose between Named and Default.

• StyleSheet Preference
  Choose between CSS and SCSS.

• Routing requirement
  Choose either Yes or No.

  • If required, enter space separated route names
    e.g.home login about signIn signUp

    ✅ valid route names
    foo
    fooBar
    FooBar
    Foo123
    

    ❌ invalid route names
    123foo
    foo-bar
    foo.bar
    foo?bar
    

• State management requirement
  Choose either Yes or No.

  • If required, select one
    Choose between MobX and Redux. Once chosen you'll be prompted toenter space separated names of stores(in case of MobX) or reducers(in case of Redux). The conventions would be same as routes.

  • Installing additional Redux libraries
    If you chose Redux you'll be prompted to choose from these additional libraries usually used with Redux:

    • Redux Logger
    • Redux Thunk
    • Redux Saga

• Scaffold folders:

  • Standard
    You can choose from commonly used folder to scaffold:assets,components,data,errors,fallbacks,hooks,layouts,services,types,utils,validations.
  • Custom
    You canenter space separated folders. The conventions would be same as routes.

• Dependencies:
  You canenter space separated dependencies. The conventions would be same as routes. E.g.antd lodash moment.
  ⚠️ In case you are usingTypeScript you'll have to explicitly mention type definition packages required for these dependencies. Such packages usually start with@types/ prefix and are installed as dev dependencies.

• Dev Dependencies:You canenter space separated dev dependencies. The conventions would be same as routes. If you're not sure about what a dev dependency is, you can refer tothis.

Your contributions are always welcome! Please have a look at thecontribution guidelines first. 🎉

Rapid React is licensed under the terms ofMIT License.