Description

Which Pokemon is roundest??? Today we will find out! Theo builds a full stack web app using the T3 Stack as detailed on https://init.tips If you're interested in Next.js, React, TypeScript, Prisma, tRPC, PlanetScale + MySQL, and Tailwind, all deployed on Vercel, you're in the right place :) The services we used are... Planetscale - https://planetscale.com/?ref=theo Vercel - https://vercel.com/?ref=theo Check out the final product at https://roundest.t3.gg Github repo: https://github.com/TheoBr/roundest-mon Follow me on twitter for more web dev BS: https://twitter.com/t3dotgg Rough timestamps: 0:00 - Intro & planning in Excalidraw 4:15 - Initializing with init.tips 5:00 - Tailwind setup 17:15 - API setup with tRPC 27:45 - Random pokemon endpoint 39:00 - SSR is hard 1:04:00 - PlanetScale and Prisma setup 1:26:00 - Image optimization and caching with `@next/image` 1:38:50 - Cache pokemon from PokeAPI in our db 1:43:00 - Relations are hard (Prisma fails) 1:58:00 - Backfilling all pokemon into db 2:11:00 - Results page 2:35:40 - Typescript saves us