FULL Authentication WITH REACT JS NEXT JS TYPESCRIPT

6h 52m 28s
English
Paid

Course description

This is simply the best course on the internet if you want to build and deploy the best authentication system that you can take and use in all of your projects , and i am talking from login, register, forgot and reset password, send emails, from validation, protected routes and more. We will use Next auth mixed with typescript to provide strong typed code while benefiting from Next js server side capabilities.

Read more about the course

Which makes this build really hard to compete with from:

  • We will use tailwind css for styling our application
  • Strong form validation with react-hook-form and zod
  • Strong login system using next auth secure sessions
  • Login with credentials, google, facebook, twitter, github, discord, auth0...
  • Strong register system with validation in frontend and backend
  • Manipulating next auth callbacks for our advantage
  • Sending emails using nodemailer and smtp services including gmail
  • Handling tokens secretly with emails
  • Writing high quality production ready code
  • Learn how work with typescript even as a beginner or someone who never used it
  • Setup Mongodb cluster and Mongodb  connection from our application with typescript
  • Add the users to our database where we handle the accounts while we handle the tokens in cookies using json web tokens
  • Working with next js api
  • Learning about handlebars and use it to replace in our html files
  • Deployment to vercel

Watch Online

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 44 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing

Watch Online FULL Authentication WITH REACT JS NEXT JS TYPESCRIPT

0:00
/
#1: Full Showcase

All Course Lessons (44)

#Lesson TitleDurationAccess
1
Full Showcase Demo
12:08
2
Create next app
06:50
3
Setup tailwind css
04:47
4
Setup Mongodb Atlas Cluster
06:41
5
Connect to the database from our application using typescript
12:35
6
Setup next auth and testing login process with github
13:50
7
Setup Google Provider
09:57
8
Setup Discord Provider
05:04
9
Setup Twitter Provider
04:04
10
Deploy our application and test providers on production mode
13:30
11
Setup Facebook Provider
08:13
12
Setup Auth0 provider
10:45
13
Add user to database when sign in with a provider
08:41
14
Session strategy: database vs jwt
03:54
15
Explaining callbacks and getting the provider name when sign in
10:51
16
Styling the home page part 1
11:14
17
Styling the home page part 2
08:44
18
Protected routes with Next js middlware
09:08
19
Auth page setup and custom input
14:01
20
Finishing custom input styles
05:15
21
React Hook Form setup
12:13
22
Adding zod for validation
05:18
23
Email and phone number inputs and validation
08:38
24
Password and confirm password inputs and validation
05:16
25
Password strength validation
11:54
26
Accept terms and conditions validation
06:43
27
Side submit button
09:01
28
Show and hide password
04:53
29
Adding the background and setup toastify and fixing some issues
10:01
30
Register a user to the database
17:42
31
After submit reset and loader
04:54
32
Setup the template
04:29
33
Setup smtp accounts
05:07
34
SendMail function with nodemailer and handlebars
12:43
35
Sending email test with registeration
12:33
36
Activate account
19:38
37
Sign in provider and switch between forms and backgrounds
17:25
38
Sign in, csrfToken...
12:39
39
Adding our custom providers
14:37
40
Forgot password page and form
06:05
41
Forgot password backend api
06:08
42
Reset password - frontend
07:09
43
Reset password api
05:05
44
Deploy to vercel
12:05

Unlock unlimited learning

Get instant access to all 43 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Discord Clone - Learn MERN Stack with WebRTC and SocketIO

Discord Clone - Learn MERN Stack with WebRTC and SocketIO

Sources: udemy
Learn how to connect MERN Stack with WebRTC and SocketIO. We will go through all of the steps to create application with group call functionality. We will crea
19 hours 29 minutes 29 seconds
Redux Saga

Redux Saga

Sources: pluralsight
Redux Saga is a fast-growing library with over 9,000 stars on GitHub. It lets you rapidly create asynchronous apps using a new tool called ES6 Generators. In th
2 hours 54 minutes 54 seconds
Stripe Payments JavaScript Course

Stripe Payments JavaScript Course

Sources: fireship.io
The Stripe Payments JavaScript Course is a project-based guide to building fullstack payment solutions on the web with Node.js and React. The goal is to provide a solid foundati...
1 hour 29 minutes 26 seconds
The complete React Fullstack course ( 2021 edition )

The complete React Fullstack course ( 2021 edition )

Sources: udemy
Do you want to learn the whole process of building your App ?. This is the course for you. We will start from the very beginning, from "I don't even know how use it..and why wo...
76 hours 58 minutes 6 seconds
Transform Your Craft with TDD: Master clean code and testing

Transform Your Craft with TDD: Master clean code and testing

Sources: Daniel Moka
Do you want to learn TDD but don't know where to start? "Прокачай свой код с TDD" (Enhance Your Code with TDD) is a beginner-friendly e-book and video...
4 hours 7 minutes 36 seconds