❗ Sign up to get the Code for FREE here (Form must be submitted, not skipped!): https://aka.ms/Sonny_functions

Join the world’s BEST developer community & course Zero to Full Stack Hero: https://www.papareact.com/course

LOOKING FOR THE CODE?
https://links.papareact.com/github

Join me as I show you how to build a Disney+ clone from scratch with the newly released Next.js 14. You'll learn the following in this build:

Create a Beautiful UI & UX for our Disney+ clone using the highly Popular Shadcn!
How to create and leverage the power of Azure Functions
How to use the Azure OpenAI service for AI movie suggestions and completions!
How to use Loaders in various ways whilst data is being fetched!
How to cache data with Next.js 14 to optimise API calls and provide a Seamless, fast experience for the user
How to build a beautiful UI design with Tailwind CSS!
Learn how to implement Dark Mode toggling to update the UI based on user preference!
How to use TypeScript to reduce the overall number of Bugs and Errors
How to deploy the final build on Vercel!

Want coding problems (with solutions!) delivered to your inbox daily!?
Sign Up Here: https://www.papareact.com/universityo...

WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST?
Sign up for the PAPAFAM Newsletter here https://links.papareact.com/newsletter

TIMESTAMPS
00:00 Introduction
01:02 Build Showcase
04:21 Access the Build Source Code for Free!
06:53 Build Tech (1/2)
07:26 Microsoft Azure Sponsorship
08:37 Build Tech (2/2)
12:27 Initialising the Build
17:32 Building the Home Page (1/2)
22:37 Build Plan
24:56 Building the Search Page (1/2)
31:31 Building the Genre Page (1/2)
38:09 Implementing Shadcn/ui
43:32 Building the Header Component (1/2)
51:08 Implementing Light & Dark Mode
56:06 Building the Header Component (2/2)
59:11 Building the Search Input Component
1:10:49 Implementing TMDB (The Movie Database) API
1:21:56 Setting Up Type Definitions
1:22:46 Building the Genre Dropdown Component
1:27:49 Building the Home Page (2/2)
1:29:26 Building the Movies Carousel Component (1/3)
1:32:15 Fetching Movie Information from TMDB API
1:40:17 Building the Movies Carousel Component (2/3)
1:41:05 Building the Movie Card Component
1:53:24 Building the Movies Carousel Component (3/3)
2:01:54 Building the Carousel Banner Wrapper Component
2:19:01 Building the Search Page (2/2)
2:27:37 Implementing Microsoft Azure OpenAI Service (1/3)
2:43:59 Implementing the OpenAI API Key
2:45:11 Implementing Microsoft Azure OpenAI Service (2/3)
2:54:04 Implementing useSWR (Approach #2 for AI Assistant)
3:06:35 Implementing Microsoft Azure OpenAI Service (3/3)
3:12:48 Building the Open AI Azure Suggestion Component
3:17:41 Building the Genre Page (2/2)
3:19:57 Deploying to Vercel with Live Debugging
3:54:04 Final Build Demo
3:54:37 Outro

Let’s get it PAPAFAM .

DISCLAIMER: This Video is made for informational and educational purposes only. We do not own or affiliate with Disney and/or any of its subsidiaries in any form. Copyright Disclaimer Under section 107 of the Copyright Act 1976, allowance is made for “fair use” of this video for education purposes.

#nextjs #nextjs14 #react #disneyplus #typescript #reactjs #disney #coding #javascript #tailwindcss #shadcn #nosql #reactjstutorial #coding #tutorial #beginner #programming