Summary
Keywords
Full Transcript
How To Build and Deploy Full Stack Social Media Marketplace or Buy and Sell website using PERN Stack | Build listing website using React 👉 Clerk Auth: https://go.clerk.com/iBiOefq 👉 Neon: https://get.neon.com/GdIJT9H 👉 Inngest: https://innge.st/Yt-gs-6 👉 ImageKit: https://tinyurl.com/2s7fnc8n 👉 Assets & Source Code: https://greatstack.dev/p/flipearn 👉 Live Preview: https://flipearn.vercel.app 👉 Part 2 Tutorial: https://youtu.be/Tt9yMQaYuDE ImageKit docs: https://tinyurl.com/tnybufw3 Inngest YT Channel: https://www.youtube.com/@inngest SUBSCRIBE: @GreatStackDev ------------------- In this video, we are going to build and deploy a Full stack Social Profile marketplace Application using PERN Stack. In this full stack marketplace project, users can buy and sell their social media profiles. It is an online buy and sell website. Any user can signup on this website and list their social media profile for sale. Then we have created the admin panel, where admin can verify and update the social profile credentials. After updating the credentials user can buy that social profile and receive the credentials on email. In this project we have create user authentication and subscription billing using Clerk. Clerk makes it easy to handle user sign-in, sign-up and account management. With clerk’s subscription billing feature, we can provide advanced features to our premium members. We can also offer the free trail of the premium plan. We have added Inngest in this project to manage the Background Jobs. Using inngest functions we will send new order and listing emails. It will also help us handle Clerk webhooks more efficiently. To store user, listings and order data we are going to use Neon. Neon is a server less PostgreSQL database that helps developers build reliable and scalable applications quickly. To store and optimize images we have used ImageKit. ImageKit is a real-time media processing product that helps optimize, stream, and transform images and videos for the web. It can automatically compress and convert images and videos to a suitable format for every device. #fullstack #greatstack #coding #programming #fullstackproject #fullstackwebdevelopment #collegeprojects #webdevelopment #postgresql #marketplace #reactjs ----- Timestamp ----- 00:00 Project Overview 09:44 Basic React Project 38:33 Create Home Page 01:01:50 Setup User Authentication using Clerk 02:17:37 Create Marketplace Page 03:38:00 Create Listing Details Page 04:39:45 Create Chat Box 05:23:41 Create Messages page 05:50:51 Create My Listings page 07:11:38 Create Manage Listing page 08:03:54 Create My Orders Page 08:30:29 Setup admin pages 08:38:12 Create Backend Server 04:44:49 Connect Neon Database 08:54:11 Integrate Clerk Auth in Backend 08:56:47 Integrate Inngest for Background Jobs 09:36:52 Integrate ImageKit for image storage and transformation 10:47:43 Connect Listing APIs with Frontend 11:37:47 Connect Chat APIs with Frontend ------------------- Watch Full Stack Food Order Website tutorial: 👉 https://youtu.be/DBMPXJJfQEA Watch Full Stack Chat App tutorial: 👉 https://youtu.be/gbocZlm71nE Watch Full Stack Music Streaming Website 👉 https://youtu.be/KdGfhSpT6pc Watch Full Stack Blog Website Tutorial 👉 https://youtu.be/HdWCh_4XE1Q ------------------------------------- Build more React JS projects: Complete Portfolio Website In React: 👉 https://youtu.be/4ag1LsgIUc0 Build ChatGPT Clone In React: 👉 https://youtu.be/EzkWAviyYgg Build AI Image Generator with OpenAI In React 👉 https://youtu.be/PZG2MvOjud0 Create Weather App In React 👉 https://youtu.be/7JqdjWB88Kk ------------------------------------- Images Credit: https://www.pexels.com/ https://unsplash.com/ https://www.freepik.com/ ------------------------------------- Connect with me: 👉 https://linktr.ee/iamavinashkr Connect with GreatStack: Instagram: https://instagram.com/GreatStackDev Twitter: https://twitter.com/GreatStackDev Facebook: https://facebook.com/GreatStack
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
