How Does OAuth 2.0 Work? [with diagrams and examples]
OAuth is an industry-standard authorization protocol that enables applications to obtain limited access to user accounts without giving away any passwords. In this lesson, we'll dive a little deeper explaining what OAuth is and how we intend to use it in our application to help users sign-in with their Google account.
OAuth 2.0#
📖 This lesson's lecture slides can be found - here.
OAuth is an open industry-standard authorization protocol that enables applications to obtain limited access to user accounts without giving away any passwords.
As an example, we've seen sign-in requests like the one below when trying to log-in to an application that allows you to authenticate with a different provider (e.g. Google Sign-In).

In the image above, we're able to successfully sign-in to an application labeled tinyhouse.app with a Google account. As a user signing in, this is essentially where we tell the application "I grant you permission to access my account or a portion of my account". Notice that in this example, Google tells us exactly what information the app will have access to which in this case is the user's name, email address, language preference, and profile picture.
Being able to sign-in with an approach like this (i.e via OAuth) has some major advantages. In the event that an application suffers a breach, our Google password will remain safe because OAuth doesn’t share passwords but instead uses authorization tokens to prove identities. OAuth also allows us to leverage other platforms where users most likely already have accounts created helping avoid the need for users to create new accounts to use a certain application.
OAuth in TinyHouse#
We're going to use Google Sign-In/OAuth to authenticate and sign in users to our TinyHouse application. OAuth between different providers behave similarly to one another. Though implementing Google Sign-In/OAuth differs slightly depending on the application making the request (web server, client app, etc.), they all follow a similar pattern. We'll go through the steps of how Google Sign-In/OAuth will be used in our application.
In our context, OAuth includes the following roles:
This page is a preview of TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part Two