This is a POC, something already structured. Consider this project a study-case first!
This is a React Application Base/Template for big and scalable projects.
Considered a POC, the goal of this repo is to prove you can implement a distinguished clean architecture to solve real word cases with abstraction and isolation-per-concept.
- Modular Clean Code architecture to give full support for scalability;
- Common-case structures for caching, logging, validation and communicate with external services via HTTP;
- Asynchronous State Management w/ React Query
- Built-in React components, HOCs, hooks and other utilities
- Built-in logger w/ Debug (Lib) + Chalk
- Built-in toast system
- Built-in validators
- Chart components w/ Apex Charts
- Components and Design System Basis w/ Radix Primitives + Radix Theme
- Custom CSS-in-JS Styles w/ Styled Components + Polished
- Dev runtime, build and preview w/ Vite
- Decentralized Global State w/ Jotai
- Documentation and Design Workshop w/ Storybook
- Linting + Code Styling w/ ESLint (with plugins) + Prettier
- Tests w/ Vitest + Testing Library + JSDom
The Code-style has a functional approach, mostly inspired by Elixir and Lisp. It is based on a Modular Architecture enhanced with Clean Code, splitting each responsibility into a new folder or file.
There are a few ones:
| Folder Path | Description |
|---|---|
| src/@types | Typing overrides and domain interfaces, globally available without imports. |
| src/config | Shared's configuration. |
| src/containers | All React Pages and Sections. |
| src/data | The Data Access Library |
| src/infra | The foundations of the logic. It holds the entire logic to let it flow better with the App. |
| src/modules | An isolated part of the architecture to implement the most abstract concepts. |
| src/shared | Shared utilities, consumed by the entirety of the App without restrictions. |
| src/main.tsx | The entrypoint of the App. |
| __tests__ | All the tests related to the App. |
- Ensure you have those dependencies installed:
NodeJS ^20.12.2PNPM ^9.0.6
- Run
pnpm install - Make a copy of
.envand name it.env.local - Run
pnpm devto start de Application locally.
Yuri Uliam - Author & Maintainer