CRUD App with Next.js 16 and tRPC

Description

In this video, we build a simple CRUD task manager using Next.js 16 and tRPC. You’ll see how the server and client share the same TypeScript types, how changes on the backend instantly reflect on the frontend, and why this approach eliminates duplicated API code. 🛠️ Tools & Packages Used: - [Next.js]: https://nextjs.org/ - [tRPC]: https://trpc.io/ - [zod]: https://zod.dev/ ⏱️ Timestamps: 00:00 - Introduction 01:02 - Setting Up Next.js 16 with tRPC 02:10 - Building the tRPC Server Router 05:02 - Configuring the tRPC Client 06:58 - Fetching Data with tRPC (Query) 09:18 - Creating a New Task (Mutation) 12:30 - Updating Task State (Toggle Mutation) 14:45 - Deleting a Task (Delete Mutation) 🌐 Check out more content: - My Portfolio: https://www.cand.site/ - Medium: https://medium.com/@ckriswinarto 💻 Get the Source Code: - GitHub: https://github.com/candraKriswinarto/nextjs-trpc 🌐 Recommended Digital Tools (Affiliate Links): - Hostinger: Get 20% Off on Web Hosting - https://dub.sh/zrpWarU