Tech Stack
Learn about the tech stack used in supastarter.
For a better understanding of the codebase, let's first go over the tools and libraries that supastarter uses and why we chose them.
Turborepo
TurboRepo is a monorepo tool that helps you manage your project's dependencies and scripts. We chose a monorepo setup to make it easier to manage to structure the different features and enable code sharing between the different packages. It also allows you to easily add further apps (like a mobile app or a different frontend) to the project and reuse the existing codebase.
TanStack Start
TanStack Start is a full-stack React framework built on TanStack Router. We use it for the frontend of supastarter and pair it with server functions, API routes, and type-safe data loading for a productive React development experience.
Drizzle
Drizzle is a lightweight TypeScript ORM that helps you access your database in a type-safe way. We use Drizzle to define the database schema, write SQL-like queries with TypeScript inference, and manage database migrations without adding unnecessary runtime overhead.
Hono
Hono is a minimal web server framework that helps you to build the API for supastarter. It enables you to easily define routes and handle requests and responses. It runs on the edge, serverless functions or as a traditional "long-running" server, so you can use it in any environment and with any provider. It also comes with an RPC client that allows you to easily call your own functions from the frontend in a type-safe way.
oRPC
oRPC is a library that helps you to call backend functions from the frontend in a type-safe way. It's similar to tRPC, but is based on the OpenAPI standard and gives you a few more advanced capabilities.
TanStack Query
TanStack Query is a library for managing server state and fetching data in React applications. We use it to fetch data from the API and to manage the state of the application.
better-auth
better-auth is an authentication library that helps you to add authentication to your application. It's highly customizable and gives you full control over the authentication process and the user data, so you don't lock yourself into a specific provider.
Tailwind CSS
Tailwind CSS is a utility-first CSS framework that helps you build custom designs without writing any CSS. We use it to style the frontend of supastarter and to create a consistent design system.
Base UI
Base UI is a collection of unstyled, accessible UI primitives that help you build composable user interfaces while keeping full control over the design system.
Content Collections
Content Collections is a markdown-based CMS that helps you manage your content in a structured way within your codebase. We use it to manage the content of the supastarter blog and other content pages (like the legal pages) with MDX.
Fumadocs
Fumadocs powers the standalone documentation application (apps/docs) and provides an improved documentation experience with features like full-text search, AI-powered page actions, and a clean UI.