Skip to main content

FULL Authentication WITH REACT JS NEXT JS TYPESCRIPT

6h 52m 28s
English
Paid

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.

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

About the Author: udemy

udemy thumbnail
By connecting students all over the world to the best instructors, Udemy is helping individuals reach their goals and pursue their dreams. Udemy is the leading global marketplace for teaching and learning, connecting millions of students to the skills they need to succeed. Udemy helps organizations of all kinds prepare for the ever-evolving future of work. Our curated collection of top-rated business and technical courses gives companies, governments, and nonprofits the power to develop in-house expertise and satisfy employees’ hunger for learning and development.

Watch Online 44 lessons

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
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