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

Overview

Embark on a comprehensive full-stack development journey with this 4-hour tutorial on building a blog application using Next.js 13 and MongoDB. Learn to create a responsive layout, implement dark mode, and design key components like the navbar, featured posts, and category sections. Dive into server-side rendering, API development with Next.js App Router, and database integration using Prisma. Master authentication with Auth.js, including Google sign-in. Explore client-side data fetching, image uploads with Firebase, and pagination implementation. Conclude with deployment strategies for your Next.js app on a VPS server, equipping you with end-to-end knowledge for creating and launching a full-featured blog platform.

Syllabus

Introduction
Installation
Design Structure
Styles, Layouts, Containers
CSS Responsive Layout Tutorial
Next.js CSS Styles and Layout
Responsive Navbar Design
CSS Dark Mode Theme Toggle Design
Next.js Context API Tutorial
Next.js Responsive Hamburger Menu Tutorial
Blog App Featured Post Design
Blog App Category Component Design
CSS Flexbox Content - Side Menu Design
Blog Post Card Component Design
Side Menu Component Design
Pagination Button Design
Footer Component Design
Blog Category Page Design
Single Post Page Design
Next.js Login Page Design
Add New Post Page Design [Medium.com]http://Medium.com Editor Clone
Next.js API - MongoDB - Prisma Structure
Next.js Authentication Tutorial Auth.js
Next.js How to Sign in with Google
Next.js MongoDB Prisma Tutorial App Router
Prisma Blog App Schema Example
Next.js App Router Rest API Tutorial
Next.js How to Fetch Data on the Server Side
Fetch All Posts
Next.js Pagination Tutorial SSR
Next.js Send a Query to API Fetch Post by Category
Fetch a Single Post with the User Information
Fetch All Comments of a post
Next.js Client Side Data Fetching App Router
Create a Comment
Next.js SWR Mutation
Add New Post
How to Upload Image using Firebase
Prisma Increase Post View
How to Deploy Next.js App to a VPS Server
Outro