Web Development Zero To Hero, Complete Mern Stack With Redux

Posted By: ELK1nG

Web Development Zero To Hero, Complete Mern Stack With Redux
Published 1/2024
MP4 | Video: h264, 1920x1080 | Audio: AAC, 44.1 KHz
Language: English | Size: 19.72 GB | Duration: 31h 3m

Learn the MERN stack in-depth and complete, nothing is left out! Build a production ready Website!

What you'll learn

Create a backend that is connected to MongoDB Database and start a backend server

Create user authentication with password hashing and a detailed user model with the ability to store cookies

Upload images and video to the cloud and integrate them into our database for later access

Be able to verify emails and send reset emails with hashed tokens just like the big real world websites

Integrate Stripe payments, create checkout window hosted by stripe, manage user subscriptions and update user roles to the database

Get the big picture overview on how a big website backend works and how its all connected

Make requests to our database and update or delete user or product details in real time

Know how to structure and code a solid fullstack website backend

Master Redux toolkit and all of its functionality in a real world excample website

Use your won API that you created and access it from the cloud after deployment

Requirements

Simple knowledge of React and basics of javascript, can be a beginer also, no problem at all, every line of code is excplained

Description

In this course you will not only learn but Master the MERN Stack and all the technologies that go along with it in a fun way that is focused on doing and learning, meaning you will code up with me a production-ready software as a service website and deploy it on the web in the end. This way you will learn how it is done from the beginning to the end not leaving anything out, and I will also explain every single line of code and not leave anything unexplained so that you can build anything you want after finishing this course! So this course is aimed at beginners and also for advanced developers because firstly everything is explained. A total beginner can jump right in and not feel overwhelmed and also an advanced developer can harden his skills with this course because it features a lot of advanced topics, technologies, and blocks of logic that you will not find anywhere else on Udemy or on any other course because this goes in-depth and not just surface level! So with that said I'm excited to see you inside and learn together while building an awesome Fullstasck Website that will impress any employer or developer alike.

Overview

Section 1: Introduction

Lecture 1 Introduction - What you will Learn and Master

Lecture 2 Project Overview and Technologies

Lecture 3 Finished Website

Section 2: Development Enviroment Setup

Lecture 4 Seting Up the web development enviroment

Section 3: Backend Development

Lecture 5 Seting up the project dependencies

Lecture 6 What is a API?

Lecture 7 Connecting to MongoDB, our database

Lecture 8 Create user model and the first user, part 1

Lecture 9 Create user model and first user, part 2

Lecture 10 Finishing the user model

Lecture 11 Creating the products model

Lecture 12 Creating Stripe account, finishing up register logic

Lecture 13 Creating the login logic

Lecture 14 Auth Middleware and fetching user details

Lecture 15 Fetch all users logic

Lecture 16 Stripe - Get all subscriptions

Lecture 17 Update users password logic

Lecture 18 Reset users password logic part 1

Lecture 19 Reset users password logic part 2

Lecture 20 Verify users account part 1

Lecture 21 Verify users account part 2

Lecture 22 Update user details logic

Lecture 23 Save a product logic

Lecture 24 Unsave a product logic

Lecture 25 Create Stripe checkout window

Lecture 26 Stripe subscription update and user role update

Lecture 27 Stripe subscription update after cancel plan

Lecture 28 Stripe subscription update after renew

Lecture 29 How everything is connected

Lecture 30 Creating products controller and first product

Lecture 31 Configure multer and create cloudinary account

Lecture 32 Upload images to cloudinary

Lecture 33 Update, save and unsave products controllers

Lecture 34 Fetch free products controller

Lecture 35 Fetch paid products controller

Lecture 36 Fetch tiktok, facebook and google products

Lecture 37 Fetch single product controller

Lecture 38 Update a product controller

Lecture 39 Delete a product, Delete all and finishing up the backend

Section 4: Redux and Redux-Toolkit In-depth

Lecture 40 What is Redux and Redux Toolkit

Lecture 41 Creating our Redux Toolkit project

Lecture 42 Creating redux store and counter slice

Lecture 43 CreateAsyncThunk and fetching data from API

Section 5: Frontend Web Development

Lecture 44 Creating the react app

Lecture 45 Installing TailwindCSS and importing Google fonts

Lecture 46 Installing the dependencies

Lecture 47 Excplaining the dependencies wee installed

Lecture 48 Creating the Redux store

Lecture 49 Register user and Utilities folder

Lecture 50 Register Component part 1

Lecture 51 Register component part 2

Lecture 52 Login a user

Lecture 53 Login Component part 1

Lecture 54 Login component part 2

Lecture 55 Logout a user

Lecture 56 Fetch user Details

Lecture 57 Save a product / like

Lecture 58 Unsave a product / dislike

Lecture 59 Get subscription prices from stripe

Lecture 60 Send email Action and Controller

Lecture 61 Stripe checkout session/window creation

Lecture 62 Update stripe subscription after successfull payment

Lecture 63 Customer portal window access

Lecture 64 Fetch all users

Lecture 65 Update user password

Lecture 66 Send password reset url to email

Lecture 67 Reset password after clikcing Reset Link

Lecture 68 Send verification url link

Lecture 69 Verify account after clikcing verification link

Lecture 70 Update user field

Lecture 71 Subscription update after cancel

Lecture 72 Subscription update after renewal

Lecture 73 Create products slice and Create product action

Lecture 74 Fetch all products

Lecture 75 Fetch free and paid products

Lecture 76 Fetch tiktok, facebook and google ads products

Lecture 77 Fetch single product and free products

Lecture 78 Update product fields

Lecture 79 Delete single and all products

Lecture 80 Navbar part 1

Lecture 81 Navbar part 2

Lecture 82 Homepage component

Lecture 83 What wee offer component and navbar fix

Lecture 84 Stats component

Lecture 85 Pricing component part 1

Lecture 86 Pricing component part 2

Lecture 87 FAQ, Guarantee, Reviews components

Lecture 88 Footer component

Lecture 89 About page

Lecture 90 Pricing Page and Navbar fix

Lecture 91 Features page

Lecture 92 Contact page

Lecture 93 Free products page

Lecture 94 Free product details page

Lecture 95 Create product page

Lecture 96 Premium product page

Lecture 97 Premium product details page

Lecture 98 Profile page

Lecture 99 Save product page

Lecture 100 Change password

Lecture 101 Reset Password

Lecture 102 Verify account

Lecture 103 Legal Pages

Lecture 104 Stripe success and cancel pages

Section 6: Website Fixes

Lecture 105 Cookie fix and auto logout

Section 7: Deployment

Lecture 106 Deploy the backend on Vercel

Lecture 107 Deploy the frontend on Netlify

Beginer Web Developers,Intermediate Web Developers