🔴 Let’s build a LinkedIn Clone with NEXT.JS 14! (Microsoft Azure, GitHub Copilot, MongoDB, TS)
55.2 هزار بار بازدید -
5 ماه پیش
-
❗️ Get the Source Code
❗️ Get the Source Code for FREE: https://github.com/sonnysangha/linkedin-clone-nextjs-14-copilot-azure-cosmos-db-typescript-shadcn
🚨 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/dailycodingchallenges
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:
https://www.seevid.ir/fa/w/efCgsdc9eAA Introduction
https://www.seevid.ir/fa/w/efCgsdc9eAA Build Demo
https://www.seevid.ir/fa/w/efCgsdc9eAA VS Code Day 2024
https://www.seevid.ir/fa/w/efCgsdc9eAA Build Tech
https://www.seevid.ir/fa/w/efCgsdc9eAA Initialising the Build
https://www.seevid.ir/fa/w/efCgsdc9eAA Setting Up Shadcn/ui
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating the Header Component
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the Header Component
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing Clerk for Authentication
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the User Information Component
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the Post Form Component (1/2)
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing Next.js 14 Server Actions (1/2)
https://www.seevid.ir/fa/w/efCgsdc9eAA Setting Up Azure Cosmos DB for MongoDB
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing Azure Cosmos DB for MongoDB Cluster
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing Mongoose
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating MongoDB Schemas for Posts
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating MongoDB Schemas for Likes & Unlikes
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating MongoDB Schema for Deleting Posts
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating MongoDB Schemas for Comments
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating MongoDB Schema for Getting All Posts
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing Next.js 14 Server Actions (2/2)
https://www.seevid.ir/fa/w/efCgsdc9eAA Explaining API Endpoints for the Backend
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating an API Endpoint for Fetching All Posts
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating an API Endpoint for Deleting a Post
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating API Endpoints for Liking & Unliking Posts
https://www.seevid.ir/fa/w/efCgsdc9eAA [BONUS] API Endpoints for Followers & Following
https://www.seevid.ir/fa/w/efCgsdc9eAA Creating an API Endpoint for Comments
https://www.seevid.ir/fa/w/efCgsdc9eAA Testing All the API Endpoints
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing MS Azure Blob Storage for Image Upload Functionality
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the Post Feed Component
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the Post Component (1/2)
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing the Delete Post Server Action
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the Post Component (2/2)
https://www.seevid.ir/fa/w/efCgsdc9eAA Building the Post Options Component
https://www.seevid.ir/fa/w/efCgsdc9eAA Calling the API Endpoints for Liking & Unliking Posts
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing the Comment Functionality
https://www.seevid.ir/fa/w/efCgsdc9eAA Fixing the UI & Adding Widgets
https://www.seevid.ir/fa/w/efCgsdc9eAA Implementing Toast Notifications with Sonner from Shadcn/ui
https://www.seevid.ir/fa/w/efCgsdc9eAA Deploying to Vercel
https://www.seevid.ir/fa/w/efCgsdc9eAA Final Deployed Build Demo
https://www.seevid.ir/fa/w/efCgsdc9eAA Build Summary
https://www.seevid.ir/fa/w/efCgsdc9eAA 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
5 ماه پیش
در تاریخ 1403/02/04 منتشر شده
است.
55,239
بـار بازدید شده