 Right so hey guys and welcome back to another video Since I have a request received any requests on the YouTube community page or the discord channel I've decided to progress on to creating a web series now So instead of carrying on with Python we're now moving on to learning web languages Which will help us create websites and stuff so to begin with today We're going to be learning how to create a simple login and register program. I mean a website Which will allow you to register and log in using PHP, HTML and a bit of CSS So to begin with what you want to do is go ahead To your browser and type in XAMP This is a web hosting service that we're going to be using of on our localhost so that we have access to SQL which is our database system that we're going to be using So once you're on it you want to click download Find the correct version for your system download it and install it once you're done installing it I would also suggest getting sublime text because it's one of my favorite text editors So if you do a sublime text download go to sublime text and Download whichever versions the best for you So once you've got sublime text and XAMP all installed and ready What you want to do during the installation process is remember which directory you're installing it to So now that you know which directory you've installed XAMP to you might as well pin it to your Taskbars and now we can go to Directory that we installed XAMP so I've installed it in my Z drive and then once you're inside XAMP You want to look for folder called htdocs and then once you're inside htdocs Here's where you're gonna put all your files to the websites that we create so I'm gonna create a new folder. I'm gonna call this folder Let's say log in and register So Inside the folder all the files are gonna be located where You're using which your websites gonna want basically so what you want to do next is open sublime text Create a new untitled file and then click on save as and Then go back to your htdocs navigate there and then find your folder login and register as mine. I'm gonna call this index Dot PHP All right, so now if we hit save we'll have a blank file. So what we want to do first is type in It's TML and then if you hit enter it's gonna also complete for you Basically, what is done right now is created a structure of the of the HTML code that we're gonna be using throughout So the first bit just tells the browser what type of codes being used which is HTML The second bit is the head section where different codes such as the name of the website the title of the website It's hard to explain right now because I can't give any context But keep in mind that the basic information of the website goes there Certainly not the one that it's the main content being displayed any main content such as the headers or paragraphs or pictures Videos being displayed to the website in the body section and that's that's just the n tag for the HTML So as any tag starts it needs to end as well So just as head has started up here. It's it's been ended right here with like a forward slash So to start with we're gonna give a website a title. We're gonna call it Call it for now. Let's just call it Right So now we know that we've got a title We can actually view the website as we go. So if I if you want to open XAMP and Then you want to click on start for the Apache and start for the mysql Once they're both started it should be green Now you can minimize that and go to Chrome and then what you want to do is type in local host And when you hit enter if it takes you to dashboard that means you've been sold it correctly Everything's working fine and from change and then you take off dashboard and you can type in for me It's going to be Registered login because that was the name of the folder which I created Was it registered? It's login and register. Sorry So whatever you call your folder inside the htdocs you need to type that word in right now The page is showing up as blank obviously because the index.php file is blank The index file is going to be the only file that's always displayed straight away. That's why we call it index and As we see right here the head tag has worked So we've given the website a title that's worked so far now if you want to minimize this and come down to the body section What we're going to do what we're going to be doing first is giving the website a header So we do h1 and we're going to be calling it give it whatever name you like. I'm just going to call it wages calculator for now So let's assume that we have a system that Calculates different wages for the different employees that we have. Let's just assume that for now So further on what we're going to do next is we're going to take the So basically what this line does is basically just displays wage calculator right here Next what we're going to do is start a form. So a form is going to be the element that Basically gathers all the information from the user. So we're going to start the form tag If you want you can hit enter as well, and then it's going to end it for you. So inside the form we're going to say Method equals post because that's the type of method We're going to be using to post the information to the other HD to the PHP script Okay, so once you've done that you want to do different input so input if You enter is going to also complete it for you as well And then the type of input where firstly doing is text So that's going to be for the username and then the name you can just save it as username and then add an extra Entity inside call it placeholder equals So what this would do if we refresh the page now is Create a text field for us, and then it would say please enter your username the The placeholder basically just gives it a text behind and then obviously that text is clear when you enter your own text Obviously right now the website is looking pretty bad because of the style, but we're going to fix that later So now that we've got a username field We're just going to shorten this down to just say username for now because it's too long for the field And then we can create another one of those inputs for the password So input type equals obviously password. It's pretty straightforward. The name is going to be password I'm going to explain what the name does in a second just bear me at me for a moment Do that and now that we've got a username and password if you refresh the page will have two fields So you have username and also the password So once you've got that ready if you want the password to be on the next line All you need to do is open a new tag and do be Forward slash be up basically what does does is says break So it's going to go to the next line All right, so now that we've got a two fields ready What we want to do next is go ahead and create a button that would submit this information so input type equals Submit And the name would be Login Start right So once we've got that you want to just close Well, actually you can give it a value which is going to be the text that is given on the button And then you can say log in Close this one out and then if you go back you should be able to see a button now We do have a login as well right now or if we enter any information and we click login It's just gonna like clear it all up because we haven't assigned anything to it. So Now that we're done with the HTML bit. We've created our form and everything We're going to move on to the PHP script thing. So just start a PHP script just within the body tags You can open a new tag question mark PHP and then we go down question mark close that that's all you need and anything between this will be PHP code So what you want to do first is type in an asset statement. So we do if it's a Is dollar post I'm gonna explain what I'm doing in a second and And then if the post it is the value being posted is log in Start Then what we do is going to be inside here So what I've just gone ahead and done is created a new if statement and what is it does? Oops, what is it does is basically it's listening for different Instances which are going on within the website So I said if an instance happens that something is being posted using the method post obviously and The value or the name is log in start Which is the name of the submit button then we're gonna write the code below So every time the submit button is pressed this statement will get triggered So if you want to display anything to the screen using PHP you have to write echo and then we're gonna say it's session Or we can just say someone pressed The button Every statement in PHP ends with a column So we have to do that and then now if we go and refresh our page Every time we press this button It's gonna say someone press the button and then we also include an else statement. So we say else We can type in echo Button Not pressed yet Okay So if we refresh We're just gonna do this and then It says right now button not pressed because we've just loaded the page and now if we click the button It says someone has pressed a button again. We're gonna Load the page again It says button not pressed log in and then that says someone has pressed a button So that's the basic concept of how a set works So why do we really need this? It's because every time the buttons press we're gonna gather the information that's stored in the username and password And then verify it with our database So what we're gonna do now is Create a new variable. So we do username equals dollar sign post and then The name of the username So the name that we gave to the username text holder was username So we're gonna enter username in here. That was the point of the name And Then we also need to collect the password. So we do password equals dollar post Because we're using post method. Obviously if we use gets method, then we will be using get instead So I didn't do get password and then we need to end these with a colon as well And that now I'm just gonna show you what's what it's gonna do if we do echo Which is like printing in Python use the name dot and then we do End this one echo Password then basically if we save this and refresh the page We do a new username, and then we do a new password Login and as you see right here, it just reveals whatever I've typed in so the code's working so far So it says what username I typed in and what password I typed in so now that we've done this we can Go ahead and verify the information for today's tutorial. I'm not ready. They're gonna link this to a database next tutorial I'm gonna show you how to link it with a database such that you can register and log in But for now, we're just gonna have fixed username and a fixed password. So we say If dollar user name So it's sorry, I forgot we need brackets in here if username equals Admin, let's say typical obviously and you can say and Think I have to put a bracket as well so Bear with me a second so we could do if username equals admin and the Password equals One two three Then what we want to do is We need an extra bracket in here just to hold this all together then what we want to do is echo Login success welcome Admin Else what we're gonna do is just you know echo Use a name or password is incorrect All right, we're just gonna load this. I think there might be some errors So we're gonna start by typing admin one two three And there we go log in success welcome admin now if we log in again Obviously, it's incorrect because we haven't in anything or if I put Joe and Godina in here or Any jibberish of the password login username or password is incorrect now? Let me try using admin one two three and as we see right here It says login successful commandment So what you could also do to make this more interesting for today's tutorial is create a new page I mean a new file and then save that as session dot PHP and then save it in the same directory so Create a new HTML again, and then What I call this whatever you want. I'm gonna call it dashboard Okay, and then we say Just do a P P stands for paragraph welcome Admin So we're gonna close this and Now what we want to do is create a meta tag Basically what that does is I'm just gonna copy and paste it for now so Go here and then what we have here is basically a meta tag Which usually we would put in the header tag but anything inside the echo statement It could even be HTML code. It's right away. Compulse it to the website So what what the meta tag does is it redirects the user to another link and you can set a time limit like a Timer if you like so we can set a timer of three seconds and we can say please Please wait while You are being redirected to your account Okay, so we have a timer of three seconds, so it's gonna sleep for three seconds, and then it's gonna take the user to We're not dashboard dot PHP. We're not going here. So instead of that. We're just gonna type in What was the name again session? Dot PHP that's all you really need so now if you refresh the page It should say login success. Please wait while you're being redirected And in three seconds here. We are we're redirected to the admin account So in here you could have whatever you wanted like a logo button and everything Anyway guys that was it for today's tutorial. Hope I was able to help you guys learn this simple PHP code that will help you create like a login session stay tuned for the next tutorial so make sure to subscribe comment and Turn on the notifications so that you have So that you're able to see the next video where we'll be Linking this code to an actual database so that it's more like a real life login session And I'll see you in the next one. Peace out