Full-Stack Blog App Tutorial | Next.js MongoDB Blog App Project Full Course

Published: 04 September 2023
on channel: Lama Dev
363,528
8k

React Next.js full-stack app project for beginners. Next.js 13 App router full course with MongoDB Get Hostinger Discount: http://hostinger.com/lamadev10 Coupon Code: LAMADEV

If it is valuable to you, you can support Lama Dev.
Join:    / @lamadev  
Buy me a coffee: https://www.buymeacoffee.com/lamadev

Source Code:

Start here: https://github.com/safak/next-blog/tr...
Completed: https://github.com/safak/next-blog/tr...

How to create and copy an SSH key in the terminal: https://github.com/safak/youtube/tree... (Step 1 to Step 6)

App structure: https://app.eraser.io/workspace/aSshP...

00:00 Introduction
03:08 Installation
04:15 Design Structure
06:25 Styles, Layouts, Containers
10:35 CSS Responsive Layout Tutorial
14:30 Next.js CSS Styles and Layout
20:00 Responsive Navbar Design
28:40 CSS Dark Mode Theme Toggle Design
31:25 Next.js Context API Tutorial
45:40 Next.js Responsive Hamburger Menu Tutorial
54:00 Blog App Featured Post Design
58:30 Blog App Category Component Design
01:06:40 CSS Flexbox (Content - Side Menu Design)
01:08:00 Blog Post Card Component Design
01:15:00 Side Menu Component Design
01:32:10 Pagination Button Design
01:33:20 Footer Component Design
01:42:20 Blog Category Page Design
01:45:05 Single Post Page Design
02:02:50 Next.js Login Page Design
02:08:50 Add New Post Page Design ([Medium.com](http://Medium.com) Editor Clone)
02:20:10 Next.js API - MongoDB - Prisma Structure
02:22:17 Next.js Authentication Tutorial (Auth.js)
02:26:10 Next.js How to Sign in with Google
02:33:48 Next.js MongoDB Prisma Tutorial (App Router)
02:42:50 Prisma Blog App Schema Example
02:58:50 Next.js App Router Rest API Tutorial
02:51:34 Next.js How to Fetch Data on the Server Side
02:54:53 Fetch All Posts
02:55:25 Next.js Pagination Tutorial (SSR)
03:08:30 Next.js Send a Query to API (Fetch Post by Category)
03:14:49 Fetch a Single Post with the User Information
03:21:30 Fetch All Comments of a post
03:23:22 Next.js Client Side Data Fetching (App Router)
03:30:38 Create a Comment
03:33:32 Next.js SWR Mutation
03:36:36 Add New Post
03:37:35 How to Upload Image using Firebase
03:54:09 Prisma Increase Post View
03:56:40 How to Deploy Next.js App to a VPS Server
04:05:30 Outro


Watch video Full-Stack Blog App Tutorial | Next.js MongoDB Blog App Project Full Course online without registration, duration hours minute second in high quality. This video was added by user Lama Dev 04 September 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 363,528 once and liked it 8 thousand people.