Build & Deploy a Complete MERN Stack Blog With Admin Dashboard

Deploy your MERN stack app with Sevalla! Get $50 in free credit using my link: 👉 https://sevalla.com/?utm_source=codew... In this comprehensive, step-by-step tutorial, you will learn how to build and deploy a complete MERN stack blog application ("Bitblog") from scratch. This isn't just a simple demo; it's a full-featured platform with a modern front-end, a secure back-end, and a complete admin dashboard to manage all your content, users, and comments. This is the perfect portfolio project to impress employers! By the end of this video, you will have built: ✅ A beautiful, responsive blog homepage using React and ShadCN ✅ Secure user authentication (Sign up & Login) with JWT ✅ A powerful admin dashboard to manage posts, users, and comments ✅ A rich text editor (like Medium) using Tiptap ✅ Image uploads handled by Multer and stored in Cloudinary ✅ A secure and efficient REST API with Node.js and Express ✅ User profile management and settings 💻 Front-End Tech Stack: – React (with TypeScript) – React Router – ShadCN (for modern UI components) – Framer Motion (for animations) – Tiptap (for the advanced text editor) ⚙️ Back-End Tech Stack: – Node.js & Express.js. – MongoDB (with Mongoose) – JWT (JSON Web Token) for authentication – Bcrypt (for password hashing) – Multer & Cloudinary (for file uploads) – Winston & Logtail (for logging) – Helmet, CORS, compression, express-validator & more for security 🔗 ESSENTIAL LINKS: Blog api docs page: https://docs.blog-api.codewithsadee.com/ Frontend Assets: https://drive.google.com/file/d/1zAji... Source code (Frontend): https://www.patreon.com/posts/source-... Source code (Frontend) Buymeacoffee: https://buymeacoffee.com/codewithsade... Source code (Backend) FREE: https://www.patreon.com/posts/rest-ap... Github Gist: https://gist.github.com/codewithsadee... Hostinger Special Link for Hosting: http://hostinger.com/in/codewithsadee TIMESTAMPS: 00:00 Intro 04:13 Backend: Demo 22:44 Backend: Project initial 50:00 Backend: Root route 53:06 Backend: Handle server shutdown 54:51 Backend: Setup MongoDB 1:05:59 Backend: Setup winston for logging 1:16:47 Backend: Register 2:04:40 Backend: Login 2:30:44 Backend: Logout 2:46:30 Backend: Get current user 3:00:42 Backend: Update current user 3:14:21 Backend: Delete current user 3:21:11 Backend: Get all user 3:32:08 Backend: Get user by id 3:36:23 Backend: Delete user by id 3:39:48 Backend: Create a blog 4:26:31 Backend: Get all blogs 4:35:08 Backend: Get blogs by user 4:39:31 Backend: Get blog by slugs 4:46:23 Backend: Update blog 4:58:48 Backend: Delete a blog 5:11:49 Backend: Like a blog 5:25:32 Backend: Unlike a blog 5:30:58 Backend: Create a comment 5:42:43 Backend: Get comments by blog 5:47:03 Backend: Delete a comment 5:55:50 Backend: Setup Hostinger for API hosting 6:11:15 Backend: Domain configuration 6:12:11 Backend: Setup Nginx 6:17:20 Backend: SSL certificate 6:21:07 Backend: Setup BetterStack for API monitoring 6:24:41 Backend: Setup Logtail for API logging 6:34:47 Backend: Setup GitBook for API documentation 6:48:49 Frontend: Demo 6:56:18 Frontend: Initial Setup 7:02:19 Frontend: Login 7:21:37 Frontend: Signup 7:40:47 Frontend: Root layout 7:41:48 Frontend: Loading 7:44:37 Frontend: Header 8:05:25 Frontend: User settings 8:29:09 Frontend: Footer 8:33:13 Frontend: Home 8:58:55 Frontend: All blogs 9:02:24 Frontend: Blog detail 9:16:18 Frontend: Admin layout 9:43:21 Frontend: Dashboard (blog create, edit, delete) & user management 11:45:15 Frontend: Deployment Like, share, and subscribe for more full-stack tutorials! #MERNstack #React #Nodejs #FullStackProject #AdminDashboard #TypeScript