React Quick Builder

React Quick Builder is a command-line interface tool that helps you create a new React application with a standardized folder structure. It includes Redux, React Router, and Material-UI. This is the very first version of this command line tool. In this version you can create the boilder plate for your application and create new components using the component command.

Installation

You can install React Quick Builder using NPM. Make sure you have NPM installed on your machine before running the following command:

npm install -g react-quick-builder

Note: If you're getting permission issues, make sure to run the command using administrative privileges.

Getting Started

After installing React Quick Builder, you can use it to create a new React application with the following command:

react-quick-builder create-app my-app

This will create a new React application with the folder structure shown below:

my-app/
├── node_modules/
├── public/
│   ├── index.html
│   ├── favicon.ico
│   └── manifest.json
├── src/
│   ├── components/
│   │   ├── App/
│   │       └── index.js
│   │   └── Home/
│   │       ├── index.js
│   │       └── Home.jsx
│   │       └── styles.js
│   ├── constants/
│   │       └── appRoutes.js
│   ├── pages/
│   │   └── Home/
│   │       ├── HomePage.jsx
│   │       └── styles.js
│   ├── routes/
│   │       └── appRoutes.js
│   ├── redux/
│   │       └── rootReducer.js
│   │       └── store.js
│   ├── utils/
│   │   └── hooks/
│   ├── index.js
│   ├── reportWebVitals.js
│   └── setupTests.js
├── .gitignore
├── README.md
├── package-lock.json
└── package.json

Creating a Component

You can also create a new component using the following command:

react-quick-builder create-component MyComponent

This will create a new component named MyComponent in the src/components folder.

Examples

# Create a new React app
react-quick-builder create-app my-app

# Create a new component
react-quick-builder create-component MyComponent

Contributing

We welcome contributions from the community! Please feel free to create a pull request if you have any suggestions or improvements for the project.

What's in the version 2.0

Our focus is to provide couple of different commands by using which you can create the boilerplate code of the component which can include redux, routes or both. There will be other commands to create the hooks. Our ultimate goals is to reduce the time and efforts which the developer spent on creating the standarized coding structure and basic structure for their components against modules and features.

Some example from Version 2.0

# Create a new component with routes
react-quick-builder create-component MyComponent --routes

# Create a new component with Redux
react-quick-builder create-component MyComponent --redux

# Create a new component with routes and Redux
react-quick-builder create-component MyComponent --routes --redux

# Create a new hook
react-quick-builder create-hook HookName

# Create a Restful APIs (GET, PUT, PATCH, POST and DELETE)
react-quick-builder create-service ServiceName --restful

License

This project is licensed under the MIT License.