Skip to content

πŸ™‹ Boilerplate for web apps using React,Bootstrap 4, MobX, Babel and Webpack.

License

Notifications You must be signed in to change notification settings

moaali/reactinator

Repository files navigation

πŸš€πŸš€πŸš€

Minimalistic boilerplate to start developing React JS applications in just few seconds easily with the included tooling. Using Webpack 3, Mobx 3, Babel 6.

πŸš€πŸš€πŸš€


Table of Contents


Installation

To start using this boilerplate, all what you have to do is copy and paste the following commands in your terminal.

> git clone https://github.com/moaali/reactinator.git 
> cd reactinator 
> npm install 
> npm run dev 

Folder Structure

This boilerplate structure is inspired by Ryan Florence and Alexis Mangin ideas of react app structure.

app 
β”œβ”€β”€ components 
β”‚   β”œβ”€β”€ Layout 
β”‚   β”‚   β”œβ”€β”€ index.jsx 
β”‚   β”‚   β”œβ”€β”€ index.scss 
β”‚   β”‚   └── ... 
β”‚   β”‚ 
β”‚   β”œβ”€β”€ Animation
β”‚   └── ... 
β”‚
β”œβ”€β”€ screens 
β”‚   β”œβ”€β”€ Index 
β”‚   β”‚   β”œβ”€β”€ components 
β”‚   β”‚   β”‚   β”œβ”€β”€ Content 
β”‚   β”‚   β”‚   └── ... 
β”‚   β”‚   β”‚ 
β”‚   β”‚   β”œβ”€β”€ shared 
β”‚   β”‚   β”œβ”€β”€ index.jsx 
β”‚   β”‚   β”œβ”€β”€ index.scss 
β”‚   β”‚   └── ... 
β”‚   β”‚ 
β”‚   β”œβ”€β”€ 404 
β”‚   └── ... 
β”‚ 
β”œβ”€β”€ shared 
β”‚   β”œβ”€β”€ config 
β”‚   β”‚   β”œβ”€β”€ routes.jsx 
β”‚   β”‚   └── ... 
β”‚   β”‚ 
β”‚   β”œβ”€β”€ services 
β”‚   β”œβ”€β”€ static 
β”‚   β”‚   β”œβ”€β”€ favicon.ico 
β”‚   β”‚   └── ... 
β”‚   β”‚ 
β”‚   β”œβ”€β”€ stores 
β”‚   β”‚   β”œβ”€β”€ clientStore.js
β”‚   β”‚   β”œβ”€β”€ index.js
β”‚   β”‚   └── ... 
β”‚   β”‚ 
β”‚   β”œβ”€β”€ styles 
β”‚   β”‚   β”œβ”€β”€ settings 
β”‚   β”‚   β”œβ”€β”€ components 
β”‚   β”‚   β”œβ”€β”€  ... 
β”‚   β”‚   └── index.scss 
β”‚   └── ... 
β”‚ 
β”œβ”€β”€ index.html 
└── index.jsx 

Commands

Below are the available terminal commands used by this boilerplate:

npm start : Running into development mode but without fancy webpack dashboard plugin.
npm run dev : Running into development mode with fancy webpack dashboard plugin ebabled.
npm run clean : Delete the production folder before running the build command below.
npm run build : Produce the production version of the app.
npm run preview : Run server on the built production folder just for client preview.
npm run lint:js : Linting JavaScript files.
npm run lint:scss : test Linting Sass files.
npm run lint : Linting both JavaScript & Sass files.


License

🍟 MIT

About

πŸ™‹ Boilerplate for web apps using React,Bootstrap 4, MobX, Babel and Webpack.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published