Learn, Apply, Build a Blog Project using Redux (Redux Toolkit), NodeJs, Express, MongoDB, React js, Tailwindcss
What you will learn
How to create a complete MERN stack project from scratch to finis
How to implement authentication both in server side and client side
How to block and unblock a user
How to upload images to cloudinary
How to resize image on the server
How to create a complete Blog API
How to send email using sendgrid
How to reset password. Forget password functionality
How to use redux – redux toolkit to manage the application state
How to implement follow and unfollow of a user API
How to implement account verification using token
Description
Course description:
This course is all about managing the state in react application using the redux toolkit. Each topic included in this course is added incrementally, to make sure that you have a solid foundation of knowledge. You’ll find plenty of discussions added in to help you understand exactly when and where to use
What will you build?
- Learn how to create a real-world blog application with a bunch of features
- Develop Node Js API from scratch
- How to implement react js logic to real-world application
- Understand backend authentication
- Learn how to upload files to Cloudinary
- Learn how to block and unblock a user
- Learn how to block a user by the application if the post the user is creating contains sum profane words
- Learn how to resize images on the server-side
- Learn how to implement forget password functionality
- Learn how to implement follow and unfollow a user
- Learn how to manage state in react using redux (redux toolkit)
- How to implement account verification using a token
- Learn how to implement sending Emails using Sendgrid
- How to implement user management
- Learn how to implement like and dislike of a post
Who this course is for:
- Programmers looking to master MERN Stack
- Developers who want to move from the traditional way of writing redux application
- Engineers who have researched React but have had trouble mastering some concepts
English
language
Content
Introduction
Project Intro
Must Read
Environment Setup
User Authentication
Backend API Features
Course Path
Express Server
Connect to MongoDB
Environment Variable DOTENV
MVC architecture explained
Data Modelling Explained
User Data Modelling
User Registration controller Part 1
User Registration controller Part 2
Middleware Explained
Hashing User password using Bcryptjs
Prevent Duplicate Registration of a User
Express Routing
Error Handling
Not Found Error Handling
User Login Controller Part 1
User Login Controller Part 2
Generate Token for login user -JWT
Fetch All Users Controller
Delete User Controller
Fetch User Details Controller
Authentication Logic
User Auth Middleware
User Profile Controller
Update User Profile controller
Update User Password controller
User Auth Middleware Bug Fixed
User Following and Unfollowing
User Following Controller Part
Prevent Duplicate Following a User
Unfollowing User Controller
User Blocking and Unblocking
Blocking User
Unblocking User
Email Sending
How to send Email using SendGrid
User Account Verification
User Account Activation Part 1
User Account Activation Part 2
Forget Password Management
Forget Password Functionality Part 1
Forget Password Functionality Part 2
Forget Password Functionality Part 3
File Upload to Cloudinary
File Upload – Multer Configuration
File Upload – Image Resizing
File upload to Cloudinary
Upload User Profile Photo
Creating Post API
Creating Post Model
Creating Post Controller
Block user if post contains profane words
Upload image when creating a post
Remove saved images from our server after uploaded
Fetch All Post Controller
Fetch All Post and populate the user
Fetch all post created by a user
Fetch a post and populate the user
Number of views of a post
Update Post Controller
Delete Post Controller
Post Likes and Unlikes
Post Likes Controller Part 1
Post Likes Controller Part 2
Dislike Post Controller
Populate Dislikes
Post Comment API
Comment Model
Create Comment Controller
Fetch all comments controller
Fetch a single comment controller
Update comment Controller
Delete Comment Controller
Email Messaging
Email Messaging Model
Create Email Message Controller
Prevent Profane words in Email
Post Category
Create Category Model
Create Category Controller
Fetch All Categories Controller
Fetch Single Category Controller
Update Category Controller
Delete Category Controller
Redux Toolkit Frontend – Optional
What’s Redux toolkit
Install Redux Toolkit
Redux Concept
Create Redux Store – Redux toolkit
Create Action using createAction – Redux toolkit
Create Reducer using createReducer
Dispatch Action using useDispatch
Create Reducer using Map Notation Method
Counter Project using – CreateSlice
Post Project – CreateAsynchThunk
Blog Project – Frontend
Create React App
Install Tailwindcss for styling
90.Tailwindcss intro
91.Home Page Component
React Routing
Users Account -Redux Toolkit
Register Component
Register User Form using Formik
Create Redux Store
User Registration Action
User Registration Reducer (Slices)
Dispatch Action To Register User
Display User Register Loading and Error
User Register Redirect
User Login Form Component
User Login Action Creator
User Login Reducer – (CreateSlice)
Dispatch Action to Login User
User Redirect After Login
Navbar – React Router Dom
Display Navbar base on Login User
Logout User Part 1
Logout User Part 2
Post Managment – Redux-Toolkit
Create Post Category Component
Post Category Action Creator – CreateAction
Post Category Reducer
Post Category Dispatch Action
Fetch All categories
Date Formatter and Loading Component
Delete and Update Category Action
Fetch Category Details Action
Delete and Update Category
Post creating redirect
How to protect Route in React
Create Post Form Component
Create Post action and reducer
Dispatch Action to Create Post
Post Category Dropdown Select
Create Post With Image
Display Post Creating Errors and Redirect
Post List Component
Fetch All Posts
Fetch All categories
Filter Post By Category
Posts Like Action Creator
Dispatch Action To Like Post
Dispatch Action To DisLike Post
Post Details Component
Fetch Post Details
Update Post Component
Update Post Action And Reducer
Dispatch Action To Update Post
Redirect User After Updating Post
Category and Post Error Fixed
Delete Post And Redirect
Only Post Owner can Delete His Post
Post Comment Form
Add Comment To Post
Populate Post Comment
Fetch All Comments Part 1
Fetch All Comments Part 2
Delete Comment
Update Comment
Display User Profile Image
User Profile
User Profile Component
User Profile Action And Reducer
User Profile Part 1
Upload Profile Photo Component
Upload User Profile Photo
Update User Profile Form
Update User Profile Part 1
Update User Profile Redirect
User Follow and UnFollow
User Follow and Following Part 1
User unFollow and UnFollowing Part 1
User unFollow and UnFollowing Part 2
Sending Email
Email Sending Form
Sending Email Action And Reducer
Sending Email Redirect
Account Verification
Account Verification Component
Account Verification API
Account Verification Send Token
Post Category Bug Fixed
Account Verification Loading
User Profile Management Continue
Account Verification
Hide Follow Button Programatically
Redirect To Profile Page
Who View My Profile API
Display Who View My Profile
Implement User Account Type
Users List Component
Fetch All Users Actions
Dispatch Action To Fetch All Users
Block and Unblock User Part 1
Block and Unblock User Part 2
Block and Unblock User Part 3
Application Improvement
Application Improvement
Display Comment Errors
Prevent User From Login if Blocked
Starter Account Can Create Two Posts
User Password Management
Update User Password Form
Update User Password Action
Dispatch Action To Update Password
Password Reset Part 1
Password Reset Part 2
Password Reset Part 3
Deployment – Coming Soon
Frontend Deployment
Backend Deployment