React Starter

🍱 Another React Starter using Bun, Vite, TypeScript, tailwindcss and daisyUI.

🐣 Features

• 🍞 bun for a fast runtime and package manager.
• ⚡️ vite for instant server start and lighting fast HMR.
• 🏷️ TypeScript for a less frustrating & consistent experience.
• 🏝️ TanStack Router for a fully type-safe React router.
• 🏝️ TanStack Query for asynchronous state management.
• 💄 tailwindcss for utility-first CSS.
• 💄 daisyUI for tailwindcss components.
• 🧱 storybook for building UIs in isolation.
• 🧪 vitest for fast testing.
• 🧪 Playwright for fast and reliable e2e testing.
• 🧪 msw for client-agnostic API mocks.
• 🩺 eslint for static analysis.
• 🎨 prettier for formatting.
• 🩺 lefthook for fast Git hooks management.
• 👷 GitHub Actions for easy workflow automation.

🛠️ Usage

You can either use this template or deploy on Vercel or use tiged, by running the following command:

bunx tiged jimmy-guzman/react-starter

🏁 Getting Started

💡 To avoid having to remember which package manager to use, I recommended using ni

First install bun, by running the following command:

curl -fsSL https://bun.sh/install | bash

Now you can install dependencies, by running the following command:

bun install

And to download new browsers for Playwright, run the following command:

bunx playwright install

Then to run the development server, run the following command:

bun dev

Your application will be available at http://localhost:5173/ ❤️

🧞 Available Tasks

Command	Action
bun install	Installs dependencies
bun run dev	Starts local dev server at http://localhost:5173/
bun run build	Build your production site to ./dist/
bun run preview	Preview your build locally, before deploying
bun run test	Unit tests your code with vitest
bun run e2e	E2E tests your code with playwright
bun run lint	Lints everything with eslint
bun run lint:fix	Fixes lint errors with eslint
bun run format	Checks formatting with prettier
bun run format:fix	Fixes formatting errors with prettier
bun run typecheck	Checks types with TypeScript
bun run sb	Starts storybook at http://localhost:6006
bun run sb:build	Build your production storybook to ./storybook-static/

💡 Recommendations

If you need to do more, I recommend the following libraries:

• jotai for when you don't want to use context for state management or need more state management outside of React Query
• zustand for when you need more state management outside of React Query or jotai if you wen that route
• React Hook Form for when you need to build forms
• TanStack Table (React Table) for when you need to build complex tables or data grids
• fathom for analytics which is easy to use