🔴 Let’s build a LinkedIn Clone with NEXT.JS 14! (Microsoft Azure, GitHub Copilot, MongoDB, TS)
❗️ Get the Source Code for FREE: https://github.com/sonnysangha/linked...
🚨 Join the world’s BEST developer community & course Zero to Full Stack Hero: https://www.papareact.com/course
🫂 Join my Community, "University of Code" for FREE: https://www.universityofcode.com
🔴 Looking for the code for my other builds? 🛠️
https://links.papareact.com/github
📩 Want coding problems (with solutions!) delivered to your inbox daily? https://www.papareact.com/dailycoding...
Join me as I show you how to build a LinkedIn 2.0 clone from scratch with the latest Next.js 14. You'll learn the following in this build:
👉 Ability to Create/Delete a post, Like / Unlike posts and Comment on posts!
👉 Create a complete Backend API with GET, POST, DELETE etc. requests! (With Error Handling)
👉 How to implement MongoDB in combination with Azure Cosmos DB to provide a scalable storage/database solution
👉 How to use Mongoose, a third-party library for MongoDB, to help structure and access your data with ease.
👉 How to upload/download images to & from Microsoft Azure Blob Storage securely
👉 How to utilise the powerful GitHub Copilot to get AI-based suggestions in real time to supercharge your code!
👉 How to use Clerk Authentication to add Google user authentication with ease! (Including Authentication Middleware for Next.js)
👉 How to utilise the power of Server Actions & caching in Next.js to create an optimal & efficient user experience!
👉 How to use Next.js 14 Server Components & Client Components and when/where to use them!
👉 Create a Beautiful UI & UX for our Frontend using the highly Popular Shadcn & Tailwind CSS
👉 How to use TypeScript to reduce the overall number of Bugs and Errors
👉 How to deploy the final build on Vercel
🎵 WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST?
Sign up for the PAPAFAM Newsletter here 👉 https://links.papareact.com/newsletter
🕐 TIMESTAMPS:
00:00 Introduction
1:08 Build Demo
3:45 VS Code Day 2024
6:37 Build Tech
12:29 Initialising the Build
20:17 Setting Up Shadcn/ui
22:50 Creating the Header Component
26:20 Building the Header Component
40:51 Implementing Clerk for Authentication
51:16 Building the User Information Component
1:06:15 Building the Post Form Component (1/2)
1:26:45 Implementing Next.js 14 Server Actions (1/2)
1:29:44 Setting Up Azure Cosmos DB for MongoDB
1:32:47 Implementing Azure Cosmos DB for MongoDB Cluster
1:34:34 Implementing Mongoose
1:38:11 Creating MongoDB Schemas for Posts
1:50:11 Creating MongoDB Schemas for Likes & Unlikes
1:53:28 Creating MongoDB Schema for Deleting Posts
1:54:33 Creating MongoDB Schemas for Comments
1:57:48 Creating MongoDB Schema for Getting All Posts
2:04:31 Implementing Next.js 14 Server Actions (2/2)
2:08:51 Explaining API Endpoints for the Backend
2:12:02 Creating an API Endpoint for Fetching All Posts
2:20:00 Creating an API Endpoint for Deleting a Post
2:24:18 Creating API Endpoints for Liking & Unliking Posts
2:26:24 [BONUS] API Endpoints for Followers & Following
2:27:10 Creating an API Endpoint for Comments
2:28:42 Testing All the API Endpoints
2:34:39 Implementing MS Azure Blob Storage for Image Upload Functionality
2:49:07 Building the Post Feed Component
2:51:38 Building the Post Component (1/2)
3:01:29 Implementing the Delete Post Server Action
3:08:14 Building the Post Component (2/2)
3:11:16 Building the Post Options Component
3:18:39 Calling the API Endpoints for Liking & Unliking Posts
3:25:21 Implementing the Comment Functionality
3:46:36 Fixing the UI & Adding Widgets
3:58:54 Implementing Toast Notifications with Sonner from Shadcn/ui
4:06:42 Deploying to Vercel
4:10:21 Final Deployed Build Demo
4:15:07 Build Summary
4:18:33 Outro
Let’s get it PAPAFAM 🔥.
DISCLAIMER: This Video is made for informational and educational purposes only. We do not own or affiliate with LinkedIn 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 #linkedin #typescript #reactjs #coding #javascript #tailwindcss #shadcn #nosql #reactjstutorial #coding #tutorial #beginner #programming #ai #machinelearning #mongodb #mern #mernstack #mongoose #microsoft #azure #github #copilot #microsoft #azure #vscode
Смотрите видео 🔴 Let’s build a LinkedIn Clone with NEXT.JS 14! (Microsoft Azure, GitHub Copilot, MongoDB, TS) онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Sonny Sangha 01 Январь 1970, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 55,385 раз и оно понравилось 1.6 тысяч людям.