React Vite Template

Features

• Built for organization, scalability and, efficiency
• Standardized approach + my own workflow flavor
• Path Aliases
• Globalized themes with MUI
• Most intuitive and fast state management with Recoil

Tech Stack

• Language: TypeScript ⚡
• Framework: React ⚛️
• Tooling System: Vite 🚀
• Styling: SASS 🖌️
• UI Library: Chakra UI ✨
• State Management: Recoil 🔥

File Structure

Project
│   README.md
│   LICENSE
│
│   index.html
│   package.json
│   tsconfig.json
│   tsconfig.node.json
│   tsconfig.paths.json
│   vite.config.ts
│   yarn.lock
│
└───src
│   │   App.tsx
│   │   main.tsx
│   │   routes.tsx
│   │   theme.ts
│   │   vite-env.d.ts
│   │
│   └───components
│   │   │
│   │   └───ComponentName
│   │       │   ComponentName.tsx
│   │       │   ComponentName.scss
│   │       │   ComponentName.spec.ts
│   │   │   ...
│   │
│   └───pages
│   │   │
│   │   └───PageName
│   │       │   PageName.tsx
│   │       │   PageName.scss
│   │       │   PageName.spec.ts
│   │   │   ...

TODO:

• Add eslint and prettier configurations
• Add GitHub Actions CI/CD
• Add tests