Configure Supabase Auth to Allow Users to Login with GitHub

Kristian Freeman: [0:00] In order to begin working with Supabase's authentication library, we need to setup logging in with GitHub. To do that, I'm going to come to the Settings page here and I'm going to check the GitHub enabled field. In order for this to work, we need to create a new GitHub application.

[0:16] If we just follow this link here, we can setup a new Oauth application inside of GitHub. Remember you need to be signed in with GitHub here. I'm signed in a signalnerve. Make sure that you already have a GitHub account setup in order to be able to do this.

[0:30] I'm just going to call this Supabase example and our home page URL here is going to be the URL to our application. Right now, that's just going to be localhost:3000. This will be, as we deploy this application, our real production URL, which we'll come back and change later.

[0:49] The authorization callback URL is actually going to be specific to our Supabase instance. If I come to Settings and then I come to the API here and I copy this URL, this is going to be, this URL/...

[1:06] Our URL here is going to be our Supabase unique ID here inside of the URL/auth/v1/callback. If you come to Supabase.io/docs/guide/auth they have a complete guide here to authentication and you can see that if I scroll down here, it says, "OK. The authorized redirect URI is your project.Supabase.co/auth/v1/callback."

[1:34] Now, if we register the application you can see I get this new page here, Supabase example. There's two things I need to copy here. First is the client ID. I'll just come and paste that in here and then the GitHub secret.

[1:50] We need to generate a new client secret. I'm just going to log in real quick and give it my password. This client secret here which I'll show on the video but I can of course refresh later on, I'll just copy that and also paste that in right here. If I click save, it will persist those into the data base and now, I can sign in with GitHub in my application.

[2:12] Supabase also has built-in email authentication which you don't need to do anything in order to configure. You can turn on the disable sign up toggle here in the disable email confirmation if you don't want to do any email based stuff.

[2:25] For now I want to keep both the email authentication and sign in with GitHub enabled. Both of which are useful for providing the basic sign in here. especially in the context of developers, sign up with GitHub is something that most of us will be able to use.

[2:40] Once you're ready to authenticate inside of our user interface, we'll be able to make use of both the email sign in and the sign in with GitHub here to build out our application...