Free tutorials

Full-length courses and deep dives on Next.js, React, TypeScript, and modern web development.

32 tutorials · 184+ hours of content · All free on YouTube

TanStack Start Full Stack Course (10 Hours) | Server Functions, Middleware, Auth etc.

Latest tutorial

TanStack Start Full Stack Course (10 Hours) | Server Functions, Middleware, Auth etc.

TanStack Start has gained a lot of popularity recently, and for good reason. It's a game-changing framework offering end-to-end type safety while being one of the fastest on the market. In this tutorial, you'll learn everything there is to know about TanStack Start from A to Z. We'll cover the architecture, take a deep dive into routing, server functions, middleware, server routes, metadata and meta tags, data fetching, authentication, deployment, and much more. This isn't just a light overview, it's a deep dive covering all the key concepts in detail. By the end, you'll know how to build fast, secure, and well-optimized production-grade TanStack Start applications.

Beginner · 10h 4mWatch tutorial

Next.js 16 Full Stack Course (8+ Hours)

Next.js 16 Full Stack Course (8+ Hours)

Next.js is one of the most powerful React frameworks available and with the release of Next.js 16, it just got even better. New features like Cache Components make apps faster and more efficient than ever. In this video, we’ll take a complete deep dive into Next.js, and you’ll learn everything from A to Z. We’ll build a full production-ready application from scratch while exploring routing, server components, authentication, data fetching, real-time updates, caching, deployment, and much more. This won’t be just a light overview, we’ll dive deep into the dynamics of Next.js while creating a powerful and fully optimized web application.

Create a B2B AI SaaS with Next.js

Create a B2B AI SaaS with Next.js

Ever wanted to build a SaaS, and not just any SaaS, but a B2B SaaS with AI functionality included? Well, I have news for you, because in this video, we are doing exactly that. We are creating a team communication software with organizations, channels, fancy infinite scroll, oh, did I already mention billing? Of course, we will have billing implemented. Not only that, but we have thread support baked in, reactions, and of course, all of this is done in real-time using Cloudflare Durable Objects. But wait, we set out to create a B2B AI SaaS, and therefore, it's infused with AI. Not only can users easily summarize threads, but we also have a full-on AI composer. Need help with your message or just want to fix the grammar? The composer is there to help with one click of a button. This is literally the most in-depth tutorial I have ever created, and I am excited for you to get started on this project!

Create a LMS Course Platform with Next.js

Create a LMS Course Platform with Next.js

We will build a complete LMS course platform from absolute scratch. We will build everything from a beautiful landing page to display all of the available courses, continue with an admin dashboard to create courses, edit courses, track your success with analytics, and much more, and then we will move on to a breathtaking customer dashboard that allows the customer to track their video course progress, watch the videos individually, read the descriptions, mark lessons as completed, and much more.

Ultimate Guide to File Uploads in Next.js

Ultimate Guide to File Uploads in Next.js

Uploading files may seem simple but they come with a lot of complexity. Uploading through a Next.js server won't work because of the 1MB body size limit. Uploading directly from the client is insecure. The correct approach is using presigned URLs. In this video I show you how to generate presigned URLs using S3 and how to use them to upload files securely. We start by building a fully custom and accessible drag and drop zone. Then we implement file uploads using S3 and presigned URLs. I also show you how to track upload progress using native XHR. At the end we implement file deletion as well. This video is a complete guide to building a secure and user-friendly file upload flow in Next.js using S3 and presigned URLs.

IntermediateWatch

Master Next.js 15 in Just 3 Hours (With Authentication)

Master Next.js 15 in Just 3 Hours (With Authentication)

Next.js is probably the best React "meta" framework out there. Nevertheless, most people have no real clue how or where to get started. But with this video, everything will change! I will teach you Next.js from zero to hero and all in just 3 hours. We'll cover basic concepts like routing, server components, and client components, as well as more advanced topics such as streaming and caching. And of course, no application is complete without authentication, so we’ll add that too!

IntermediateWatch

Create a Job Board SaaS with Next.js

Create a Job Board SaaS with Next.js

In this massive video, we’re going to build the best job board SaaS you’ve ever seen! The best part? We’ll use the absolute top-notch tech on the market to achieve this. This includes Next.js, Inngest, Arcjet, Auth.js, Neon Postgres, Prisma, TailwindCSS, Shadcn/ui, Vercel, and much more. Trust me, this is a video you don’t want to miss! This full-stack tutorial covers everything from start to finish. Enjoy!

Create a Invoice Platform using Next.js 15

Create a Invoice Platform using Next.js 15

In this video, we are going to build a full stack Invoice Platform from complete scratch using the best tech on the market. This includes Next.js, Mailtrap, Neon Postgres, Prisma, Tailwind CSS, Auth.js, Shadcn/UI, Vercel, Conform and much more. This is a full-stack tutorial, which means we will build everything from start to finish!

IntermediateWatch

Ultimate Guide on File Uploads in Next.js

Ultimate Guide on File Uploads in Next.js

Hey everyone! File uploads are often one of the toughest features to get right. But after this video this will change. We’ll cover everything from creating a custom dropzone to uploading files server-side and client-side using a temporary API key, or as it’s often called, a presigned URL. For the storage itself we will use Pinata. We’ll also dive into file deletion and advanced validations directly on the dropzone. And to wrap it all up, I’ll show you how to retrieve and optimize your files for faster loading

Create a Scheduling Platform using Next.js 15

Create a Scheduling Platform using Next.js 15

In this video, we are going to build a full stack scheduling application from complete scratch using the best tech on the market. This includes Next.js, Nylas, Supabase Postgres, Prisma, Tailwind CSS, Auth.js, Shadcn/UI, Vercel, Conform and much more. This is a full-stack tutorial, which means we will build everything from start to finish!

Create a SaaS using Next.js 15

Create a SaaS using Next.js 15

Today, you are going to build a multi-tenant blogging SaaS application using the best tech on the market. This includes Next.js 15, Kinde Auth, Supabase, Prisma, Stripe, Tailwind CSS, shadcn/ui, Vercel, Conform, and much more. This is a full-stack tutorial, which means we will build everything from start to finish!

IntermediateWatch

Create an E-Commerce Store using Next.js

Create an E-Commerce Store using Next.js

🌟 Hey Everyone, Welcome back to the Channel. Today we are going to build an E-Commerce Store which has an admin dashboard and a storefront. To build/create this whole video we will use the newest tech on the market which means: Next.js, Kinde-Auth, Neon, Prisma, Stripe, Tailwindcss, Shadcn/UI, Vercel, Upstash and much more. This is a Full Stack tutorial, which means we will build everything from start to finish!

IntermediateWatch

Create a Digital Marketplace using Next.js 14

Create a Digital Marketplace using Next.js 14

🚀 Today we are going to create a Digital Marketplace using Next.js 14, Stripe Connect, Kinde, Prisma, Supabase, and Tailwind! Learn step-by-step and elevate your development skills.

IntermediateWatch

Create a Portfolio Website with Next.js.14

Create a Portfolio Website with Next.js.14

🚀 Create a modern Portfolio Website with Next.js.14, Tailwind, Kinde, Prisma and Supabase! Learn step-by-step and elevate your development skills.

Create a Reddit Clone with Next.js

Create a Reddit Clone with Next.js

Hey everyone, today we are going to build a full stack Reddit clone using the newest tech on the market. This means for example we will use: Next.js 14, Kinde, Supabase, Uploadthing Prisma, Tailwind etc.

IntermediateWatch

Create an Airbnb Clone with Next.js

Create an Airbnb Clone with Next.js

🚀 Build a SaaS Application using Next.js 14, Stripe, Kinde, Prisma, Supabase, and Tailwind! Learn step-by-step and elevate your development skills.

IntermediateWatch

Create a SaaS Application with Next.js

Create a SaaS Application with Next.js

🚀 Build a SaaS Application using Next.js 14, Stripe, Kinde, Prisma, Supabase, and Tailwind! Learn step-by-step and elevate your development skills.

IntermediateWatch

Create a modern UI/UX Website

Create a modern UI/UX Website

🚀 Ready to build a sleek, responsive website with Next.js 14? Join me in this hands-on tutorial where we'll explore the latest features and create a modern UI/UX masterpiece. Perfect for both beginners and pros looking to level up their skills! 💻✨

Build a Next.js 14 Blog

Build a Next.js 14 Blog

🚀 Build a stunning blog with Next.js 14! 🌐 Learn React, Sanity.io, Tailwind.css, and Shadcn/UI in this tutorial. 🛠️ Perfect for developers of all levels. Like, subscribe, and let's go! 💻

Next-Auth/Auth.js Tutorial

Next-Auth/Auth.js Tutorial

🚀 Dive into Next.js 14 authentication effortlessly! 🛡️ Learn how to authenticate your users with Prisma, Supabase, NextAuth, and TypeScript in this quick tutorial. 🔐✨

Netflix Clone using Next.js 14

Netflix Clone using Next.js 14

Ever wondered how to build your own Netflix-like app using Next.js? In this video, we'll dive into the exciting world of Next.js 14 and create a stunning Netflix Clone together. We'll be using popular tools like React, Supabase for managing our database, Next-Auth for authentication, Prisma for efficient database queries, and spicing things up with Tailwind.css and Shadcn/UI for some awesome styling.

IntermediateWatch

Next.js Server Actions

Next.js Server Actions

Learn everything of Next.js 14 Server Actions with this in-depth guide! In this video, we dive into Next.js 14 server actions, exploring their usage, data revalidation, managing pending states, resetting forms, and handling errors.

E-Commerce Store using Nextjs 14

E-Commerce Store using Nextjs 14

Build a modern and performant full stack Next.js 14 Ecommerce Website complete with secure Stripe payment integration, efficient content management through Sanity.io and beautiful styling using Tailwindcss and Shadcn UI for accessible components.

Realtime Chat App with Next.js 13

Realtime Chat App with Next.js 13

Welcome to this exciting tutorial, where we'll dive into the world of real-time communication! 🚀 In this video, we'll guide you through the step-by-step process of building a cutting-edge Realtime Chat Messaging App using Next.js 13, React, Pusher, Prisma, Supabase and Tailwind.css

Portfolio Website using Next.js 13

Portfolio Website using Next.js 13

🚀 Ready to elevate your portfolio game? In this cutting-edge tutorial, I will walk you through creating a stunning Portfolio Website using the latest tech stack - Next.js 13, React, Tailwind.css, and Sanity! 🌟 Whether you're a seasoned developer or just starting your coding journey, this step-by-step guide will empower you to showcase your projects like a pro. 🎯

AI Chatbot with Next.js 13

AI Chatbot with Next.js 13

Welcome to this in-depth Full Stack Tutorial where I will guide you through the process of building an impressive AI Chatbot using cutting-edge technologies. In this video, I will walk you step-by-step through the development of your own intelligent chatbot, incorporating the latest tools and frameworks.

Next.js 13 Full Stack Tutorial

Next.js 13 Full Stack Tutorial

In this tutorial, you will learn latest and greatest features of Next.js 13, the powerful JavaScript framework for building fast and scalable web applications. Join me as we dive deep into the world of full-stack development, exploring routing, data fetching, and server actions.

Realtime Chat Messaging App with Remix

Realtime Chat Messaging App with Remix

Join me in this exciting coding tutorial as we dive into the world of full stack development! In this video, we'll be creating a feature-rich chat messaging application using Remix.run using the power of Server-Sent Events.

Blog with Next.js 13

Blog with Next.js 13

Learn how to build and deploy a modern blog using Next.js 13, React, Tailwind.css, and Sanity.io in this tutorial. Discover the step-by-step process and powerful technologies needed to create a dynamic and visually appealing blog in 2023.

Remix.run V2 Tutorial

Remix.run V2 Tutorial

Welcome to the Remix.run V2 Full Stack Tutorial 2023 Crash course! In this exciting Crash course, we'll dive deep into the latest version of Remix.run, a cutting-edge framework for building full stack JavaScript applications.

Personal Website using Remix.run

Personal Website using Remix.run

Welcome to my latest YouTube tutorial on creating a personal website with a blog using the powerful combination of Remix.run, Tailwind.css, Hygraph, and GraphQL! 🚀

E-Commerce Store with Remix.run

E-Commerce Store with Remix.run

Learn how to build a cutting-edge E-Commerce app using Remix.run, Stripe, Sanity.io and Tailwind.css in this comprehensive coding tutorial. Discover the power of Remix.run's web framework, integrate seamless payment processing with Stripe, and enhance your app's visual appeal with Tailwind.css.

New tutorials every few weeks.

Subscribe on YouTube so you don't miss the next full-length course or deep dive.

Subscribe on YouTube