React Node.js Blog App Full Tutorial (Infinite Scroll, User Roles, Filters) MERN Stack Blog Website

Full-Stack blog website tutorial with React 19, Express 5, MongoDB

Source Code:

Join Lama Dev groups

00:00 Introduction
03:52 Installation
07:30 React Tailwind Responsive Layout
11:23 React Tailwind Responsive Navbar
14:34 React Tailwind Hamburger Menu Desing
22:06 React Image Optimization Tutorial
31:00 React Router Dom Tutorial - React 19 Edition
36:32 5 React Router Dom Outlet Tutorial
40:04 React 19 Clerk Authentication Tutorial
47:47 Blog Website Homepage Design
55:44 Homepage Blog Category Section Design
01:02:25 Homepage Featured Posts Design
01:12:40 Post List Design
01:19:38 React Reducing Image Size
01:25:40 React Single Post Page Design
01:41:07 Comments Section Design
01:46:58 New Post Page Form Design
01:59:10 Post List Page Design
02:04:01 React Responsive Side Menu Design
02:10:34 Express 5 Tutorial
02:15:33 Express 5 Rest API Tutorial (Routes, Models, Controllers)
02:21:05 React 19 Express 5 MongoDB Tutorial with
02:27:04 Creating MongoDB Models with Mongoose
02:34:39 MongoDB Table(collection) Relationships
02:35:52 MERN Stack CRUD Tutorial
02:49:38 Express 5 Error Handling Tutorial
02:52:20 How to Add Clerk Users to a Database (Clerk Webhook Tutorial)
03:06:42 Express 5 Clerk Authorization (Protecting Routes)
03:14:34 Clerk Auth with a Backend API Using Bearer Token
03:20:30 React 19 React Query Tutorial
03:22:29 React 19 Data Fetching with React Query
03:27:35 React 19 Data Mutations with React Query
03:44:53 React 19 Image/Video Upload Tutorial
04:09:16 React 19 Infinite Scroll with React Query
04:25:00 Fetch Single Post Data using React Query
04:30:49 Fetching Post Comments
04:39:48 Add a New Comment with Mutations
04:45:06 Save and Delete Posts with React Query Optimistic Mutations
05:07:50 React Clerk User Roles Tutorial
05:10:20 MERN Stack Role-Based Authorization
05:25:07 React 19 Fetch Data with URL Params (Search Param Queries)
05:37:04 React 19 Search Functionality
05:41:56 React 19 Filter Lists and Re-fetch Data
05:45:50 MERN Stack Increase Page Visit
05:52:28 Fetch Featured Posts
05:57:06 How to Deploy Full Stack Applications to a VPS
06:06:32 VPS Full-Stack App Deployment with PM2
06:12:42 Outro

[ghostedbyseen]

Hey man, I hope you read this comment. I took a lot of help from one of your earlier videos for my full stack project in college, it went really well and I learnt a lot. Thank you!

[mengistu]

believe or not after three weeks on "5:56:48" I heard "se we have finished our project" Lema...to practice and clone this project i took full three weeks without any breaks ..i gained confidence really ...i have no word for your explanation again your code is understandable and very optimized one...your design pattern is installed within my mind....everything was perfect.⭐⭐⭐⭐⭐

[codewithron]

1:12:29
putting timestamps here so that i can continue from where i left
and thank you for this course appreciate it❤

[johnedet]

One significant challenge with React when building a blog is managing dynamic metadata effectively. Unlike Next.js, which has built-in support for handling metadata, finding a solution using only React can be tricky. Since it’s a blog, having dynamic metadata for each post is essential, and I’m exploring ways to address this without relying on Next.js. Maybe a tuts from you to address this, will be helpful

[ader]

Currently watching your blog tutorial with next13 and now i get the notification for this video 😂

[Nikushimi-]

Finally a Mern Stacked ♥️ Thank you so much Lama Dev, one of the reason I Graduated and found a job ♥️ Thank you so much..

[fistewie]

Loving this video so far! Great features included in the tutorial like infinite scrolling, sort features, etc. Fantastic job!

[Sattiboyy]

Done with project
Thank you Lama dev i learnt a lot!

[RobertoN-plec]

Yes! You back brother! as always with a good mentoring tutorial

[devanshkansara]

If anyone's having problems with the ngrok, remember if you quit the ngrok and start it again, the endpoint will change, so you will need to change it in the clerk's webhook as well.

[eQ-]

Just liked the video before I watch whole of it because I know its awesome.

[muzamilfootballer]

Sir you are best on YT 😍 i was waiting for your video from many days and this is super 👌🏻Love u sirr 😍😍

[mirazh]

❤❤❤❤ the best guy on YouTube is back.🎉🎉🎉🎉

[coder]

The best blog app on Youtube so far. Thank you so much.

[sojdzezz]

what a perfect time to start to make a new project now after my hard day from work. coffee and programming forever. :)

[pastorjorgeaguilar]

i loved your channel lama dev. thank you

[PETERFILM]

Thank you very much for your work! You have the best tutorials on all of YouTube!

[AbhishekYadav-chmn]

When will you start working on a MERN microservice or microfrontend architecture? All your previous projects have been monolithic. Please consider creating an e-commerce application using a microfrontend and microservice architecture.

[snehashishpatra]

I cannot hold and I would like to say that this reactjs video is a real gem for both beginners and also intermediate level. Sir just a small query can you also please delve into the SEO of react.js it would much worth if the pages are indexed on google I hope we will hear soon from you. I particularly want to learn how do we add open graphs and we have social sharing preview card in react. Thank you again☺☺

[KrishnaList]

Always upload quality content. Thanks Lama