Transcript for:
Comprehensive Django Authentication Guide

in this video I am going to teach you how to build a full authentication system that includes the login the register the log out and the reset password features so this is like a full authentication system that you can add into your jungle project so right now I will just be showing you a demo of how everything works first of all so I'm going to start by signing up as a new user so the name is going to be John or or Jane the first name is going to be Jane and then the last name is going to be do the username is going to be test user the email is going to be uh the proton guy at yahoo.com and then the password is just going to be whatever I specify I'm just going to register with these details right now so we're going to log with the user name and password of that user that we had just created now I want you to not that there are also validation checks so if for example I were to log with the user details I can type the username which is test user but then I can now type in a wrong password so once I type in a wrong password and try to log you can see that we get an error saying invalid login credential so our back end or the code that we're going to be writing is capable of validating the user um details so now I'm just going to log in with the the correct details and then I'm going to f the form and log in with the correct details so once I log in with this correct details you can see that we are being redirected to the um the homepage now I want you to note that the only way we can access this homepage is if we are authenticated so I'm going to show you what I mean so in this in this homepage right now we just have a simple text saying hello world we have a log out so I'm just going to log out now once I log out you see we are being redirected back to the login page if I try accessing the homepage once I try to access the homepage because I am not logged in I get redirected back to the login page so in order to access that homepage I need to actually log so let's say for example we have forgotten the user's password now because of the recet password feature that we are going to be building we are going to be able to reset that user's password I'm just going to click reset password now for the reset password feature what you have to do is you have to enter your email that is associated with that account so let's say I enter a wrong email which does not exist in my database if I click reset password knows that it gives us an error saying no user with that email found so that means that anytime you enter an email here before it sends you a reset before it sends you an email explaining how to reset your password this first of all checks if that email actually exists in our database before sending the email to you so I just actually now enter the correct email of that user so once I click reset password I should get an email telling me that okay so now it says reset sent it says a password link has been sent to your email please note that it expires in 10 minutes so what I will just do is I am I'm going to go back and check my emails so I'm just going to come and refresh so what can you see I can see that the link has been the email has been sent to us and it says reset your password using the link below so I can just come and copy this link I can head back to my other browser open a new tab and paste it so once I paste it it's now asking me to reset my password I'm just going to enter the new password now let's just see for any reason the passwords do not match once I hit reset you can see it shows an error saying passwords do not match so I'm just going to enter the correct passwords now once I hit reset password we are going to be redirected to the login page now once I try to log in with those details I'm going to enter the the username which is test user and then I'll enter the password once I hit submit you will notice that we get redirected back to the homepage so that shows us that we can successfully reset passwords using um reset links which gets sent to our email now I want you to also note that the reset links that get sent can only be used once so let's say I log out and I try to access that reset link again once I click uh enter you see that we get redirected to the reset password page and it says invalid reset ID that is because anytime a reset ID is used once it gets deleted immediately because a reset ID can't be used twice and reset ID is expired in 10 minutes so this is what we're going to be building building basically today so if you want to get the code to this tutorial there's going to be a link in the description which you can use to get all the code from my GitHub repository and I I am also trying to build a community please so please I want you to check the links in the description so you can join my Discord my Discord server you can join my telegram group chat and you could just follow me on LinkedIn and telegram so thank you let's us begin in this video I am going to teach you how to build a full authentication system in Jungle so I'm going to be explaining how to build the login log outs you register and you reset password features now I am going to point out that I I assume you have some basic knowledge of python and jangle and I also wanted to inform you that if you want to get the code for this project there's going to be a link in the description which will take you to a GitHub repository where you can download or view the code so what you see right here is just a read me file which I had created and it's just outlines the steps that we are going to be taking so if you also want to reference this file later on it's Al going to be in the repository so it just has a list of the steps that we are going to be following in order to build this project now the first step is that we need to actually set up the jungle project because obviously we need to set it up now the the first thing is we need to create and enter a desired directory for our project setup now I want you to just create a folder and inside this folder is where you are going to keep your jungle project so I had already created one called Full authentication now I cre this earlier so I want you to also do the same thing now the next step is that we need to create a virtual environment using the pep EMV shell command or any other means so we're going to be creating that virtual environment inside our project folder so I'm just going to open my command line or my command prompt now once I open my command prompt what I need to do is I need to enter the location of where my project folder is I'm going to CD into desktop and then I'll CD into tutorial I'll see the YouTube and then I'll see the uh full authentication now I am currently inside my project folder now the next thing that we need to do is we need to create the virtual environment now if you have your own special way of creating a virtual environment by all means I want you to create it using your way but the way I like to create virtual environments is using the pep EMV library now if you want to follow my way the first thing that I need to do is you need to actually first install this Library so I'm going to run the command pep install pep EnV so once I paste that it's just going to install the pemv command for you but um yeah pmv Library I mean but because I already have it installed you can see it's saying requirement already satisfied let claim my screen now the next step is that we now actually need to create this virtual environment so the way we create virtual environments using the pepv library is we just run the command pip EMV Space Shell so once we run that it's going to create a new virtual environment inside your present working directory and it is going to name that it's going to name the virtual environment in name of your current working directory so just do that and you just wait for it to create virtual environment now as you can see it says successfully created virtual environment and you know that it is activated once you see the name of your present working directory in parenthesis so what is also good about this library is that the moment it creates this virtual environment it automatically activates it for you now I would just like to share more light on how to activate and and deactivate your virtual environment using this library before we proceed now if I would like to exit or deactivate this virtual environment all I have to do is just type exit so once I type exit you can see that we are no longer in Virtual environment but if I would like to reactivate it the first thing I need to do is CD into the location of where that um virtual environment was created or since I'm already inside the folder full authentication where the virtu environment was created I just going to reactivate it again from here and we reactivate it by just running the P EMV shell command so it's just going to reactivate it once I run that you can see it says launching subshell in Virtual environment right so I just wanted to clear that out of the way now the next step is that we need to now install jungle because obviously we are going to be working with the jungle so run command pip install jungle so now that we have jungle installed the next step is that we need to create a jungle project so we're going to call the project authentication project to just head to your terminal that is after installing jungle and run the command jungle dadmin start project and then authentication project so once I run this command when I type di you can see that we already have our project installed um created for us now the next step is that we need to create an application called core so I'm just going to CD into my app folder or with the folder that was created for us and I'll say CD authentication project now once I am inside authentication project what I'm just going to do is I'm going to run python manage.py start app and I'll call the app call because that is what we want to call our app now once I type di I can see the content I can see my projects folder and I can see my app folder as long as they manage P file so now we have created our app and our project folder so the next step is that we need to open our project in whatever code editor that you are using so because I am using visual studio code I am just going to open my project right now in Visual Studio code so I'm going to open my folder where the project is present in and then I will open it with Visual Studio code so once I open it with Visual Studio code I also want to close the old one which had the um which had the read me file and I would like to open the read me file in this new tab so that we can be following it step by step so right now I have opened my visual studio I have opened my project inside my code editor which is Visual Studio code and I can see my manage. pip file I can see the app folder and I can see the project folder so let me just zoom in here so you can see everything now the next step in uh the r me file is that we need to create a template folder and register it in a project settings so I'm going to create a template folder and this is just going to house all our HTML files so I'll create a folder and I'll call it templates now the next step is that we need to register his templates file in the settings to let jangle know that we have a template folder so it can look into those folders for our HTML files so I want you to scroll down to line 57 where you have DS and in quotes just typ in templates now once you type that in just save it and we'll head back to the readme file now the next step is is that we need to register the app in the project settings so because we created an app called called call we need to head to our settings and tell jungle that we created an app called call I'm just going to type in call right here and put a comma so make sure whatever you type in here matches the name of your application in our case we created it and we named it call so after doing that we need to create a separate URLs file for our app and register it in the project URLs so I am going to come to my app folder which is call and I'll create a new file and I'll call it urls.py so urls.py and then I'm just going to write a few inside this file so I'll first of all say from jungle. URLs import path now after importing the path I'm going to say from dot import views so I'm just trying to import path which is an inbuilt uh package or which is inbuilt in jungle and then by saying from dot import views it means I'm just trying to import the views file in this present director in this present folder then I'm going to create the URL patterns list and I will equate this to an empty list for now so I am getting this error because I haven't properly set my python interpreter so I just going to select the correct one which is full authentication so that's the correct one so once I select it uh this eror should disappear as you can see so now the next step is that after uh creating this URLs file we need to register the URLs file inside the jungle URLs file so because we we have created a separate URL inside our app folder now we need to let Jango know that we have created this separate URL file and we can do that by including it inside the project URL file so after saying from Jungle Ur import path I'm just going to also import include now what I'm just going to do is I'm going to say path and I'll just leave it empty and after leaving it empty I'm going to tell jungle to include URLs which are present in core. URLs so it's just going to go into the URLs file inside our call App application and it's going to take note of take note of all the URLs which we create there now the next step is that we need to set up static files in our settings. PI so head to your settings and the first thing that we need to do is before setting up static files we need to import a library known as OS so just type import OS because we need to make use of it now just scroll to where you have uh static file static URL right here and we're going to be replacing it with something else so because we want to set up our jungle projects to ensure that static files get properly displayed static files like your HTML your CSS your CSS files your JavaScript files or your images so I'm just going to replace it with all of these so we we still have static URL defined but we are defining static rout and static files DS so if you are going to be having um if you're going to be having for example uh let's say CSS files JavaScript uh this is going to help us set them up properly now I also want to note that as we progress in this video I'm going to be providing the HTML files that we can use in order to build this um this authentication system but if you have your own front end files you can use your own and there's no issue but I'm but I'm going to be providing you with HTML files and the CSS file so so that we can properly um follow the tutorial now the next step after setting up the static files is that we need to now get the template files from GitHub so there's going to be a link in description of this video where you can actually go and get all these template files but for me I already have them stored somewhere inside this required files directory so there won't be any need for me to actually download them but for you you can just visit the link and if you want to make use of my files you can download the files and make use of it so it's it says download the following HTML template file from GitHub now after downloading all these files what we need to do is that we need to move them to our templates folder because the templates folder is where we're going to be storing all the HTML files needed for this project so I will just copy all the HTML files and once I copy them I am going to go and paste them inside my templates folder I'll just paste them right there now what I can do is I can come back to visual studio code and I can see that all the files are present now the next step is that because I have a static file present I need to create a folder for static files so I'm going to call it static St a I now inside this static file is where I am going to be storing the CSS so I'm just going to go back to where I have my resources and I am going to copy the style CSS file which is needed now again you can get all these files in the GitHub link which I'm going to provide so I'll just go into my static directory of static folder and paste that CSS file so now I can see my CSS file inside the static folder now that we have gotten all the template files from GitHub and we have added them to the project the next step we need to take is that we need to make make required inputs so I want you to head to your views.py file and I want you to copy all of this I want you to type out all of this or copy it head to your views.py file inside your core application now once you've done that just paste all of this inside now I am going to be explaining to you why we need all these inputs but I just want you to um type out all of these or if you're also following my rme file you can just copy all of this and paste it in there so we going to be making use of each and every one of these inputs which we have made here now the next step is that we need to create a super user because we want to be able to access the admin dashboard to actually view the users which have been created in the project so by the end of this project we are going to be able to rate users and login and we need a way to log into the admin dashboard see all the users which have actually been created so head to your terminal and we are going to be creating a new super user run the command python manage.py create super user once you run that it's going to say no search table or user so that is because we have created a new project and we haven't made proper migrations that is because right now no user class currently exists because it's a new project and we first have to migrate all the database tables before this can work so just run the command python manage.py migrate once you run that it's just going to make all of these migrations for us and after it has made all these migrations we can now create a super user I'm going to run python manage.py create super user so once I do that it's going to ask me for a username I'll just type in admin and I'll leave the I'll press enter Because I want to leave the email empty and for password I'll enter the password and enter the password again and it say this password is soci but I don't care I'll just say yes so right now I have created the super user now what we need to do is we now need to log into the admin dashboard with the credentials that we had just created so I am going to run my jungle server in order to log into the admin dashboard so I'm going to do that by running the command python manage.py run server so once I do that it's just going to start the local development server for us I can head to my browser and I can just visit Local Host so once I visit Local Host I can see it says the install worked successfully so I'm going to proceed to log into my admin dashboard I'll go to/ admin and I will log with the details which I had just created or which I had just entered so once I log in I can see that there's nothing here and if I go to the users sorry if I go to the users St you can see that there's just one user which is the super user that I had just created so now we are able to see all the users which exist in our website or database so the next step is that we need to now start creating the required views which we are going to be making use of in order to actually work on this authentication project so we need to first of all create the home view so I will just copy this and head to my views.py file and I am going to paste it so we just creating the home view so this is just what the user is going to see when they visit the home view now after the home view I am going to create two views for the register and the login Pages or login views so I'll come down also and paste it so we basically just have simple views called home register View and login View and they all return a setting they return request and the return um an HTML file using the render uh inbu function which jungle gives us so now we know that we can return these HTML files and these HTML files remember are present in the template directory which we had created and we had gotten these files earlier from the GitHub repository so now that we have created these basic views what we simply need to do next is that we need to map these views to URLs so I'm just going to copy this and since we had already created a URLs do p file inside our application folder I'm just going to paste this right here so what we are simply doing is we're making use of path and we are trying to map each View to a URL so because we want the index or because we want the home view to be the base to be to be the base URL that is when a user visits our URL on the base domain like example doc this is the view that they are going to be taking to we're just going to leave the URL empty and then we mapping it to the the home view that is why we imported views so we can sa views. home in order to um map this URL to a view so we did the same thing for register we mapped this to the register View and give it a name of register and we did the exact same thing with the login View and we give it a name of login so I'm just going to save that when I save that I go back and make sure that my server is running now the next step is that I am just going to head back to my browser and I will go to the Bas URL uh so Local Host sorry P 8,000 so when I go to Local Host P 8,000 you can see it just says hello world and there is a logous button that does nothing so if I head to that file open my templates directory and head to index.html you can see that this is just the HTML file that gets returned to us it says hello world and there is a URL that just says log out but it's currently linked to the log out. HTML file and we are going to see how we can make the Lo the logout functionality work eventually but this is what we get on the landing page right now so the next step according to the read me file is that we need to work on the register view because the first feature that we are going to be building is that we need to build without the register functionality so that we can enable users register on our web app or application now I'm just going to head to the register View and I want you to take note of this register um register HTML file and I'm just going to open it right now inside the code editor now the next step is that it says we need to change the static file the static file the static file links in all files so I will just copy this and I will explain what I mean so all the files are currently linked to the um to to The Styling file all all the HTML files currently have a link tag that links them to the CSS file which just helps in The Styling and this is the CSS file which is present in the style. CSS um file so what we need to do is instead of having this oops let me open my HTML file again what we need to do is that instead of having this uh link we know that this will not work so what we need to do is we need to change it up so to show you that it is not working we can head to the register view right now I'm just going to go to for/ register and you can see that right now it's not able to find the um static file and if I open my terminal if I open my terminal right now you are going to see that there a 44 errow that says it can't find my CSS file so what we need to do is we need to properly link the CSS file in the register HTML file I'm just going to come here I'm going to type in static because I'm trying to link to this static file now because it is inside the static directory I'm just going to say static and then style. CSS I'm going to do that and close off the linking now the last thing I need to do is inside the head tag I'm just going to say load static so once I save that head back to my browser and refresh once I refresh you should see the static file kicking immediately so let's uh see why this is loading slowly so now you can see that this is how the register page looks like you can see the CSS has kicked in and it looks very nice so we're going to be collecting the users's first name last name username email and password so let's head back to our code editor and see what we need to do next so the next step right now says that we need to head to the register. HTML file and give input field a name attribute and add the csrf token to change the login URL and um and change the login URL so the first thing that we need to do is obviously in Jungle anytime we are filling HTML files and anytime we are going to fill an HTML file and send a post request to the back end we need to have csrf token present so as a security feature so we're just going to add that in right now so I put my percent signs and say csrf _ token so CSR CSR stands for cross size request forgery so it's just a security measure that we have to provide in order to make our forms work in post request now the next step is that we need to give the input Fields name attribute so this name attributes are going to serve as a unique identifier and they going to help us grab whatever the user enters in the form and whatever the user enters in the form is going to be mapped to the name as a unique identifier and using the name as a unique identifier we can basically grab what the user has entered in each field so we are going to see how it works now for the input tag I'm going to give it a name a name attribute of for this first one I'm going to give it a name attribute of first name so I'll call this first uncore name which is what we have here I'll call it first uncore name now for the second one I'm also going to give it a name attribute of second name for username I'll give it a name attribute of username for the email I'll give it a name attribute of email for the password I'll give it a name attribute of password now those are all the fields that we need to give name attribute Now using this name attribute again we are going to be able to grab what the user has entered so you're going to see how this is going to work now that we have done all that I am just going to save the file and head back to the read me now the next step is that in the register view we need to check for incoming form submission and grab the user data now because this is a so if I head to the front end right now because this user is going to be filling the form and hitting register all this data is going to be sent as a post request so if I head to the form you can see that the method is post so it basically means that we are going to be sending that data back to our back end or back to our server and because all that data is going to be coming to the register view we need a way of grabbing what the user has in so in the register view we need to check for incoming form submission and grab the user data so I'm just going to come to the view right now and I'm going to write an if statement I'm going to say if request method is equals to post so what we're simply checking for here is that if the incoming request is a post request that is if the user has filled the form and has clicked submit it means that the post the form is going to send a post request along with all the data that the user has entered so that is why we are writing if request on method is equals to post in order to check for if the incoming request is a post request now after checking for the incoming request what we now need to do next is that we need to grab what the user has entered in each inut field now remember that we had given each input field in name attribute so I am going to show you how to grab all the user data using your name attributes so I'm going to create a new variable and I'll call it first name because the first name is the First Data that's the user enters I'm just going to say first name is equals to request. post do get and in here I need to pass in the name attribute so because I gave the first name inut field if a name attribute of first uncore name it means I can just pass that in first uncore name so once I pass in first name python immediately knows that we are trying to grab whatever data the user has entered in this inut field because this imput field has a name attribute of bestore name so I'm going to do the same for second name so I will just copy this and paste it so this is going to be called second name now I do the same for username email and password I'm going to come and paste this three times username email password I'll change this from first name to username and this is also going to be called email and then the last one is going to be be called password so what we have done right here right now is that we have successfully gotten all the user data from this post request or from this form submission now the next step is that we need to actually validate the data provided because anybody can enter any sort of data into our back end and we need to make sure that whatever data has been entered is valid so we are just going to create a flag for an error and I'm going to explain why we are doing this but I want you to just follow with me so this is going to be called user data has error and I'll just copy this here to my views.py file and after collecting all the user details I will create this variable user data has error as a flag so at first it's going to be set to false but when we perform validation on all the input fields or all the impus data if any of them has a specific issue or an error but going to set this flag to true and at the end we're going to make use of this flag to determine what we do if there's an error or if there isn't an error now we need to validate the email and username next we need to make sure that the email and username are not being used by another user you know for example if you go to sign up on like Facebook or another website for example when you try signing up if a user with that specific email or username already exist exist it's going to show you an error saying the username already exists in database and you have to pick another one to use so we going to do something exactly like that so the first thing is that we need to check if the username is already being used so because we had already imported the user class right here from jungle. off models import user we going to be making use of it right now so I'm just going to copy this line and it is an if statement so I'm just going to write an if statement right here and I'm going to say if user. object. filter username is equals to username do exist so what I'm just trying to say is if a user with the username that the current user has entered already exist that is when a user FS this form and they want to register that data is going to be sent to our views so we're just trying to check we're just trying to tell Python and jangle to go through the database and see if that username if a user with that username already exist now if a user with that username already exist we want to set the user data has error flag to true now after setting this to true we want to now generate a new error message which is what which is what we have here now that is why again we imported the messages library from Jungle do contri import messages because we needed we need a way to be able to flash error messages or success messages to the user so I'm just going to create a new error message I'm going to say messages. error and in here I'll first of all pass in request and after passing in request r e u s after passing in request I need to pass in the message which we are actually going to display to the user so the message is just going to be username already exist I'm just going to paste that thing so the error that going to be displayed is username already exist which is going to suggest the user that they need to pick a new username so I am going to do the exact same thing for the email because we want to make sure that only one user can have the one email and no two users can have the same email as well as username so I am going to copy this line and I'll do the exact same thing but for the email so I'll write an if statement here I'll say if userobject filter email is equals to email so I'm trying to say I want you to search through your database and check for any email that matches the email that the user entered so we're just going to say if user object do filter email equals email do exist that is if there's a user with this email that is in the database and we just want to set the user dat dat has error to true now after setting it to true we want to also generate a new error saying email already in use so this is going to help us validate whether the email and the username that user has entered exist in the database or not now the next thing is that we need to validate the password length so we want a case where users can only register with passwords that are more than um five character of length because we don't want any user to register with a password that has three characters and that is totally not safe so I'm going to write another if condition right here which is going to check for the length of the username and it's going to display an error if sorry the length of the password and it's going to display an error if the length of the password is less than five so I'm going to write an if and I'll say if Lan of password is less than five characters then if it is less than five characters I also want to set the user data has error to true if it hasn't been set to True yet from these conditions now after setting this to true I'm just going to generate a new error I'm going to say messages. error and in here I'm going to pass in request now after passing in request the error mess that I want to display to the user is password must be at least five characters so I'll just copy that and paste it here so if the user enters any password Which is less than five characters it's going to set this flag as true and then it's going to generate a new error telling the user that the password cannot be less than five characters now the next step is that we need to create a user if no errors if there are no errors and redirect to the login page else if there are errors we want to redirect the user back to the login page and display the the errors so what that simply means is that if all of these conditions have been checked once all of these conditions have been checked if there is an error this flag is going to tell us if there's an error because it has been said to True from each of the if statement now the next step that we need to take is that we need to check if the user data has any error so I'm going to say if user data has error and if it is true that is if this value is true this if statement is going to run so what exactly do we want to do if the user if the user data has error we just want to redirect the person back to the login page so if we head back to the back to the register page I mean so if we head back to the urls.py file you'll notice that the register um URL has a name of register so what we're just going to do is we are going to make use of the redirect um method imuse method that jungle gives us we're going to make make use of it to redirect a user back to the register page if the user has if if the data that the user entered has errors I'm just going to Simply say return oops return redirect and in here I'm just going to pass in the name of the view that we want to redirect to and that is going to be called register r g i s t e r now I am passing in register here because the name of the of the URL is register so after redirecting back to the register the user is going to Vis see all the errors now I'm going to we are going to be talking about how to write code which is going to or we are going to be writing code which is going to be rendering all these errors out in front them but I want you to just stick with me as we're going to get to that step now if the user data has no error that is if uh the user data user data variable is false we're going to write an else block so we're just going to create a new user once we've determined that there are no errors so I'm just going to create a new variable and I'm going to call it newor user and I'll equate this to user doobs do create do creatore user now what do we need to pass into this creatore user um method we just need to pass in the details which the user had entered so the user had entered the first name second name so actually let's change this to let's rename this to last name because I think that is better I'm going to rename that to last name head back to my register. pi and change this to last name register. HTML I mean so once I've changed all of that to last name we now need to start saving all of these values to the new user so I'm going to say first name is equals to first name so I'm trying to say the first name of this new user is equals to the first name that the user had entered in the post request that came in so the first name that the user entered in the form which got sent as a post request now we're also going to be doing this for last name I'm going to say last name is equals to last name then I'm going to also do the same for email username and password I'll say email is equals to email right email is equals to email and username is equals to username and then finally password is equals to password so this is just going to help us grab all of these user inputs and then after it has grabbed all of those user input and it has performed the validation that we need what we simply are now going to do is if there are no errors that is if um then we checked if user data has error that is if this value is true and it means there is an error so we redirect Bing back to the register page but if that isn't true we're just going to create a new user so after creating that new user what we now simply need to do is we need to create a new message and redirect the back to the login page so I'm just going to come down and paste those right here so what we simply doing here is that if the um user is created successfully we're just going to first of all create a success message by saying messages do success and we pass in request and after passing in request the message that we're going to pass in is account created log now so the user is going to see let me just change this to double quote so the user is going to see this message getting flashed to them account created log now so after we've created this message we just want to redirect to the login page now we're saying return redirect login because the name of the login URL is called login so the user is now going to get redirected to this login view immediately after their account is created so let's just save that file and head back to the read me now the next step is that we need to display incoming messages in register. HTML login. HTML forgot. HTML and reset. HTML Pages this is because we are going to be making use of the messages library to be displaying messages a lot in these files which were listed right here so first of all we're going to be doing this for the register page so I'll just copy all of these and I will explain what it means so head to the register. HTML page and at the top just above um let's see at the top just above the form which is what we have here we are going to paste all of this I'm just going to paste it right here and indent it properly so what we're first of all doing is we are saying if messages that is if any message is coming in that is if any message has been created and the message is coming in what we're just going to do is we're going to Loop through all the messages which might have been created so for example in this case if the user if the username already exists and if the email already exists it means that two error messages would have been created so it's going to have two messages that needs to be displayed what we're doing is we're trying to look through all the messages by saying for message in messages now the next thing that we're doing is we are checking if the message is an error message so we're saying if messages do sorry this is supposed to be if message. tags so we're saying for message in messages if message do tags is equals to error that is if the message is an error message then we just want to Simply display the error out as a message so I saying if messages for messaging messages so we're trying to look through all the messages which have been created then we're checking if the current message is an error message by saying messages. St now that is coming from when we create a new message and we say messages. errow so so the tags now get set as an error anytime we say messages. error so we're just checking if the message is an error message and we want to display it in this H4 tag which has a color of fire break so it's going to get displayed as a red text so whatever message that is getting displayed is going to be displayed as a red text and we have an else block so if the message isn't an error message what we simply want to do is that we just want to display the message but in this case the color is going to be doab blue now I'm just going to copy this right and then I am going to paste it in the other files which were talked about so the register the login I'm going to go to the login page and just above the form I'm going to paste that because we're going to be needing it later and we also need to do that in the forgot password I'll go to the forgot password. HTML and then I'm going to paste that here and then after doing that the last file is the reset password. HTML I'll just come here and also paste it here so now we have all these files having all of this uh having this code right here which is going to help us check for incoming messages so now that we have done this in the register file just save it and we're going to head back to the readme so it says test the code to see if users can register now so we have been writing all of these code things the next thing that we need to do is we now need to actually test to see if it works so I'm going to head to my register page and I'm going to refresh so once I refresh I'm just going to filling these details so for the first name I'm just going to enter John for the last name I'll enter do now for the username I'll just enter John do1 123 and for the email I'll enter John do@ gmail.com and for the password I'll just enter a random password now once I hit register you can see that we have been redirected to the the login page now this is because we had filled all the details correctly when we had uh written all of this code um sorry when we had submitted the form we had filled all the details correctly without any errors and if I go back to my uh my admin dashboard once I refresh you can see that we have a new user which has been created here called John do1 123 so we have the the username set the email set the first name the last name and the staff status so we know that our sign up um our sign up feature right now is working perfectly now let's now test to enter wrong details so let's say for example we are still going to enter J do John do the same username the same email and let's just make sure our password is like less than five characters so once I hit register you can see all the errors that are being displayed to us it says username already exists the email already exists and password must be at least five characters so you can see that using the same details that we had created earlier we got this errors saying the username exist email exist and our password must be at least five characters so right now we are sure that our register view works and all the code that we have written here works perfectly now the next step is that we need to start working on the login view so we need to enable users who have created an account we need to enable them to actually log our platform so that is what we're going to look at next so right now we need to continue working and uh write out the login view so what I'm just going to do first of all is that I going to go to the login endpoint or the login page which serves Lo um which saves our login. HTML file now you can see that right now it has this unstyled um HTML page that is because if we head to the login. HTML file our static file isn't actually linked properly so what we are going to do now is we are just going to link all the static files properly inside all our HTML files so I will come to my admin. HTML file and I will copy this and I'll head to the login. HTML file and replace it with the correct Linkin and I'll do it for all the FES which we have downloaded I'll do this for the foro password page I do it for the password reset page basically all the HTML files which are being linked to this CSS page so the last one is going to be the reset password page now I'm just going to close that now when I head back to the front end and refresh you should see the CSS has already kicked in so it says invalid block tag on line six static did you forget to load this tag that is because we didn't add load static or I didn't add load static at at the beginning or at the top I'm going to come here and type load static so I just loading uh we're trying to say load static so that our static files can be displayed properly using this static specifier here so I'll do the same for all the other files I'll paste it there um the long. HTML I will paste it here too I'll do the same in the password reset page uh in the register already has that and then I'll do it finally in the reset password. HTML page now once I head back and refresh I can see that my CSS has already kicked in now if I head back to my register page just to show you something if I head back to the register page you note that there is a link right here that says already have an account login once I click it you can see it's linked to a login. HTML page so what we need to do is head to the register page and link to the login URL I'm just going to clear out this login. HTML which is there and I'm going to link properly to the login page so I'm going to say URL of login so what we're just simply trying to do here is we are trying to access login URL by using the name login because that is the name of the URL which is connected to the login view so once I do that and refresh my register view if I click the link right now you can see that we are being redirected to the login page so I'm just going to close the register View and the register page and other HTML pages that we don't need for now so I will come to the login. HTML page and also the same I will remove this register. HTML and replace with it replace it with the proper link to the register page so I'll pass in register here r e g i s t e r so once I refresh I should be able to move between the sign up and login pages right now okay so now that we have done that we need to move on to working on the on the login pages so let me head back to my my readme file and we're going to continue following the step so the next step is that we need to head to the login HTML file and give the inut fields a name attribute and add tsrf token so the exact same steps that we took for the register HTML page is what we need to take for the login HTML page also so I'm just going to come down here and add csrf token I'll say csrf token now after doing that we need to give the input Fields a name attribute because this is a name the username input field and users are going to log in using their username and password I'm just going to give this a name attribute of username and I give the password input field the name attribute of password after doing this just save it and let's head back to the file and the next step is that in the login View we need to check for incoming form submission and grab the user data so exactly like what we did in register view we're going to be doing the exact same thing in our login view so just head to your login View and we need to write an if statement which is going to check for an incoming post request because anytime the user fills the login form the data gets sent as a post request because we're trying to send or post data to the back end so I'm going to say if request do method is equals to post then after saying if request method is equals to post we now need to Simply get what the user has entered using the name attributes so we need to get for username and for password I'm just going to head to my views and I'm going to say username is equals to request dopost doget and in here I'm going to pass in username and I'll do the same for password I'm just going to rename this to password so right now at this point we have gotten the users's username and password now the next step is that we need to authenticate the user details so this is where we now actually need to make use of a something that we had imported at the Top If we look at line three here you can see that that from Jango do. we had imported authenticate login and log out so in this view we're going to be making in our login view are going to be making use of authenticate and login which we had imported now there's also something I would like to call your attention to if in your case you created this View and you called it called it login I want you to note that calling this your view login is going to give an error because we had imported this um because we had imported this function or this method called login from jungle. contri so it's going to clash and give errors so make sure that your login view isn't just called login if not it's going to clash with this one that we have imported at the top and to give an error so now that we are we know that we're going to make use of those inputs what we need to do next is that we need to authenticate the user details so we're going to to be using authenticate which we imported at the top so according to the read me file we just need to do that right now I'm going to head over to the post request and in here I'm going to create a new variable and I'll say user is equals to authenticate now what we need to pass into this authenticate is that we need to pass in three items the first is request and after passing in request we need to pass in the username and the password but we going to say username is equals to username and password is equals to password so what jangu is going to do using authenticate is that it's going to take in this username which we had gotten from the user and also going to take in the password which the user had entered and it's going to pass those details to this authenticate now authenticate is going to go through the through the database and check for any user that has this username and after it finds that user is going to check the is going to check and see if the password that has been entered from the post request is going to check if that password matches the real password of the user that has this current username so he just searches database gets a user with the username that was gotten from the post request and it also checks if that user which is which it has gotten has a password which matches what we have gotten from the post request so we just want to authenticate and check if the credentials are um are actually okay now what now happens is that if the credentials are actually okay that is if we're able to authenticate using this username and password meaning that a user exists with this username and password what jangu is going to do is it's going to return that user back to us and it's going to be equated to this variable but if for any reason this details aren't correct it is going to return none back to us that is this authenticate class method this authenticate method I mean or function is going to return back to us none meaning that no user with this details that you have provided here exist so we're going to see how we can do that so now you can see that we have an if statement here which checks if the user is not known that is if a user with this credentials exist we just want to log that user in so let's write the if statement now I'm going to say if user is not not known that is if this user exists in database then we are just going to log the user into um into our our project using the login method which we had imported at the top right here we just going to log user so I'm just going to come here and say login and I'm going to pass in request comma user so I try trying to log in this current user this user that we have gotten from the authenticate um function so after passing in this login what we now simply need to do is we need to redirect Bing back to our homepage because what we are trying to build in this project is that when the user logs in it gets redirected to our homepage which has a name of home so what we're just simply going to do is we're just going to return redirect to the home page so after logging in the user we're going to return redirect and we redirect to the homepage so I'm just going to pass in home just like that now we need to take care of the case where the user is actually known that is if no user with this credentials were found in a database so what we simply need to do in that case is that we're going to generate a new error and redirect the user back to the login page so what I'm just going to do is I'm going to write an else here I'm going to say else that is if and if uh no user actually exists with those credentials I'm going to create a new message I'll say messages. error and I'll pass in request after passing in request I'm going to pass in some me the message the actual message of the error saying invalid login credentials now after um creating this message we want to redirect user back to the login page so so that they can see that error getting displayed in the login page so I'm going to say return redirect and I'm just going to redirect back to the login page so once we head back to our read me file what we now simply need to do next is that we need to restrict access to the home page to only authenticated users so what we want to do is that right now if I go to the home page the hom page right now I can see Hello World getting returned back to us I can see the URL now I want a case where only a logged in user can see my homepage so we need to restrict the homepage to only logged in users and we can do that using this decorator which we had imported earlier so from jangle do. off to decorators import login required so this just helps us enforce that only a logged in user can view our homepage so in order to use it we're just going to call The Decorator at the top of the home view and say at login required so this is going to tell jangle that in order to access this view user has to be logged in or authenticated first now after doing after restricting the user there's something else that we need to pass it or that we need to set we need to set the login URL in the settings.py file because if a user which isn't logged in tries to um if a user that is not logged in tries to access our homepage we want to redirect the person back to the login page directly because we don't want the user to access our homepage now we need to set where the user gets redirected to so that's what the login URL is so what it just basically specifies is that okay if this user is not logged in and our view has login required specified so what it just basically means is that we want to redirect person back or or we want to redirect person to the login page so that is what log login required mainly does so what we need to specify right now is the login URL in the settings.py file and the login URL basically tells jungo where to redirect a user to if a specific view requires them to be logged in and they are not logged in so we need to specify loging URL in our settings.py file so I want you to head to your settings.py file and scroll to the bottom now we are going to create a new variable and call it login URL and we are going to equate it to login so what this basically means right here is that we are trying to tell jungle to R direct an unauthenticated user to this to a URL that has a name of login so when a an an authenticated user that is a user that is not logged in when that user visits our homepage and Jango sees that the user needs to be logged in that user is then going to be redirected back to a URL that has the name of login so Jango is going to come to the settings check for the login URL and see the name is login and it goes to the URLs P file and it checks for a path or a URL that has a name of login and when it finds that URL it's now going to take the person to the view that is associated with that URL and then that is how the user gets redirected to our login view if they need to login first before accessing a specific page so now that we have specified the login URL all we simply have to do is test the code to see if the users can log in so what I will do right now is I will create a new I or I will open my edge browser and I will create a new um account or a new account first but I need to make sure my server is running so I'm going to run python manage.py run server so this is just going to start my local development server for me so when that runs I'm now going to go to the sign up page so if you noticed when I tried visiting the homepage first of all so let me just try visiting the homepage which is B URL when I tried visiting it you can see that we are being redirected back to the login page now that is because we had specified that this homepage requires the user to be logged in when we specified login required it means that this view requires that the user needs to be loged and then they were now redirected to the login page so I'm just going to first of all create a new account so the account name this is going to be called Jan first name is going to be called Jane last name is going to be called do and the username is going to be Jane 123 email is Jan gmail.com and the password is going to be um some random password once I click register right now we are going to be redirected to the login page as you can see we have been redirected to the login page and there is a success message that says account created login now that success message is coming from our login view at this point where we had created a new user we created a new success message saying account created log now which is what you see here and we are told jangle to redirect to the login page so now that we're on the login page we're just going to log in with those details I'm going to say Jane 123 and then I will enter the password so once I do that and click login you are going to notice that we should be taken to the homepage so we have been taken to the homepage because the credentials that we entered were um correct and we can see the login page because um we are authenticated normally like you saw if we are not authenticated we will not be able to see the login page so now when we move on in our readme file you can see that so far we have been able to work on registering a new user we have been able to work on loging in as a new um we have been able to work on loging in as like a user into our platform now what we need to do is we now need to work on the log out view so what if you are logged in and you actually just want to log out of your account now that is why we had this log out Link in the index.html file so if I open it right now my index. HTML file you can see that we have a logout URL that just points to log out. HTML but we are going to be changing that soon so in the read me file it says that we need to create a logout view so I will just come to my uh views.py file so let me close my login and Open my my views.py file so I will I will scroll down and create a new view and I will call it log out view now this is going to take in request now after taking in request all we simply need to do is just log out the user now we we log out the user by using the log out method which we had imported at the top and it is very simple to log out a user all we have to do is just call the log out method and we say log out request and after logging out the user what do we want to do we now want to redirect the user back to our log page after the user has logged in has logged out we need to take the user to Different Page we're just going to redirect the user to the login page so they can log again I'm going to return redirect to the login page now after uh redirecting to the login page or after writing this view we now need to map this View to a URL so I am going to head to my urls.py file and I'll will add a new view and in here it's just going to be log out and I'm going to map it to the log out view by saying views. logout view then I'm going to give this URL a name of log out so this is name equals logout I'm going to save that and after saving it the next step is that we need to head to the login. HTML file and set the correct URL for the logout so I'm going to clear out this log out. HTML and I'm going to pass in the proper URL so I'm going to say URL of log out so what we're simply just doing here is that we're trying to um write in a link which is going to we're trying to type the link for this logout view so it's going to be for SL logout slash so I just basically trying to link to this logout URL so that from that URL the user can be taken to the logout View and then the user can be logged out successfully out of our platform now if we head back to the um code what we just simply have to do is test to see if it works so I'm going to head back to this um my edge browser and refresh so when I refresh let me just refresh again I am going to click the logout URL so once I click the logout URL you can see that we have been redirected back to the login page and if I try to access the homepage if I try to access the homepage you can see now that we are being redirected back to the login page so it shows that we successfully logged out and our log out functionality in our views.py file is working perfectly so basically so far we have been able to talk about the register the sign in and the log out features so moving on we are going to start working on the forgot password section because we said that we're going to write the features that is going to help the user reset their password in in in a situation where they um forgot it for example so what we're simply going to do right now is that uh it says that for step 12 we need to create the forget password model and views so let's just first of all create the following views because we are going to need these views and I will explain why we are creating them so I want you to just copy and paste those views so we have the forgot password view the password reset sense View and the reset password View and they are all returning these HTML files which are present in the template directory or the template folder now remember that this template folder is what we had um we had got these files earlier from the GitHub repository and stored them in this template folder now what we just simply need to do next is that um we're going to head to the um read me file and what we need to do next is that we need to map all of these views to specific URLs so if we look at this Fus password view it's basically just returning the forgot password HTML um page now this uh password reset sense View and this reset password view they are special because they both collect um because they both collect or sorry they both accept a parameter called reset ID now we're going to be making use of this reset ID but in order to make use of this reset ID we need to pass it in through the URL so the so through the URL we're going to pass that reset ID and then we're going to grab it in the view just like this so what I'm just going to do is I'm going to copy this URLs from what I have here so we're just trying to map this view basically to their own URLs so after copying it I'm going to paste those URLs in here so the first URL that we have created is just for the forgot password view which is what we have here forgot password view so we just mapping the URL for go Das password for slash this F now the next URL is password reset sent and we're trying to map that URL to this view password reset sent now if you notice in the URL it is password reset sent slstr reset ID so what we're going to be doing is that anytime we pass this link or anytime we call this link we're going to pass the reset ID into the URL so that we can get that reset ID from The View and make use of it so let me just explain how this reset ID works now when the user tries to reset their password a code is going to be generated for them which is going to be used to reset their password now that code is going to be passed into the link of the reset password is going to be passed into the link of the reset password uh view so what we're now going to do is that that code only lasts for 10 minutes so using that code um we're going to pass it into the URL so when we get it in the view we are now going to check if the time has reached 10 minutes that is if the duration of time where which the code was sent and the current time is greater than 10 minutes and it means that the code has expired so that is why we need to pass in the reset ID so but don't worry you are going to see how this is going to work eventually so after creating this um URLs and mapping them to the view um okay I didn't talk about this last one so the last one is just the reset password View and is the reset password URL which will mapping to the reset password view now these two views again accept the reset ID which we are going to be making use of so let's proceed now the next step is that we need to create a model for the password reset now remember that I said that anytime a user clicks like forgot password and the impus that details a new code is going to be created for them or a reset ID rather is going to be created for them now that reset id id has a time frame of 10 minutes so if it is if the time that the user is trying to reset their password using that reset ID is greater than 10 minutes is going to give an error so we need a way of actually creating this reset ID storing them in database so that when a user tries to reset their password using that reset ID we can now determine whether the um we can determine whether the ID is still valid or not so we going to see how that will work but I just want you to first of all create this model your models.py file so I want you to head to your models.py file inside your app folder and then just paste all of this or type it so what we are simply doing is we are importing the jungle user class and then we are importing uu ID because we want to generate a unique ID each time a user tries to reset their password now we have a class or a model called password reset now this model has three Fields the user that is the user who this reset ID belongs to then the second field is the actual reset ID now this is a uu ID field and by default a new uu id. U id4 ID gets generated by default so anytime a new password research object is created by default this value is going to be set to a uu id4 which is just a unique ID which which is going to get generated and stored by default then we are saying unique equals true and editable equals false because we want each ID to be unique because we don't want two users to have the same reset ID so that is why we're saying unique is true and then we're saying editable is equals to false because this value should not and cannot be editable now we also have a third field called created when now this just helps us create a time stamp of when the ID was created so that we can properly determine when it expires which is 10 which is in 10 minutes because each reset ID should only last for 10 minutes then we have a string method here that just basically helps us return the password reset is for whoever the user is and it shows when the password um the password reset ID was created so after uh creating this mod table what we have to do is now make migrations and migrate so I will just open my terminal right now in vs code and I am going to run python manage.py make migrations we trying to make migrations because we just created new database tables I'm going to say python manage.py make migrations now that is just going to create this it's just going to um say create model password reset now what we now have to do is we need to migrate these changes so that the tables can be saved and created in the database I'm going to say python manage.py migrate now after saying python manage.py migrate it's just going to create those tables in our database so the next step is that we need to now register this model in the admin.py file so that when we come to our admin dashboard we can see that um you can actually see the table or the entries in database so I will head to my admin.py file which is here and then inside this file I going to import that model so I'm going to say fromt models that is I am trying to reference the model file in this current working directory because the admin file and moduls file are in the same folder or in the same directory I can just save from those moduls and I'm going to import password reset so after importing that model I am just going to register it in the admin and then I'll say admin. site admin dosit oops sorry admin dosit register and in here I'm just going to pass in password reset now after passing that in I am just going to save it make sure my server is running and then head back to my dashboard and refresh so once I refresh I can now see the new table being displayed a password reset and it is under the call app so so right now I can see that the tables have been created so the next step that we need to take is that we need to now um work on the forgot password view that is the view that we had just created which is the forgot password View we need to work on it so what I'm going to do is I am going to copy that URL which we created for got- password and I will head to the my other browser and I will visit that URL so when I go to foros password you can see this is how it looks like it's just basically going to ask the user to enter their email which is associated with the account so when the user enters the email what we are going to do is we're going to send them an email that contains um details that will help them reset their password but before we send an email to whatever email does they enter we are going to need to verify that a user with that email actually exists in our database because we don't want to set send a a password reset email to a random email that doesn't exist in our database so we're going to check if that email exists first and if it exists we're going to now send an email to the user telling them that okay this is how you reset your password so we're going to do that right now so just head to the read me file then the step says head to your forgot password. HTML file then add a name attributes to the inut field so what I will just do is I'll first of all close out these files and I'll open my forgot password. HTML then the step says that we need to add a name attributes to the inut field if because we want to be able to grab the email that the user has entered so first of all I'm going to add tsrf token to this form I say I will say csrf token and after doing that I'm just going to add a name attribute here I'm going to call this email now after doing that I will just save the file and come back here then it says add csrf token and change the url so if I go back to the browser you can see that there are two URLs that are for sign up and login so what I'm just going to do is I will scroll down and make sure that these URLs are linked properly so in here I will link properly to the sign up page so it's going to be a URL that links to the register page and for the login this one is going to link properly to the login page so I'm going to say URL of login so that way when we refresh the user can access these Pages by using these links so I'm just going to go back to the reset password page the next step is that we need to now check for an incoming form submission in my in the foros password view that is when the user has filled their email in and submitted the form we need to grab that email so it's what we have been doing before I'll just write a post an if statement here that checks for a post request I'll say if request. method is equals to post and what do we want to do we want to grab the email and say email is equals to request. post do getet and in here I'm just going to pass in email so after passing in email we're just trying to grab the email that user has entered right here now the next step is that we need to um Now set up email settings so that we can send the email actually because you know that I explained that anytime a user enters their email and the details are correct we're going to send them an email message to their email to their email account that and and that meage is going to basically contain an instruction on how to reset their email so right now we need to set up our jungle project to be able to send emails to our users to enable them reset their password so what we need to do is we need to copy all of these settings and then we need to specify them we need to copy all of this code and specify them in our settings.py file so just go to your settings.py file and I will explain what all of these mean when you do that just paste them there so I am going to be sending emails with um my Gmail account so you can decide to do this using a different method but for this method I will be sending emails using my Gmail account so first of all we need to specify the email host to be smtp.gmail.com because I'm trying to send Using a Gmail account and the email Port is going to be 465 and use email use SSL is set to true and email host user what this basically means is what account do you want to use to send this email that is what is going to be the sender account that is going to be sending this email EMS to the recipients which are our users now I'm going to make use of my own email so I'll type it right now now the next thing is email host password so if you are using if you are going to be using um your Gmail account to send these emails just typing in the password to your Gmail account won't work anymore because um the security feature were updated so what you need to do is that you need to generate a Google app password now this app password is what we can now add to our code which is going to enable us use our Google accounts to send this email so if I go back to the read me file you'll see that I post the link here for Gmail users create an app password below so I will just copy this link and go to my browser and I will visit that link in a new page so once I press enter I am going to visit this page because I want to create a new app password so what I need to do first of all is I need to type in the name of the app password which I want to create so I'm just going to call it uh as you can see I had already created a few app passwords before I'm just going to call this one tutorial now once I type the name I'm just going to click create now once you click create a new app password is going to be generated for you and you can just copy it now once you copy it head back to your code go to your settings.py file and where you have email host password just replace what you have here and paste the app password which was generated for you now note that once you copy this and click done you can never see it again so make sure you copy it before clicking done so now that I have copied it I'm just going to click done and I can see that the new app password has been created so you can always delete it anytime you want so now that we have created an App password and we have set up our email settings in order to send emails using our Gmail accounts let's head back to the um let's head back to the rme file now the next step is that we need to verify if the email that user entered is valid that is when I entered this email or when a user enters this email we need to verify on the back end that a user with that email address actually exist in our database because we don't want to send a reset password email to a user who does not exist in our database so what we're going to do is we're going to be using try and accept blocks for that so I just going to come back to my I'll close my settings.py I'll come back to My Views and then I'm going to write a try and accept block we're trying to we are going to try and get a user whose email matches what was entered from the form so we're just going to write a try and except block I'm going to type try and I'm going to say user right so let's just make sure we're following the read me file okay we're going to say user is equals to user doob do getet we're going to say email is equals to email that is we're trying to look through database to get a user whose email matches what was entered in the form so when we get the user we're just going to make use of the details but what if uh no user with this um email exist then we want to try and get the error that will be generated because if we try and get a user with this email if it doesn't exist jungle is going to crash and give an error saying this user does not exist so we can get that error by using an except block so we can say accept user do does not exist that is if the user that we're trying to get does not exist what do we want to do we want to display an error and we want to redirect to the um forgot password page so what I'm just going to do is I'm going to paste what I just copied so if the user does not exist they want to generate a new error saying error no user with email and the email that was entered from the front end no users with that email no user with that email found then we're going to redirect the user back to the recess password page again so this is basically how we can check if that email is valid so I'm going to try and guess the user first of all and if that user does not exist in database it's going to catch the error here and it's going to generate a new error message saying no user wi that email is found and we're going to redirect the user back to the forgot password page where the email where the message is going to be displayed right here so what we just need to do right now is we just need to test this to see if it will work so I'm going to refresh and I'm going to pass in an email that does not exist let me just type in like I don't know an email that does not exist and once I click reset password so you can see that it's now gives me an error an error saying no user with this email found so that means that this user does not exist in our database so that way we are able to prevent users from just spamming random emails and having the reset email getting sent to those emails now the next step is that we now need to actually send the password reset email if the email is valid so what that means is that if a user enters a valid email and a user with that email exists then we need to send a message to that users's email telling them that they can reset your password using the instructions created so what we need to do next is that we need to create a new reset ID so I will just open my models right here now remember that I I explained that when a user wants to create a new when a user wants to reset their password a new reset ID gets created for them and then using that reset ID we can now reset the password for them so what we're just going to do is we're going to create a new reset ID and in the forgot password page so we going to see how this will work so inside the try and except block if we are able to guess the user successfully then what we want to do is we want to create a new reset password um object we are now going to save it so we're only passing in user equals user because again I said that by default the reset ID is going to get created because we said default is equals to UU ID U id4 so by default a new ID is going to get generated and also by default the date time I'm created when is going to get saved also immediately because we specified Auto now add equals true so what that means is that anytime a new object is created the current date time of this the current date time that the object was created is going to automatically get set and saved so that is why the only thing that we need to specify is the user so in the views all we simply going to pass in is password reset and user is equals to the user that we have UT here so we're just going to save that new password reset ID now after saving the password reset ID next thing that we need to do is we now actually need to get the URL which the user has to visit or we need to generate the URL which the user has to visit in order to receive res set their password now we have a view right here called reset password we haven't written the code yet but this view is going to help us or is going to help the user reset the password so it is in this view that we're actually going to be writing the backend logic to help the user reset the password now what we have to do is we now have to generate that URL so that when the user gets the email they can click that URL and they'll be brought to this view where they can reset their password so what we just simply going to do is I am going to copy this and I'm going to explain what it does but just follow with me I will just come back to my views right here and I'm going to paste it so what we are doing right now is we're trying to generate the password reset URL so we are just going to make use of the reverse uh method which again we had imported at the top right right uh here from jungle. URLs import reverse so what we simply just trying to do is that we are trying to generate the um reset password URL so when you want to make use of the reverse function what you have to do is first pass in the URL name so because we're trying to generate the URL for the reset password um view we need the name of that URL which we call reset password so we have specified reset password first but we need to also note that this URL takes in a parameter of reset ID so we need to pass that parameter in and then we're going to say keyword asks we're going to pass it in as a keyword argument and then we're going to specify that reset ID which is the parameter that this URL takes in I'm going to specify that reset ID is equals to new password reset reset ID so the reset ID that we are trying to pass in is the is the reset ID which was generated from here so we're just going to say new password reset. reset ID so it's going to come into this new password reset that we had created and it is going to get the reset ID which was generated by default so that is why we are passing in new password id. reset ID so now that we have generated the URL here we can now properly use URL in the body of our email so let's see how we're going to make use of it so what we now simply need to do is when we need to create a new email body so I will also explain how this works so just copy it with me and or write it out and paste it so we going to say email body is equals to and the F keyword because we want to form the stream so it's going to say reset your password using the link below and we're going to break by three lines and the password that and the URL that we're going to pass in is the actual password reset URL so what the user is going to see is um a text saying reset your password using the link below and um three lines below this text we are going to see the reset password so this way we are able to generate the password reset URL which is going to link to this password reset um reset password View and then we're able to send that URL along with this email body in the email that we are sending to the user whose password they want to reset now the next step that we are going to take is that we just need to uh copy all of this we need to create the message so I will explain what this does so I will just paste it first of all now after we have generated the URL and we have also specified the email body what we now need to do is we now actually need to send that email so we are going to make use of the email message class which we imported from jungle. co.il because this is inbu and it also send emails by default so right now let's let's look at the structure of um this so the first thing that we need to specify is the subject of the email if we're going to be making use of the email message class so the first thing is that we need to specify the subject and the subject is just going to be reset your password in our case now the next thing that we need to specify is the email body that is what do you actually want to send to the recipient what is the content of the email now the next thing that we need to specify is the user that is sending this email so we had imported settings earlier at the top when we said from jungle.com import settings so what we can now do is we can say settings. email host user so when we say that we are just trying to access sorry not that if I go to my settings.py file when we say settings. Emil host user we are just trying to access email host user which we had specified in the settings so we're trying to say that the sender of this email is the email host user which we had specified in the settings P file so right now after specifying the sender of the email what we now need to specify is in a list we need to specify the recipient so in this list we can pass in the number of recipients that we want but we need to pass in the email of whoever is going to receive this uh um email rather so remember that the user had entered your email and at this point we had already done the verification to make sure that the user with that email exist so we just going to pass in email which is what the user entered as the recipient so if I enter like if for example I enter email.com or maybe example at gmail.com in this place uh this entire email is going to be sent to example at gmail.com because I had passed it into this um list now the next step that we need to take is we need to specify email feel silently equals true and email do send so I will explain what this means so let me just paste that right there when I paste it I'm going to explain this now so when we say email message do fail silently equals true so what this basically means is that if in the process of trying to send this email we encounter an error we are just going to fail silently instead of crashing our entire program it's just going to f silently and continue operating as normal without um actually crashing our entire program so after doing that we will just try and send the email by calling email. send now after calling email. send it's just going to send this email to whichever recipient we specify so after doing all of that let's just save the um forgot password um view changes that we had just made now the next step is that we need to work on the password reset sent view so what this view is going to do is that it's just going to show the user or tell the user that the email has been sent to their that the reset password instructions have been sent to their email and that's why the view is called password reset sent so before we actually work on it we just need to make sure that we are redirecting to this view called password reset sent so so I am going to come to my views.py file and after sending the email what we just simply want to do is redirect the person to this View and we see that it's tting a reset ID so when we say return redirect password reset sent we are now going to specify the reset ID and say reset ID and reset ID is going to be equals to new password reset. reset ID because we are trying to pass in the reset ID which was just freshly generated from the modules dop file here so when the user now gets um when the email gets sent we are going to redirect the user to the password reset sense view now this view is basically going to take that reset ID and it's going to check the database to make sure that a reset that a password reset object with this ID which is being pting actually exist so it says guest reset ID and make sure that the ID is valid so I'm just going to copy this right now and I'm going to come to my password reset sent View and I am going to paste it so don't worry you going to see how all of this is going to work but before I proceed I would just like to show you what's the um what's the the password reset sent page looks like so you can see that this is what it should look like it's just going to say reset sent and a password link has been sent to your email please note that it expires in 10 minutes so this is basically how the page looks like so I just wanted to show you guys that now the next step is that we need to check if this reset ID which has been passed into this view if it's if a reset ID actually exist if that reset ID actually exist in database so we're writing if and we're saying if password resets object filter reset ID equals reset id. exist so we are just checking if a password reset object with this reset ID exist in database so after checking for that if it exist we just want to return redirect this HTML view so we're just going to push this into the if statement that is if this reset ID exists and we want to render out this page to the user telling them that an email has been sent with with instructions of how to reset your um password but if it does not exist we just want to generate a new error and redirect the person back to the forgot password page so if for example the person tries to access this page with a reset ID that is invalid then the user is going to get redirected to the for go password page or the forh password URL which is this View and then the error is and and then an error is going to be displayed that says invalid reset ID so what we just need to do now is save that and head back to the read me file so that is basically all we are going to do inside the password reset view we're just going to display that message to the user telling them that an email has been sent and we're going to only display it if the reset ID which is entered is actually valid and exists so else we're just going to tell the user that the reset ID that you entered is invalid meaning that it does not exist and we return them to the foros password now the next thing is that we now actually need to work on the password reset View and this is the final phase of the tutorial we need to work on a path that actually helps the user to reset the password so the read me file says that we need to head to the reset password. HTML file and make sure that we add name attribute and csrf token so I will just head to my reset password HTML file now once I head there I will come to the form and the first thing I'll do is I'm going to add a csrf token so I'll say csrf token and then after saying that I need to give this inut Fields name attribute I'm going to give this a name attribute of password and I'm going to give this one a name attribute of confirm password now once I save that it means that we can grab the user input using this um name attributes so uh after doing that I will just come down here to change this login URL also this is going to be URL of login so after doing that the next step is that we now need to get the reset ID and make sure that it is valid so we want to do the exact same thing that we did in the reset password sense view we first want to check if the reset ID which has been passed in from the URL is valid so before we do anything first of all we need to make sure that reset ID is valid so we're going to be making use of try and accept blocks in this case so I am just going to copy all of this and then I will definitely explain all what it does so just follow with me I'm going to paste that down here so we have a tri block now in this Tri block we are trying to get a password reset object that has the reset ID of what has been passing via the URL so that is exactly what we did here so we're just trying to use the get method instead instead of the fter method so in this case if the get method does not find any password reset object with this reset ID then it's going to give an error saying the password reset object does not exist so that is where the except block comes into play so in the except block we are now going to redirect the person back to the forgot password page and then we're going to display this error message saying invalid reset ID so that means that anytime a user hits this view our jungle project or jungle is jungle or python is going to check um if a if a password reset object with this reset ID actually exist so if it doesn't exist it's going to we're going to catch that error in this except block and we're going to redirect the person back to the forgot password page so the next step that we now need to take is that we need to get the passwords get the passwords from form submit that is after the user has filled this form and hits the submit button then we now need to actually get the um the post request coming in to the um the view so inside this try and accept block I'm going to write an if statement I'm going to say if request if request do method is equals to post that is if it is a post request that is coming into this um into our view so what we now need to do is that we need to actually grab the data that is coming in so because the user is sending the password and confirm password we're just going to be getting those values I'm going to say password is equals to request. post do getet and in here I'm going to pass in password and the next thing is confirm password and it's is going to be equals to request post do getet and in here I'm going to pass in confirm password so right now what we've been able to do is we've been able to get the password and confirm password which the user has entered from the uh HTML file now the next step is that we need to verify these passwords and reset link so verify password and reset link so what we want to do is first of all we want to create a flag as usual because we need to perform some verification on what the user has entered so I'm going to create this variable and call it password have error so at first they are says to false because obviously when the post request is coming in at first no errors have been gotten so the next thing that we now need to do is we need to pass perform some verification so the first thing that we need to check is that we need to make sure that the password and the confirm password field are equal to each other so what that means is that if I go to the reset password page right now to show you how it looks like you'll see that I just entering the first password and a confirmed password so what we want to do is that we want to make sure that both passwords are equal to each other so we're going to write an if statement here that checks if both passwords aren't equal to each other now I wanted you to note also that inside this reset password view it is a reset password. HTML file that we are using which we have seen here so now we're just going to perform this verification and I will just copy it and then I will just paste this right here so I'm just copying and pasting so that I don't have to type all this now let's look at what we have here so we have if password is not equals to confirm password that is if the passwords that user have entered do not match then we're going to set passwords have error to True which is the flag indicating that the password that the user has entered has some kind of error and we're going to create a new error message saying passwords do not match now after doing that the next thing that we need to check for is to make sure that the length of the password is greater than five characters because if you remember when we were working on the register section by scroll up we had to make sure that the length of the password was greater than five if not we wanted to generate an error telling the user that the password length has to be greater than five so we can do just that so I will just copy this and I will paste it right here so let me go to the next line and paste it so what we're just simply saying here is that if the length of the password which has been entered is less than five characters then again we want to set the flag to true so that we can properly determine if there has been an error or not and after that we now want to create a new error telling the user that password must be at least five characters long so this is how we would do just that in order to determine whether the passwords are the same and if the password is greater than five characters or not so the next thing that we now actually need to check is to make sure that the link has not expired so what we want to do is we want to make sure that this rece set ID has not expired now if I go back to my models.py file remember that we we created a field called created when and this field basically just helps us store when the reset the password reset object was created now remember that I said each reset ID or each password reset object should have a lifespan of 10 minutes so what we want to do is that before we allow or before we write code to reset the user password we want to check if the amount of time that um we want to check if um it has been 10 minutes since the reset ID has been sent if it has been over 10 minutes since the reset ID has been sent then we do not want to reset the password using this reset ID because the time has elapsed so we're going to see how to do that so I will just copy this and I will come down to paste it so this is just part of our verification so there is a variable called expiration time and it is equals to reset ID do created when so reset ID is what we are getting from here because we had gotten the reset ID object using we had gotten the password reset object using the reset ID which was passing from the URL so now we have it here in reset ID you know what let's rename this to how password reset ID in order to prevent any clashing between reset ID here and here so I'm just going to rename this to password reset ID so now we're going to say password reset ID does created when so we're trying to get the time and the time and date the date time that this password that this password reset was created so when we get here we're just adding plus time zone do time Delta equals time zone do time Delta of 10 minutes so we getting this time zone from the Imports that we made earlier when we said from jungle. import time zone so when we scroll down what what we're simply trying to do here is that we're trying to add 10 minutes to the time that um the object was created because we want to determine when the object was supposed to expire so when we say password do reset ID do created when do um plus plus time zone time Del of minutes equals 10 by just trying to say okay get the time that this object was created then add 10 minutes to it so that we can know exactly when it was supposed to um expire or exactly when it was meant to expire so now that tells us that we can guess the expiration time in this variable so what do we now want to do next since we have gotten the expiration time what we want to check is that if the current time is greater than the expiration time so obviously it means that the code has expired because if our um if the current time is greater than the time that the code has expired at it means that we can no longer use the code and the code has expired so I'm just going to copy this code and explain how it works I'm going to come down and paste this if statement right here and then we are saying if time zone dot now that is if the current time is greater than expiration time so obviously that means that if the time has elapsed if this code has expired then we just want to set this um this flag also to true so passwords have error is equals to true and the error is reset link has expired so I just trying to tell the user that this reset ID or the reset link has expired because the 10 minutes period has elapsed so I will just um scroll down now the next thing that we need to do is we need to check if there are no errors so if there are no errors it basically means that we can now reset the user password so it means that the passwords match each other the password length is greater than five characters and then the duration for the reset ID hasn't been elapsed and it hasn't passed yet so the ID is still Val valid so what we're just going to do is we're going to write an if statement which is going to check if we don't have any errors so I'm going to come down and after all this verific verification has been done I'm just going to write if not passwords have um sorry not that if not passwords have error that is if the value is not true that is if passwords have error is not true it means that obviously we don't have any errors and it and the errors were set from here so it would be false so that means that if we don't have any errors what we just want to do is we want to reset the passwords so what I'm going to do is I'm going to get the user who's who owns this reset ID I'm going to say user is equals to reset ID do user but instead of saying reset ID I'm going to rename this to password and reset ID ID so what I'm just saying is the password reset ID do user so Jango is going to go into this modu and grab the user that is associated with this reset ID because that is the user whose password we would like to reset now after getting the user here the next step is that we just want to set the new password of the user and we can make use of the set password inbu um method of the class so what we just say is I'm just going to paste that we just say user do set password of the new password which was entered here we're just trying to tell Jango to set the new password of this user to whatever password has been entered and then we just want to save the new user credentials then the next step is that we need to delete the reset ID because what that means is that if the uh user has now successfully reset their password using this reset ID and what we need to do is we need to obviously delete it because we don't want a case where the user has reset their password using a reset ID and then they can now go back and reset their password using the same reset ID so that would be dangerous and we don't want a case like that so what I'll just do is I'll just copy this and I will paste it so after updating the new password I just going to delete the reset ID so after deleting the reset ID the next thing that we're just simply going to do is that we're going to redirect the user back to the login page so after the user has reset their password we're now going to take the user to the login page and tell them okay you have reset your password now what you can do is you can just log so I will come here and paste this I'm going to create a new message saying password reset proceed to login so when they get redirected to the login page they going to see this success message getting displayed right back at them but before we proceed there's something else that we need to do now in the case where the code or the reset id id has expired what we need to do is we need to delete that ID so I'm just going to go to My Views and scroll to the top here so if the time zone dot now is greater than the expiration time we want to set passwords have error equals true and create a new message and after creating this message we just want to delete that reset ID now we are deleting it because it has already expired and there's no point keeping it in database because again it has expired it is of no use no more so that is why we are going to delete it if it has expired now after doing all of this The Next Step that we need to take is that we just need to write an else block so in the else block it just simply means that okay if passwords indeed have an error that is if passwords have error in the else block we just want to redirect the user back to the reset password page so that the errors can be displayed so I'm just going to paste that else block right here so by saying else it simply means that okay if the password have error is true it means that there's obviously an error so we would like to redirect the user back to the same page which is the reset password and we need to pass in the reset ID because again the URL takes in a parameter of reset ID and then that ID gets passed to the reset password view which is what we are getting getting from here so at this point the messages had already been created in the as errors so when they getting redirected back to this view they are going to be seeing the error messages which um we had created earlier so the next step after that is just testing the code and so before testing the code there is one last thing we need to actually do we need to make a few changes now here where we have password uh reset URL we are just going to create create a new variable and we're going to call it um full password reset URL and I'm going to explain why we are doing this so the moment we uh the reason why we are creating a new Full password reset URL is because this line that we have given here will not totally give us the complete URL of this reset password view so we are going to see exactly what we are going to um what we're going to do so when um we run this reverse or when python runs or jungle runs this reverse line right here what it is going to do is it will just go to the URLs and just generates for us only this URL so it's going to be reset password slash whatever ID it is so it is not going to give us the complete URL like the domain which is Local Host colon8 um um Local Host col 8000 for slash reset password forward slash the reset ID so it won't actually do that for us the only thing that is going to return is reset password SL whatever ID that we passing so in order to generate the full ID the full reset URL that is why we need to do this so first of all we're going to use the F string so that we can generate the full URL so what I'm just going to do is I'm first going to pass in request. getor scheme so what this is going to do basically is it's going to return to us what protocol we are using whether it is HTTP or https so it's just going to give us the current scheme either HTTP or htps now we need to we need to do HTTP or https colon slash and what we need to do next is we need to get the domain so I'm going to say request. getor host so what request dog host does is that it will just go to the URL and it is going to get whatever domain is currently saving our jungle project so in this case it is Local Host which is uh running on Port 8,000 so that is what is going to get returned back to us now the next thing that we just need to pass in is the password reset URL so this is how we are going to get the full reset URL it's going to be request or get schem which is going to be HTTP or https and to be colon forward slash and it's going to be the um the Local Host um or the local host or domain name and it's going to be the domain name which is s in our jungle project and in this case it is going to be Local Host and it's now going to be forward slash the reset URL which is going to be generated from this uh reverse call here then all I'm just going to do is in the body instead of passing in password reset URL I'm going to pass in full password reset URL and after doing that that is basically all we need to do in order to test this code so if I go to my admin dashboard there is something I did earlier now remember that we cre or I created a user called Jane one to3 so I went into to the email address and actually put in an email of mine that actually exists because we are going to try and reset the password of J1 23 and we need a valid email address that's to work and I had already logged into that email address from my browser so now we are going to try and reset the password of Jane 123 so I will go back to my browser or where I have um where I signed up as Jan and I'll hit the set password now please note that for the reset password link I want you to go back to your login page and where we have this forgot pass forgot your password we I changed the URL from what it was before which was um this hash and I changed it to the correct URL which was just forgot password I'm going to pass in url and say forgot Das password so when you do this when you do that it's going to properly link to the reset password page so I'm going to click that now the next thing is that we need to pass in the email of the user whose account we want to Res but let's say I pass in a wrong email once I hit reset password you can see that we got we get an error saying no user with this email that was entered can be found so right now let's just enter the correct email now once I hit reset password you see that we are getting an error saying object has no attributes get scheme now we are getting this error because it says Str Str object is not cable so what we're just simply going to do is remove this parentheses here because it is not colable and reset um request scheme returns towards the um the string returns towards a string which is either HTTP or https so now I will just go back and refresh the page and after refreshing the page I'm I'm going to pass in the email again and once I hit reset password we should get sent to the reset password as been sent page so once we hit reset password we just have to wait and see if the email gets sent hopefully so now we can see that we are being taken to the reset sent page and it says a password recent link has been sent to your email please note that it expires in 10 minutes now now if you look as URL you can see that it is reset sent SL the reset ID now the reset ID was dynamically passed in from the URL into the method so that is why we are able to see this page so what we can now do is that we can check the email to see if we actually received it so when I go back to my um to my email what I will do is refresh now once I refresh I can see that the email has already comeing so once I check this email right now I can see that I have this link being returned to us and it says reset your password using the link below so we successfully were able to send the email to the recipient using this uh email address which we specified in our settings.py file and then we were able to successfully Define what message it is so if I scroll to the point where we defined it this was the message research your password using the link below and then we were able to generate the full link which is what we can see here so I will just copy this link to test to see if it actually works and after copying that link I will head back to my other browser and I'm going to paste that link into the browser so now we are being returned back to this page called the reset password page it is now actually on this page that we can reset the password so let's say I enter two passwords that do not match each other I just press enter and once I press enter it says passwords do not match so basically that helps us check if the passwords match or not but let me now enter two passwords that match so I enter the first password and then the confirm password so once I hit reset password hopefully that should reset the password for us and the password has been reset and you can see that we are being redirected to the password reset I we are being redirected to login page and the message of password reset proceed to login has been given back to us and that is coming from this section right here where we said okay after resetting the password um and deleting the reset ID I want you to just create a new message and redirect the person back to the login page so what I'm just going to do is I'm going to try and log in with the credentials so I believe the account is called J 123 and I'm going to log with the new credentials or with the new password so once I hit login hopefully that should work and you can see that we are being redirected back to or we being redirected to the login page because the credentials were successfully um because the credentials were successfully set now if I tried resetting my password again with that link um you can see that we were immediately redirected back to the reset password page because it said invalid reset ID so the moment I even pasted that link what it did was it um it came here to check if that ID actually existed was because we had already deleted the the ID at this point it um caused us to move to the except block because it said the password um password reset objects does not exist so then a message of inval reset ID was generated and we were redirected to the forgot password page so that is why that does not work so that is all we're going to talk about today guys and remember that if you want to get all the code there is going to be a link in the description which will take you to the GitHub repository where I have um uploaded all the code so if you have any question please don't hesitate to leave it in the comment section and I will reply you