Introduction

This boilerplate contains all you need to start your next React.js project. Simple, robust, well-organized, all you need to do is clone, install, and you’re ready to start.

I wrote an article for anyone who wants to learn how to build this boilerplate, if you want to learn just click here.

Check out the lite version here.

Features

This boilerplate features all the latest tools and practices in the industry:

• React — 16.12.0 with Hooks
• Redux with Redux Thunk — State Management with middleware to handle async requests
• Babel — ES6 syntax, Airbnb Recommended config
• Webpack — Hot Reloading, Code Splitting, Optimized Build
• CSS — Styled Components, CSS, Sass
• Tests — Jest, React Testing Library, Cypress
• Lint — ESlint
• Husky — Prevent bad commits

Getting Started

1. Clone this repo using https://github.com/leonardomsoreact-bolt.git
2. Move to the appropriate directory: cd react-bolt
3. Run yarn or npm install to install dependencies.
4. Run npm start to see the example app at http://localhost:8080.

Commands

• npm start – Start the dev server
• npm run build – Create a production-ready build in the dist folder
• npm run lint – Execute an eslint check
• npm run lint:fix – Execute an eslint and fix the errors
• npm test – Run all tests
• npm run test:watch – Run all tests in watch mode
• npm run test:cover – Coverage mode
• npm run cypress:open – Starts Cypress

Next Features

• [x] Hot Module Replacement: Better HMR support
• [x] CSS/Sass support: Enable CSS/Sass support
• [ ] PWA: Turn into a PWA boilerplate
• [ ] SEO: SEO-ready

Troubleshooting

If you encounter any issues while setting up or running this boilerplate, here are a few troubleshooting ideas:

• Ensure you have the correct version of Node.js and npm installed.
• Check your internet connection if you face issues during dependency installation.
• If the development server doesn’t start, try terminating the terminal session and rerunning npm start.
• Look for syntax errors in your code if tests fail or applications crash unexpectedly.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions.
Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.