First I wanna setup the right links in the layout template.

This is the one that, if you remember are using this for

all of the layout in the site.

I need to import the social account template tag library.

So, import social account and then down here I want to change the login stuff.

So right now there is this login link and there is a signup link.

Now, I don't need both of those because we're going to have one workflow where

you click a button and you're logged in.

So I'm going to delete the sign up one and I'm gonna change this one,

instead of it being url login, it's going to be provider login url for github.

So this tag comes from the social account set of tags.

And I'm also gonna change it so instead of saying login it's gonna say your account.

All right.

I want to do the same thing in index.html.

Might have all these buttons for sign up here and

I want to change these to be provider_login_url 'github' or

at least I'll do the first one you can do all of them if you want.

Actually that would take too long,

so copy that, paste it there,

paste it there, paste it there,

and paste it there.

And I will also need to do the import up here of load social account.

Okay, now if I open up the home page, let me refresh this.

Now that should be load socialaccount,

not import socialaccount.

There we go.

So now I have the signup link, I have the your account link, and

I can see that they are going to the GitHub location.

If I click the link, this asked me if I want to authorize the application and

I'll say authorize, come right back, and I can see that I'm signed up.

So it worked, and now if I look at this I can see that it sent me an email.

So that's pretty cool.

Let's see if it did send an email.

So yep, here is this email, user Kenneth has given

yours is an email address to connect their account to confirm, go to this link.

All right, so if we're gonna send an email with a verification link,

I think that we should require that before they can get into their account,

they have to click that link.

So it's time to do a couple of settings changes.

So I'm gonna again go back to msg settings.

And again, down here at the bottom I'm gonna add a couple of things.

So the first thing I'm gonna add is the setting that is ACCOUNT_EMAIL_REQUIRED and

I am going to set that equal to true.

And what this requires is that they give us their email address when they sign up,

so that when we have the email address which we have to have in order to send

them an email, right?

So then I'm gonna set ACCOUNT_EMAIL_VERIFICATION

equal to true, and

that means that we require the email to be verified before their account is active.

And the last thing I want to add in here is ACCOUNT_LOGIN_ON_EMAIL_CONFIRMATION and

I am going to set that to true as well.

And normally django-allauth sends you the email you click the link saying

that it's you and then you're taken to a page that has you login.

I don't wanna have that second log in pages that seems silly.

So I'm just gonna log the them right away and that's what the setting does.

Okay, so we've added two more steps to the sign up flow.

They have to check their email for the confirmation link.

Then they had to verify that they really did click the link and

these views are already provided by django-allauth but

they used two templates that we need to create to match our style.

So the first thing I need to do is I need to create a new folder inside templates,

that's called account.

That's where the templates exist.

And then I will make a new file inside of account which is, email.confirm.html.

So I'm gonna copy and paste this code in, and

then we will talk about what is going on in here.

So, this is a pretty similar form to a lot of other forms that we used

in Django authentication.

The difference thing is we're loading account and

social account libraries up at the top.

Confirmation is, they get the email confirmation and then they click the link,

they click this link here and this link creates what's called a confirmation.

That confirmation links to the email stuff that was sent out,

which links to the email, and the user, and all this stuff.

So, this is going to show the email address, and

this is going to show the username.

And they're just making sure it's really them.

This is the form where they'll click, yes this is me.

They'll confirm it.

And if the confirmation doesn't get created because it's been too long,

it's expired.

Then we'll see a message that says, the confirmation is expired.

Go click this link to get a new confirmation email.

So pretty straightforward.

You've probably seen this on other sites.

The next one that we need to create is verification_sent.html.

So this one actually comes before the one that we just looked at.

This one is the one that is shown after they've clicked the signup button.

And then we're telling them hey we sent you an email,

you need to go check your email.

So, you can read this if you want, but there's nothing really different here.

It's all just HTML.

So, I wanna try the new sign up process.

Now the first thing I need to do though,

is I need to delete the accounts that are in here.

So I'm gonna come up here to users, and this is the new user.

So I'm gonna go ahead and delete that user.

And yep, I'm sure, go ahead and delete it.

All right, click log out, just in case, okay.

So I don't have my account,

I'm gonna click your account, which takes me to GitHub.

And now you can see that we have a new part here this added permissions,

the personal user data e-mail address, and

that's because of this setting right here, this e-mail required.

That tells django-allauth to tell GitHub we need their email address which asks for

the email address.

Because normally all we get is,

hey this account wants to use your account as login.

So this says hey we're gonna send them the e-mail address as well.

So we're gonna authorize that application,

and then this redirects back to this page where this is our verify your email,

and it says a link's been sent, you need to check that link and and come back.

So if we look here there's a new email.

And it's got a new URL, so I'm gonna copy this URL, copy,

Cmd+C, and then I'm gonna paste this in.

And now I get the confirm email page.

This is the page that we created that has the form that has,

hey is this email address a valid address for you?

So I'm gonna, yeah it is, and cool so

now I've confirmed my email address and I have successfully signed in as me.

Great.

So our log out is working, but I wanna use the django allauth log out.

So it's a little bit different.

So I'm gonna come back over here to layout.html and

I'm gonna find the logout button, which is right here.

And instead of accounts:logout, the one I wanna use as account_logout.

And this is one that's provided by django-allauth.

And it has an interesting side effect.

Let me show you what it does.

So if I click logout, oops sorry,

I have to do that when it's using the new URL not the old one.

All right so now, Let's refresh.

So I'm going to change this to account logout but that goes

to slash accounts slash log which is why when I click that I got the old one.

I can look at my URL's.

I have accounts up here, right.

So we can actually just turn both of these off, and now if

go look at my account and then I go to log out, this is the new page.

This is the page I was talking about as being weird.

It's different.

So django-allauth made a decision to require post requests for

logging someone out.

And, it seems wrong at first but I actually think this is pretty smart.

It prevents someone from putting your logout URL

into say an image tag's source attribute.

And then any user who loaded that image would be logged out, but

the template here needs some love and attention.

So I'm gonna create, yet one more account or one more account template, rather,

which is logout.html.

And again, I'm gonna paste in some code.

And this should not have anything in it that's surprising to you.

It just has a form that says, Log out.

So if they click the button.

They get this, and it will log them out.

So, this looks a lot better, and

if I click this button I should be logged out, and I am.

I get you have signed out.

So that's how to set up social authentication with a GitHub

inside of Django.

Using social authentication with the responsibility of securing your users

account information, at least the basics, onto a service that you don't control.

This has its own pluses and minuses of course.

If that service goes down or

out of business, your users won't be able to log in to your site and

of course if that site's accounts got hacked, yours technically would be too.

Thankfully at least with major services those two problems are fairly rare

which means your users can log in to your site and.

You can concentrate on new features and bug fixes for

your code you could also use django-allauth in-house services too.

If your site or a service on your network provides allauth capabilities,

you can build your own back-end for django-allauth and

use that to do your account verification, it's a really flexible library.