🐶Dogokit Corgi

React Router Framework, tRPC, Prisma, Better Auth, Tailwind CSS, shadcn/ui
🚧 Live Demo

Goal

Dogokit Corgi is the implementation details of Dogokit Akita.

This template is optimized for the shortest time to production, but with long-term development as well.

Tech Stack and Setup

Core:

• TypeScript v5.8
  • Optional: TypeScript v7 with tsgo setup
• Bun v1 (replace Node.js and npm)
• React v19
• React Router v7 Framework (Remix)
  • Integration with tRPC and Better Auth
  • Themes: System, Light, Dark
  • Vercel Config, can be removed if not needed
• Tailwind CSS v4
  • shadcn/ui with single radix-ui and some with base-ui
  • Replace lucide-react with sly CLI to manage icons
  • More components with Kibo UI, Origin UI, React Bits, MVPBlocks, SHSF UI, Skiper UI
  • React Email v4
  • TipTap v2
• tRPC v11
• Zod v4
• Conform v1
• Prisma ORM v7
• PostgreSQL v17
• Better Auth v1
  • Email and Password
  • OAuth: Google, GitHub
• Unpic

Utilities:

• Formatter and Linter: Biome v2
  • Preset: Ultracite
• Container: Docker v28
• Bundler: Vite v7
  • Env: t3-env
• Git Hooks: Husky v9
• Testing Framework: Vitest v3
• End-to-End Testing: Playwright
• Add Code, Not Dependencies: Sly CLI
• Maintainable Source Registries: jsrepo

Services:

• Code Editor Settings and Extensions
  • VS Code / Cursor / Windsurf
• Email: Resend, Amazon SES
• Payment: Polar
• Error Tracking: Sentry
• File Storage/Upload: Uploadcare, Cloudflare R2, Imgix
• Analytics: Posthog
• Security: Arcjet
• API Key: Unkey
• Documentation: Fumadocs
• AI Rules
  • Cursor
  • Windsurf
• AI Toolkits and Frameworks
  • AI SDK
  • Mastra
  • Context7
• AI Agents
  • General: Codegen
  • Code Review: CodeRabbit

Get Started

Setup Dependencies

Use Bun for dependency management and scripts. It's an alternative to Node.js and npm.

Ensure Bun is installed:

curl -fsSL https://bun.sh/install | bash
# or use any preferred installation methods

Install dependencies:

bun install

Code Quality

Check, format, lint to ensure the setup is fine:

bun typecheck

If want to automatically format & lint the code:

bun write

Environment Variables

Create the .env file from .env.example. This is only for local development, not production:

cp -i .env.example .env

Configure the required environment variables if on local, otherwise in the project settings on other environments.

If necessary, create the .env.prod for production info. Adjust accordingly if needed for staging, test, etc. Be careful to change the URL variables on different domains and subdomains.

cp -i .env.example .env.prod

Then change all the examples.

Required for application:

• VITE_APP_NAME
• VITE_APP_URL
• DOMAIN
• BETTER_AUTH_SECRET
• DATABASE_URL

Required when using Docker Compose:

• POSTGRES_USER
• POSTGRES_PASSWORD
• POSTGRES_DB
• POSTGRES_HOST_PORT

Optional for OAuth and Payment:

• *_CLIENT_ID and *_CLIENT_SECRET: For OAuth related, check docs on OAuth
• *_ACCESS_TOKEN and *_WEBHOOK_SECRET for payment related.

Along with other variables.

Database Setup

Prisma ORM is used to communicate with the database easily.

The default is PostgreSQL from local system, Docker container, or with services like Prisma Postgres, Neon, Supabase.

Start local database with Docker Compose:

bun db:up

Migrate database:

bun db:migrate

Seed initial data:

bun db:seed

Open Prisma Studio:

bun db:studio

Reset when needed:

bun db:reset

Development

Run the development server:

bun dev

Open http://localhost:8000 then we're ready.

Note: This repo has .vscode/settings.json which has "files.exclude" to hide some configs and build assets. Reconfigure it as needed.

Production Deployment

Pick a host to deploy and setup accordingly, such as:

• Railway.com
• Render.com
• Vercel
• Netlify
• Fly.io
• Google Cloud (GCP)
• Amazon Web Services (AWS)
• Microsoft Azure
• VPS: Coolify, Dokploy, etc

Notes:

• Railway supports Dockerfile.
  • Make sure to use Railpack to have the latest Node.js version.
  • Keep in mind the private network is not available during build time, so have to migrate during pre-deploy
• Render supports Dockerfile.
• Vercel needs vercelPreset in react-router.config.ts.
• It's recommended to use secret management for environment variables, such as Doppler or Infisical.

Production Build

Check if the production build is fine:

bun run build

Production build if using Docker (without database migration):

bun run build:docker

Migrate database for production:

bun db:migrate:deploy

Then run:

bun start

References

• shadcn/ui
• OriginUI
• Kibo UI
• registry.directory
• Better Auth: Demo
• ayoubphy/react-router-trpc-prisma-better-auth is the original repo source

Notes

Credits

The codename "Corgi" comes from a Welsh Corgi dog breed of affectionate small herding breed dog with short legs and a long body.

Originally created by 🧊Haidar

• 🐾Allnimal
• 🐻Bearmentor
• 🐱Catamyst
• 🐶Dogokit
• 🐘Elevanty

Tech Stack Comparison

What the tech stack choice replaces or each alternatives:

• TypeScript = Java, Go, Python, Ruby, PHP
• Bun = Node.js, Deno
• Biome = ESLint, Prettier
• React = Angular, Vue, Svelte
• React Router Framework = TanStack Router, Next.js, Nuxt
• tRPC = GraphQL, REST
• Prisma ORM = Drizzle, TypeORM, Sequelize, Mongoose
• Tailwind CSS = Bootstrap, MUI, Ant Design
• Zod = Joi, Yup
• Conform = TanStack Form, Formik, React Hook Form
• Better Auth = Passport.js, Auth0, Firebase Auth, Auth.js/NextAuth.js, Clerk
• Docker and Docker Compose = Manual install into OS
• PostgreSQL = MySQL, SQLite, MongoDB, DynamoDB, Firestore
• Vite = Webpack, Parcel
• Vitest = Jest, Mocha, Jasmine
• Resend or Amazon SES = SendGrid, Mailgun, Postmark, SMTP
• Uploadcare or Cloudflare R2 = Amazon S3, Cloudinary, MinIO, Firebase Storage
• Polar Payment = Stripe, PayPal, Braintree