This template provides a minimal setup to get React working in Vite to build your app with ease, this template provides you with how I usually structure my React project directories and preconfigured Prettier to give you good DX when developing a frontend application. This project also includes Shadcn UI and Tailwind CSS to help you build your UI as quickly as possible.
- Node.js v18.16 and up with package manager (npm, yarn, or pnpm)
- Biome.js VSC Extension (for VS Code User)
- React v18.2.0 with Typescript
- Axios (for Data Fetching)
- Tanstack Router (for Routing): https://tanstack.com/router/latest
- Tanstack Query (for Server Side State): https://tanstack.com/router/latest
- Tailwind CSS (CSS Alternative): https://tailwindcss.com/
- Shadcn (Component Library): https://ui.shadcn.com/
- Click the "Use this template" button and select "Create a new repository", after that you can change the name of the project as you like
or, you can directly clone this repository using this command,
git clone https://github.com/FelixFern/React-Starter-Project
- Then, install all the needed dependencies using your desired package manager,
pnpm install
- After that, you can start using this template and edit as you like! and to start the project use
pnpm run dev
- Fetching Data Example ✅
- Data Pagination Example ✅
- Routing ✅
- Tanstack Router Params Usage ✅
- Custom Hooks ✅
- Biome.js for Linter ✅
- CI for Linter with Github Actions ✅
- JWT Auth Session Hooks
- Data Table Example
- Form Example
- Tanstack Path Params Usage
If you have any inputs or suggestions, add them as an Issues and we'll discuss them!
Pokemon APIs by Paul Hallet (used for data fetching example)