{"id":15673131,"url":"https://github.com/c-ehrlich/t3-tutorial-pre","last_synced_at":"2025-09-14T03:04:47.683Z","repository":{"id":54403887,"uuid":"521386904","full_name":"c-ehrlich/t3-tutorial-pre","owner":"c-ehrlich","description":"test run of t3 stack tutorial","archived":false,"fork":false,"pushed_at":"2022-08-14T21:20:51.000Z","size":141,"stargazers_count":15,"open_issues_count":1,"forks_count":0,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-05-06T22:36:32.592Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/c-ehrlich.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-08-04T19:12:41.000Z","updated_at":"2023-01-21T15:03:40.000Z","dependencies_parsed_at":"2022-08-13T14:40:17.120Z","dependency_job_id":null,"html_url":"https://github.com/c-ehrlich/t3-tutorial-pre","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/c-ehrlich/t3-tutorial-pre","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-ehrlich%2Ft3-tutorial-pre","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-ehrlich%2Ft3-tutorial-pre/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-ehrlich%2Ft3-tutorial-pre/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-ehrlich%2Ft3-tutorial-pre/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/c-ehrlich","download_url":"https://codeload.github.com/c-ehrlich/t3-tutorial-pre/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-ehrlich%2Ft3-tutorial-pre/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":275055088,"owners_count":25397576,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-14T02:00:10.474Z","response_time":75,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-03T15:37:18.798Z","updated_at":"2025-09-14T03:04:47.647Z","avatar_url":"https://github.com/c-ehrlich.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# t3 stack tutorial\n\n## Who am I\n- Full stack developer\n- Self taught\n- Before that teacher/lecturer\n- Contributor to create-t3-app which we will be using to bootstrap the project\n- TKTK other stuff to make people want to follow this video\n- This is my first time teaching WEB DEV, so if you decide to watch this and follow along I'd love your feedback in the end\n\n## Who is this for?\n- New developers with a bit of self teaching Web Dev experience (freeCodeCamp etc)\n  - you've learned the basics but now it feels like there's a huge gap stopping you from making 'real' apps\n  - You should have basic understanding of both frontend, backend, and databases (for example you have made a React app, and an Express API that talks to a SQL or Mongo database in the past)\n- More experienced web developers who are new to the T3 stack (you might want to fast forward in a few places)\n- Experienced non-web Developers who want to learn a web stack that is modern but easy\n\n## If you're not there yet\n- If you don't know React yet - Jack Herrington's series\n- If you don't know TypeScript yet - also Jack Herrington's series, or just follow along here anyway\n- If you don't know APIs yet - FreeCodeCamp, and TomDoesTech\n- If you don't know DBs yet - Also FreeCodeCamp? Or CS50x\n\n## What will this cover?\n- Not just code-along, but also explaining concepts!\n- All the main parts of the t3 stack\n  - TypeScript - but we won't be writing much of it - hopefully this makes it less scary\n  - Full stack Next.js - we use it on the frontend and backend\n  - tRPC v10 - creating an end-to-end typesafe API\n  - React Query (wrapped by tRPC) - consuming that API, and some advanced patterns\n  - Prisma - ORM, CRUD operations\n  - Next-Auth - using the GitHub Provider\n  - Tailwind - very basic usage\n- Deploying to Vercel\n\n## What will this not cover?\n- Nice styling/UI/UX\n- Production database (I'd recommend PlanetScale or Amazon RDS)\n- Testing\n- Advanced Next-Auth patterns\n- Websockets (due to Lambdas - use an external service!)\n- Other deployment options\n- Let me know if you are interested in a follow-up that covers any of these things\n\n## What will we be doing?\n- Take a look at the finished app\n- Introduce tech stack\n- Build the app, explain concepts where necessary\n- Deploy the app to Vercel (this won't take long!)\n\n## What do you need?\n- a package manager (we will use yarn classic, but you can also use npm or pnpm)\n- a postgres (or mysql but you have to change it in the schema) database for development (see TKTK link)\n- if you want to deploy it, a postgres (or other sql) database\n\n## Links\n- Docs\n  - Next.js\n  - tRPC\n  - React Query\n  - TKDodo\n  - Tailwind\n  - Next-Auth\n  - Zod\n\nFeatures to show\n- Next.js / React\n  - [x] _app.tsx\n  - [x] pages\n  - [x] components\n  - [x] custom hooks\n- tRPC\n  - [x] Routing\n  - [x] Queries \u0026 Mutations\n  - [x] Protected routes\n  - [x] inferQueryOutput\n  - [x] custom inferred types w/ generics\n- React Query\n  - [x] Query\n  - [x] Mutation\n  - [x] Optimistic Updates\n  - [x] Infinite Query\n  - [x] A query that doesn't fire automatically\n- Next-Auth\n  - [x] Discord Provider\n  - [x] Login, logout\n  - [x] Custom login page\n- Prisma\n  - [x] Making models\n  - [x] Using Postgres\n  - [x] CRUD\n  - [x] Prisma Studio\n  - [x] Aggregate\n  - [x] Add/remove relations\n- Zod\n  - [x] creating schema\n  - [x] inferring types from schema\n  - [x] using variables in schema\n- Tailwind\n  - [x] Just basic stuff\n\nGitHub-Twitter\n- [x] Auth\n- [x] Custom Auth Page\n- [x] Post schema\n- [x] Create a post\n- [x] get all posts - timeline on homepage\n- [x] invalidate posts onComplete\n  - [*] afterwards show in video that its stil slow on 3g\n- [x] actual optimistic update\n- [x] textbox styling\n- [x] get all posts, this time with pagination (maybe do this later?)\n  - [*] https://alpha.trpc.io/docs/useInfiniteQuery (www instead of alpha on final?)\n- [x] bugfix: make post update the data again\n- [x] user profile\n  - [x] with temp posts\n  - [x] with create post box if we're on our own profile\n  - [x] load in real posts later as infinite query and invalidate the right thing on new post\n  - [x] proper error on nonexistent user\n- [x] fix console error (breaking hooks rules?)\n- [x] edit post\n  - [x] without optimistic update\n  - [x] with optimistic update\n- [x] make infinite query limit global\n- [x] count of followers, following, posts on profile - use prisma count\n- [x] you can follow other users, including optimistic updates\n- [x] you can unfollow other users, including optimistic updates\n- [x] FIX: follow button visible on own profile\n- [x] view timeline of only posts by people you're following\n- [x] Search\n  - [x] Basic\n  - [x] Infinite Query  \n- [x] Show some TS generic stuff to simplify trpc inferred types\n- [x] can like/unlike posts\n  - [x] with optimistic updates\n- [x] Extract some mutations into hooks (explain why you might want to do this)\n- [x] Refactor DB access code\n  - [x] Paginated Searches\n  - [x] CreatePost\n  - [x] EditPost\n  - [x] Like/Unlike\n  - [x] All Searches\n- [x] fix homepage auth bug\n\nHOMEWORK after watching the video\n\n- [ ] can reply to posts, add a single post view page that shows replies\n- [ ] post can show how many replies it has and what it is a reply to\n- [ ] add count of how many liked posts a user has, clicking this opens /user/[...id]/liked\n- [ ] a page /user/[...id]/liked that shows anyone's liked posts\n- [ ] pages or modals that shows who a user's followers are, or who a user is following\n- [ ] make the app look good\n- [ ] Likes: Having to modify prisma calls in 4 different functions shows that there's probably a better way to generalize some of this stuff","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fc-ehrlich%2Ft3-tutorial-pre","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fc-ehrlich%2Ft3-tutorial-pre","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fc-ehrlich%2Ft3-tutorial-pre/lists"}