🤖 Boilerplate code for react applications.
MIT License
This is a boilerplate/template project for building React.js applications, utilizing several modern technologies and libraries including Effector for state management, Farfetched for data fetching, Cypress for end-to-end testing, Bun as runtime, Vite for fast development environment, Storybook for component documentation and testing, react-testing-library and Jest for unit testing, and Emotion for styling.
Make sure you have Bun installed on your machine.
git clone https://github.com/jassix/react-boilerplate.git
cd react-boilerplate
bun install
To start the development server, run:
bun dev
This will start the Vite development server.
To build the project for production, run:
bun run build
This will generate a production-ready build in the dist
directory.
To run unit tests using Jest, execute:
bun run test
Cypress is used for end-to-end testing. To run Cypress tests, use:
bun run test:e2e
To start Storybook and view your components in isolation, run:
bun storybook
/
├── public/
├── src/
│ ├── app/
│ │ ├── providers/ - Applications providers
│ │ ├── layouts/ - Different layouts for your pages
│ │ ├── router/ - Router-Component, collect your routes in one place
│ │ ├── styles/ - Global styles for your app
│ │ ├── core.tsx - Root-Component, your providers and routing must will connected there
│ │ └── index.tsx - Application entry-point
│ ├── pages/ - Pages
│ ├── widgets/ - Widgets
│ ├── features/ - Features
│ ├── entities/ - Entities
│ └── shared/ - Shared
│ ├── api/ - All requests to API
│ ├── lib/ - Additional local "libraries"
│ │ ├── media-query
│ │ └── i18n
│ ├── routing/ - Basement for routing, e.g. paths, or something else
│ ├── config/ - General config for your app
│ └── ui/ - UI-Kit, with atomic design
│ ├── atom
│ ├── molecules
│ └── organisms
└── package.json
This project is licensed under the MIT License.
Feel free to contribute to this project and tailor it to your specific needs! If you encounter any issues or have suggestions for improvements, please open an issue or create a pull request. Happy coding! 🚀