Table of contents

• About T3 Stack
• Architecture of Todo App
• Project setup

About T3 Stack

"T3 Stack" consists of following tech and enable full stack type-safe web development speedy and simple.

• Next.js
• tRPC
• Tailwind CSS
• TypeScript
• Prisma
• NextAuth.js

Architecture of Todo App

Project setup

Create T3 project

$ npm i -g yarn

$ npx create-t3-app@6.0.1 t3-todo-app

$ yarn add zustand @heroicons/react date-fns

DB setup

start db

$ docker compose up -d

remove db

$ docker compose rm -s -f -v

prisma migrate and type generation

$ npx prisma migrate dev

$ npx prisma generate

$ npx prisma studio