OAUTH for beginners and Key Terms.
Tags: programming, webdev, javascript, tutorial
Published: 2022-12-09 17:11:42

Are you that guy who does email and password for sign ups! Don't be that guy you don't have to do this anymore.

Because if thats the case then you have to do the following
- Verify Email
- Forgot Password
- Encrypt/Decrypt passwords

Open Authorization helps in retrieving the users information in a secure manner. A password less login is more secure and you don't forget.

OAuth doesn’t give away your password instead uses access tokens to prove an identity.

##Flow of Oauth
![OAUTH Flow](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4y4mwsnqwahf27l8ko8v.png)

1. At you web app (frontend) you have sign up with google, facebook.

2. At your backend you will have a clientId , clientSecret ( provided by the 3rd party a.k.a google , facebook) which generates a sign up url and redirects to it. Now you see your 3rd party screen to log in. You log in.

3. After successful login, a request from 3rd party will be sent to your backend with details of the user.

4. Now you redirect from your backend to frontend with the user details.

## Key Terms
**Client Id** 
A client Id will be the public identification of your app.

**Client Secret**
A secret is used to encrypt/decrypt sensitive data , authorizes app and should be kept hidden in the backend. This should be only used to make requests.

**Redirect URI**
When setting up oauth there will be _Developer Portal_ provided by a 3rd party services. Here only you will get yours Ids and Secrets. Here you have to add a redirect URI that is the 3rd step. The 3rd party will call your api which is provided in this url that contains accessToken and other stuff.

**Access Token**
An access token is used to identify and authorize users. An accessToken will always expire after some amount of time.

**Refresh Token**
This is used to refresh the accessToken. If the accessToken has 1 hr validity then the refresh token may have 24hrs validity. This is used to avoid the frequent log in with 3rd party to get accessTokens.

**State**
If you want a specific information from the 3rd party like **userId** you set the id in the state. whenever the 3rd party calls our backend you will have the id with you in the state. Almost all oauth, we will be using this to pass some ids and references.

**Scope**
When setting up oauth you will be asked for a scope. A scope limits the access to certain parts of user's private data.
For example , 
Google may share your Displayname , Email , phone. But not other details like Date of birth. Scopes provide a way to limit the amount of access that is granted to an access token.

## Why should you use it ?
1. There is no need to maintain usersname/passwords. 
2. No Need to validate emails. 
3. No forgot passward scenarios.

Overall its just makes our login system more easy and secure.
If nothing works for you then you should try **Magic Links* that's for another day.

_Peace 🕊_

---

If you are here it means you may have enjoyed reading this blog. Just follow me @shrihari which will motivate to write more.

You can make a drink [Buttermilk 🥛](https://www.buymeacoffee.com/shriharimohan). Small support comes a long way!

Subscribe If you want to receive these blogs in your mail from @[Medium](https://medium.com/@shriharimohan) for free!

## Try Our new product for free!
[DocsAI](https://docsai.app/) - Create AI support agents with your documents in the most affordable price, starts at **0$**. Don't need a bot , but need ai help on your docs just upload and start chating !

Using for a company ? [Check out our pricing](https://docsai.app/pricing) Just contact me for personalized pricing !

![docsAi](https://firebasestorage.googleapis.com/v0/b/shrihari-personal-storage.appspot.com/o/banner-docs-jpeg.jpeg?alt=media&token=45c47666-de2a-4e02-8881-beb6e43ce581)

##More Free Articles from me
{% embed https://dev.to/shrihari/print-particular-part-of-the-screen-easily-when-using-cmdctrl-p-5c5 %}

{% embed https://dev.to/shrihari/navbar-with-background-blur-aesthetic-look-in-2-lines-of-code--4kp6 %}

{% embed https://dev.to/shrihari/why-array-index-starts-with-0-a-pointers-magic--j53 %}