Create a professional website with databases: PHP, HTML, CSS, MYSQL

1. Introduction: Hey, my name is Colleen on it and I've been designing and creating websites since 2015. In today's course, I'll be teaching you how to create a professional website from scratch using PHP, HTML, CSS, and MySQL languages. Creating your own website is an incredible skill to have. Since most information and businesses need them to be successful. Coding is an incredibly fun and exciting. During the class, I'll be guiding you through every small detail and process in an easy to follow it. And by the end of the course, you'll be able to create your own website with no problems at all. Everything you need is a computer in the normal internet connection. Connect with us. 2. Files Preparation: Let's start by adding some BHP documents. Will also have a style sheet, which is in CSS. Obviously. We'll start by telling the program which type of the document we are going to use, which is HTML, our programming language. Let's start by adding your net to our website. Which is mainly the part that's appears up here. That's one of the most important parts of our websites because it's allows the user to basically see how we call it. We can add a title. We'll just call it. Perfect. By the way, we'll already have the link to our style sheets. It's going to be new folder called CSS that we don't mix things up quickly. Css slash style sheets dot CSS, which will appear, appear, and websites. 3. Main Navigation: Now let's start by adding a body to our website, which is going to be the area where we're going to basically create the websites. We can create already a section. It can be a classifying. By the way, in the body. I'm going to create a black websites because I think it will look alert. I'm already using CSS in this code because it is easier so that we access. It's here because of the color of the text, which is going to be white. We'll mix the background color in a minute. This is section. Let's create a knife as well. We can start also by going. Select a few. A few things already changed. The body. Our background color will be black. Margin can be 0 pixels. For now, it's okay. Okay, so now we're going to create an anchor, which is going to refer know we'll puts lush with the colors with a plus. So Flocal, which you'll see, right? You know, minutes. We can go to. We'll have to add a few images here, and I'll be back in a minute. Right now, we're going to add the source of the image. I've already added the images. It's going to be the logo dot PNG. You'll see it's writing minutes. We'll create a Knowles. So that's if it's not uploading, it will appear three dots. Then the width of our image can be maybe a 100 is a little small, maybe two hundred, four hundred forty. Probably. It will be a little bit better. Let's see. I think its way to be probably 100th for around that. Sorry about that. My Google went a little bit crazy, but no, it's back. Okay, so moving on. I was doing something wrong. I guess 200 pixels maybe, well, for 40 pixels. Missing height. Okay. No, it's okay. I think this is still the 100th, maybe the best one. Okay. Yeah, that's fine. What we're creating here is basically a main heading where we're going to have the Home, the About and contact those pages which the user can access. Now we're going to create an unordered list. It's items. One of them will have to be the active because it's going to be different than the other ones. The active here is home. We can create an anchor. For this. It goes to the page itself. When we click, Okay, close the anchor. Okay, perfect. So we'll have to repeat this for four times. Can be one of the another one off, contact us. We'll eliminates the clas active. Because obviously only one can be the active one. I think this one is quite good. That's what we want. We can have the new fonts to all the websites. Let's see which one is nice. I've already used the one called lotto. It's this one. Yeah. This one is quite nice. I think it will work. It creates for imports and we're going to add it to our style sheets. Can be on the beginning. Perfect. Also. Other few things here in the body. One can be 0 sizing. We can set it to border box, which is going to round the box itself that we have our phones selected. We can start working with our first anchors. All the anchors. They can be like this. Note the decoration. None. Then, you know, or at least the least style. So basically the thoughts themselves. Much better. We'll work with our navigation basically. Right here. Navigation. Sorry. Nef will have these playoff flicks. It is inline, not how it is right now. Our, all of our items are followed up by the others. You can set it to space around. And don't worry if this is too much. If there are too much expressions and cold from the CSS because I know it can be quite tricky in the beginning. But as you are used to writing, it will become easier. Will align our items in the center. That's it. Probably. We can just change it to little bits on the left top so they can align better. I think it's the same boots anyway. Width will be 100%, so that's it changes accordingly to our changes accordingly to our total window and that's, it becomes cell phone friendly. This index can be, one. Can build, will change our Northern released in. Don't forget that these ones are for the anchor and the unordered lists as a whole. So all of them will be affected. And this one is our least from the navigation parts. We'll do a flip, so that's they become o k. So we'll have to change this as well. Inside our unordered list. It's, we will select the items. The anchors of the items can be 35 pixels, margin pixels. Maybe. Maybe the height is going to be a little bigger. Kids can be 0 pixels and ten pixels, which is going to be the 0 pixels is going to be the height and width in pixels is going to be the width. Yeah, that's it. Okay, so now we're going to change the line heights to vote 40 pixels. That's better. Then the display, it's going to be flipped as well. Change this a little bit. We can change the font size to 0.9. I think that's going to be well. It's going to fit the text transform. We're going for me. We're going to put it to an uppercase. So that's, that's all it takes is going to be the width of our phone is going to be maybe 500. I think it's going to fit well. The border videos, probably three pixels bolted color. We can put it put it like this. I think. I think so. It's been nice. Then let's change the border radius to pixels. Border radius when we insert 33 values, it's going to basically be the first one is going to be for the apart. The second one is going to be for the right part pixels. The third one is going to be for the bottom, and the last one is going to be for the left. Let's see how it stays. It's quite a bit. Okay. Let's see what's wrong here. It was because of the width. Yeah. It should be on 100% obviously. Yeah. I was a little bit destructive. Sorry for that. Now, what do you, what do we want to do is when the user goes with their mouse over these features and these titles, the text changes a little bit. So what we're going to do is physically, now it's the same thing as above, but now with the avert tag, which is for when the mouse is above our elements. The background color. We can set it later. It can be something. Then the color, I think yellow will be fine. We'll have the little shadow, which can be five pixels, ten pixels, probably 30. Yeah. Then for the goals we can I don't know, somebody's background color. We can set it to probably a blue, bright blue and not really infeasible. Think it's still too sharp. Maybe at least a little bit more transparent. I think the color is too strong, so we'll just choose this one. Going to be really, really almost transparent. Something really small. Maybe 505. No heat source as it is, I think it's fine right here. Let's go back to our index.php. Let's also change this. We're going to have to create a new node. We're going to have to create new files. Futures, dot PHP. Site. Features, voltage, contacts, contact, speech, be perfect. We'll come back to those later. 4. Home Page: But for now, it is fine. Okay, So now we'll create a new division, which is going to be the main part. Yeah. We'll create a heading. We can create our websites because we are a team. Or websites. That actually sounded nice. Okay. We'll create a new paragraph. We can create a lot of them. And it's going to create subparagraph for us with 14 characters. We can add some features on here. And then you've section, which we'll call features. Let's create the division called features container. We'll have here. Our features, our books of features. Checkbox will create a division for the image and one for the elements for the image and one foot. Thanks. Okay, perfect. Okay, so we're going to image source. I think the image here already. I will also link the images I use on the project file. You can use it if you want. We'll create olds. That's above right here. If the image doesn't, upload, already takes a longer time to upload, it will appear PC, so that the users can know. We can use the style 12 sold. Heights can be 100%. Now regarding the texts, we can create NH4, basically saying, I don't know, Website parentheses. Part of graph. We'll also create lot of them. No, simple. Then going to create an anchor, which is going to refer. Then the class is going to be, we'll have a thick check. If you want, you can refer it to some other page you may have, which is going to be nice. Okay. Let's see how it goes. Okay? It is quite bad, but we'll solve it in a minute. We'll just copy and paste these feature box. Volts. Three times. Will have to go to the style sheets. Basically to fix it. Can put dot features or background-color. Going to be width is going to be 100 pixels. So that's, it is, sorry, it's not pixels, Let's percentage so that it is easily adjustable, especially in our cell phones. Which is basically one of the main things are these. And it's really important, especially in web designing. Border box as well as above will be flux so that they are all in line. Justify content's going to be on the center. Will also align the items on-center. Afflicts direction is going to be on column. They are on column. Then March. And so it is important. It has to be 100 pixels. Let's say No. We'll have to go to our feature boxes. Sure. I'll do that towards the future. Gearboxes. Firstly, features container. A container is going to be flicks, continents to be on the center as well. The line items. Then the feature feature books, backgrounds can be different. It can be parents so that we don't see it. The width is going to be 200 pixels. Maybe it's going to be small. Let's see. Four hundred, three hundred and fifty pixels. Then the margin can be 20 pixels for the radius. So that's it gets rounded pixels. The overflow can be haven. That's helps. Position relative position. Then the bulks shallow. Going to be yelled. No. I think it's going to it's getting a little bit of appearance, but size, definitely not working. I think sides here can be bigger. The GSR really touched. Okay, so let's try to change our image, which is pretty much, Let's change it a little bit. Feet, the width is okay. What's our height needs to be less, a lot less. 63%. Think that will work. I think it's because of this. Once again, I put pixels instead of percentage. Hallelujah. No, it's it's acceptable, at least. We will have to change as well. The texts. The width is going to be 100%. The heights. Lot less because it's way too below. Display is going to be flicks. If I go into the center, then align items as well on the center. The flex direction is going to be a column. And then we want the color of vortex, we'll whites. Let's see how it stays. Okay, that's nice. But I think we can change the heading as well little bit so it's better. Thanks for the marching, the top. Be pixels. I think it's it better this way. It's more close to the image. Then the, the anchor of the text is white. Port all the images. For all the texts. The background color needs to be doesn't need to be that way. We can change it. Maybe 1705. Okay, sorry about that. The color can be like maybe not. But let's keep on with this. Little changes to later. Their boats. Then the four boxes can be big souls for five pixels. Margin can be ten pixels for pixels as well. Then the phone can be both. That's sniff, definitely better. Then we go. Let's go. There is a hover as we already did. If they user goes with their mouse over here. What happens is the color is going to change to yellow. Let's see. Each centering the little bits. We don't want it to be like super tangible, but I think it's clean this way. Okay, So note that this is done. We'll just tie that image to the top part of our websites. So that is going to be pretty simple. We're going to have two section style that we can edit. Little bit of force style. Though. Probably Elder like this. Let's put the width 100%. Our heights is going to be constants and it's going to be 980 pixels position. It's going to be relative. Now we're going to add the background image. We're going to bet it from the URL. Then going to be the background dots. Jpg. Bring that background. Size equals covert. Just one more thing. I think it is quite nice like this. We should also color white. Maybe we should add this one here. Let's see if it works much better. We want to make the text from the main parts also much better. Then come over here. We'll just go to the bottom. I forgot. Okay, just quite nice. The active will have to play with the active, with the cluster active. So the one that's the page that we are in is going to behave differently from the other. One's going to be different. It's going to have the coal are already the yellow. That that's enough to make a difference. Not sure why this isn't happening, but we'll shake it later. The course. Okay, So no will help. So we'll have to change this text a little bit. Parts. Okay? Color. The color is already a white. The width to be 500 pixels. Both decks. Okay? The position to be absolute. We want to put it a little bit more in the center. So if input lift it's about 15%. We'll also want it to be a little bit more. So probably about 50% gets quite nice like this. Maybe a little bit more up. Yeah. Probably 47. Yeah. I think that's nice. And probably the active parts. Yeah, it's perfect. Now, we're going to transform. Let's do a translation of about 15% 47 we did above. So now, that's nice. That's what we're going to change the ending from here. The font size. We can change. It can be about 55 pixels. Can be a yellow. A yellow, white, sorry about that. Maybe 50 pixels. That it isn't it isn't too big. So same thing with a paragraph. Going to change the color. I usually put this color. Quite nice. It's not so whites. In the width. We can, what about for hundreds? Big souls? So that it doesn't appear part because of the white parts. Now, we can create a little button here that can bring us to the features. So we will write something like, let's starts. We can create the cluster main button. Going to refer to our Features page. It's going to be starting out. Will want to change it. We can put a background color. Oh, for yellow so that the box is yellow. Then the box sizing can be a border-box. That it is round. For the color. For text, it can be 1 third 38138 months. I think that will serve. Maybe it doesn't notice. Let's just go with the black. So now we're going to have the padding so that it isn't so small. 1020, I think that will be fine. Then the margin going to be ten pixels and it can be five pixels. Maybe a little bit more. I'll lethal do two more here. Maybe bull. Well, I think that's okay. And the transition, it is a little smoother. Can be 0.6 seconds. We'll do the same, but d over, which already covered on previous classes. Our background color, oops, sorry about that. Background color will be yellow as well. So we don't need really to write it. Sorry. It will just change the color. I think the one that I put before the 130 eighths, I think it will be better. Probably. Because it's not something that's just like that. Let's see. That's probably a little bit bliss point for Yep, That's nice. I think it's definitely will have to add another division. Let's just go here. And another section, which glass can call it contact. The division is going to be contact heading. Okay? So basically this division is going to be for the user to be able to contact and basically sent us a message. Will also have to create a new, a new file. I think I'm going to call it user information. Which beat. We'll work on it later. So basically, we'll just have to create an heading. Contact me. Then paragraph, which can be Let's put just motor DC standing. Then let's just do the form. Action, user information dot PHP. Then we'll also have to put the meter. Method will just need boots. The name is going to be user, the lease holder. It's going to be your full name. And it'll just copied. One more thing. This one is the email. Email. Then your e-mail. That's clean. Know we're going to put the text area. The name is going to be message. I don't think it needs IV nor cones are roads. Now the placeholder going to be type your message. No, we just have to create a button. The button content type is going to be submit. And tricks continue. Okay, perfect. I think that's quite nice. Let's just see. We'll just have to style it a bit so that it isn't this way. Just go down here, contacts. The width is going to be 100% percent. Sheesh, sorry about that. The heights can be about a 100 box sizing. Going to be one of the roles that these plays are going to be flex. We wish. Justify contents on the center will also have to align the items on the center. The flex direction. And this is important. It's going to be on the column. The margin to the top. You can put it on fixed false negative. Now let's go to the contact heading, which I think Scholar is. Luck. So the color needs to be white. Also have to align it to the center. Let's see. That's quite nice. Then looking for the margin, 40 pixels and 0 pixels. Then a merchant to the bottom as well. That it isn't too attached. Two pixels. I think that's nice. Contact heading. We're going to be changing the heading itself. Center line, center line. Then the font size. I think we can change it to point, to definitely read or I think the cartography is okay, so let's just go to the form itself. Width is going to be 600 pixels is okay. These blade to be flipped will align items on the center and justify-content center as well. Let's see how it is. We'll have to make them on a column. So flex direction is going to be also have to change the inputs and also the text area. Contact form inputs. That takes area. Going to have a width of 100 pixel percent, sorry, about 35 pixels. For the margin. 05 pixels and 0 pixels. Fine. Yeah. I think five years. Okay. Then we need to have the plotting both pixels. Pixels. We don't want it to be too big nor too small. So let's just see. I think it's still big this way. Maybe eight is better. Okay. Next thing is the border-radius. Only 55 pixels so that it is a little better. Okay? Now let's just add text area. Let's just change the height a little bit. Give it to 50. Maybe 13. I think that's nice. So that's contacts. For our button. We can put the background color from yellow, as we did previously. Let's just see a whole we stays, but we will have to change it. Yeah, it's too small, too close to the above part. So 20 pixels and 0 pixels for the margin. The heights. I think the heights can be about 35 pixels, will be fine. The width, maybe 80 pixels. Let's see. I think it's an export them like this. Then the weight for a bolt. Let's do the same thing but for the Hubbard. Sorry. Okay. We'll change the color a little bit for 138 as we did above. That's it. Yeah. I think that's a nice maybe. It's a little too short. Maybe we should have another section here. That theories in social worlds are the websites before the contact me. Probably we can create like an We already have theory, the about page, but we can create some About section here, a little about section. I think so. We'll just go ahead and creates, created section. Let's create a division for the image. Image source is going to be going to be it. If it doesn't appear. That's clean. Then another division for the text so it sticks. Create a heading saying, can we see this website? And then we can create an anchor point. If they wanted to check. If they won't check more about it's going to be for the beach. Equals. Then we can put a class of button as well. Checkmark. Check only trick you. I think that's nice. Let's tell it a bit so that it isn't simple. The height needs to be bigger. Box-sizing, border-box. We usually do. Though these play also on flags. Will also have to align items on the center. Justify contents. We can put a space between. It will be nice. And then for the budding, we can put 50 pixels, percents, 0 pixels and another 5%. Then the position relative. Let's see no more space. I think that's important. Text needs to be better. For the image. We can change the width little totaled 50%. Maybe not. I don't know. Let's change this. Let's write the change theme, which itself. Let's change its width, four or five pixels. Or maybe 50%. Maybe. I think 100, these a little bit too much. So 85. We'll do that. We'll do let's change the text. We don't need the background color, so the width is going to be 45%. We're going to align the text, right? I think I will be able to, yeah, I think I will be able to change the width. Here. Instead of 85%, we can return to the initial 500 pixels. Maybe too much. Yeah, I think that's nice. Maybe we should have a little bit more cortex, but let just see. Laura. 20. Yeah, that's better. Okay. I think it also depends on how much sex you want to write here. Let's change also the heading. It. We can change the font size to the foam weight to about 600. That's fine. Then the thicks thrust form. I'm not sure if uppercase will do, but let's see. No, I think it is, it is okay with the lowercase. I see. I think we'd good change the button. Button. Is the main button. I don't think we changed the main button yet. Okay, So let's just change the menu button. Color. Maybe locked the background color. Let's change the filing as well. I think it can be maybe ten pixels pixels and maybe 30 pixels. Margin to be 0. Pixels will do 00. Maybe 20. It isn't. Maybe 15. Now what we want to do with bold, Let's just do the hover parts. The color can be RGB. This one. Perfect. Okay. Yeah, I think they index.php is almost done. We'll just have to add what's happened here. I don't get it. Maybe I changed the main button. Let's see. I think we can change it. Can be. Okay. That's nice. We'll just have to go up and handing to our websites so that we can add the copyright section and all that's that you wish to use. So let's create a section that's called the vision. And then paragraph. You can put. For example, from the same creators. Then you'll create division for the image. And then I'm going to use this image is going to be well, then it's going to be cold. I think I will know. Okay. Yeah, we'll just use this image. It's quite bad, but no problem. Then we can copyrights. Then they'll just for the copyright symbol 2022, Then you can put your name. We will have to change it alone. Let's go to ending. The width is going to be 100%, obviously. Going to align in the center. We've been told line items also on the center. Let's go to the first division for ending. And can change the background color. So it is different from the normal polar. We can put about 61. I think it will do. The height is going to be 100 pixels. Let's just see little bits. The formulae justify-content center. Now we're going to be 100%. Okay, so that's a for our for our copyrights. Text-align center. Just like Entente on center. Then the width can be about 200 pixels. Little bit small. That's what do we want? We can change it a little bit later, later on, so we're going to go to the attending the second division. Then we can change these fluids. So that's our items are a little bit closer. That's not what we wanted, but we'll send the height and the width of our image. For the width, we can put like 128 big schools. And for the height. So we can put 72 pixels, which is universal resolution. Then for the further radius, weekend puts about 15 pixels. For our image. I think it's quite nice like this. And our text is also pretty nice. So I'm not sure if the fix should be white or black, but they think probably, I think white is better. Okay. So our first page is done. Now let's go to the other ones. 5. Features Page: Okay guys, so now that our main page is done and finished, we'll have to go to the other ones. No, it's the easy parts list. Minutes. We need HTML. Here. Will open features contact and about P&G. Place it. Okay, so now if we click on this one's still not changing way wasted. We need to change you. Going to be features, evolves and contacts. Perfect. Let's see if it works now. We'll also have to change the one that's active. So that's our color is going to change to this one if we are on that page. So just go with this and paste it on the Volts. Let's do the same thing with the other ones. Contact. Then in the features. That's cool about okay. Now we have to change here as well. Sorry, sorry about that. Last one. Let's see, fit works now. It's cool. Okay, so I think we'll have to change this part a little bit. We'll just go in features for sleep in order. We can delete the text. Probably. This one as well. Sorry. We'll delete will delete this part, which is the main part which appears here. Let's see how it looks like. Okay? And probably the the background, we can change it as well. Let's just change the background. I think it's yeah, it's not bad. But we could probably leave the text from here, which is right here. This division. I think we can leave it and rename it off. Probably features the texts will leave it as it is. And we can say something like the button can disappear. We can write something like welcome, welcome to features. You want to add some database or something you would like to announce on your websites, such as the features of your website or the features of your company or work. You can add them right below here. We'll just delete the contact heading. The form section. Can dilute it. The below parts. We'll leave it in all the pages. You can leave the features here and let us know. I think you can add a little bit more more features. Let's just copy this one. Duplicate it. For the about the websites. You cannot the features as you want. What do we do? You can change the image. Just that this Transform and Scale looks last one. And it's going to rotate if you wish. I think we can leave it this way. Let's move on to the this one needs quite a bit. This section. I don't think it fits. Later on, on our course, we'll learn how to, how to add the databases. So let's go to the next page, which is the about. In this part we can. 6. About Page: So let's just use this part which is already used. So that's all the pages are the same on the beginning. But I think I think we can decrease the size, the height. 400. Can't delete the background. Maybe not 400, maybe 600. I think that's better. Let's just put About Us. Be about us. We'll just delete these photon. You'll want to write something about mu or your company. Let's also deletes the features section. We can create a new section. Let's just use this one. It's not going to write our for our clients. Then you can write the texts as you wish. You can talk about how you care about your clients and all the things you do and the positive things. Let's just copy this. Let's just copy this section as a whole. Will once three sections. The first one is the care for our clients. Developments. Throughout the years. You can write whatever you want. Can be how your company is developing and improving their services. Then we can put our mission as a society or a husband organization. Will want to have new images here. We will also want to have a background on the Ableton. Okay, so now that I got the images which replace them. By the way, if you want, although images I am going to use, you can have them on the project description if you'd like. Let's just add a background image to be. I forgot the URL. Sorry about that. It should be working by now. It is quite bad. So probably we won't use a background. I think it's better this way. You'll write the About Us topic. I think we can change the images here to a little bit. In the first one, we can use the first picture of a woman that I have. It's own one dot PNG. Maybe it's not the best image, but it just for aesthetic signs for our course. We'll just put a woman. Then the next one, be the one to me. It's okay. And then the last one we can leave it with our monitor will just deletes the form that we have here. Whole section. That's clean, I think. Yeah. 7. Contact Page: Okay, so let's go to the final one which is the contact has this one. We can elites the part or we can just, I think we can use this one and put contact. Contact. Contact now. And then we'll just put it for our forms which is below contact. These features, we can delete them. Then we're going to leave their contact heading. And probably some semi-formal about where we are. And I think we can leave the same image background as we lift on the homepage. We can put what are we from? Then you can put whatever you are from. I'll just put my home country, which is Portugal. Then you can put the city. Then you can put where. Then you can just Google Maps, go to some location where you are at. So I'm just going to put a known street from my, my city, which is this one. Then we can just base our link. Here. Will want to, we'll want our process to open it in a new tab. So we'll just put targets. Then. Little line like this. We open this up in a new page, which is quite cool. We will write here. The image is going to be okay, so that's clean. Let's just leave the contacts and they will be able to contact us. In an easy. I think our pages are quite completed. And let's just put contact us here as well. 8. Server Logic: We can close these ones. This one as well. And let's just use one of the user information dot PHP. Okay guys, let's go to the user information dot PHP, which is basically going to be our server connector to our database and all of that. Before we go into this, let's just go to our local host. Local hosts dot PHP, my admin. I've already created a new database, but if you want to create a new one, you just click here and it's pretty simple. My knees website data. I've already created a table called userinfo data. Now it's pretty simple. The code. I'm going to write some PHP. Think that's basic. Let's create a new variable called gone, which is going to be our connection. Mysql, throw line connects, which is basically going to connect to our database. You are just going to write your first lead swing to be localhost. Localhost, he's going to be my website's Holst. Then it's going to be our username. Then it's going to be our buzzwords, which is this one. And finally, we're going to put the name of our database, which might website. What do we want to do is create, use it. New function, which is going to be called MySQL or when select line database. Basically we're going to insert our variable called Khan. And then you're going to add your database name. So now we're going to use user, creates a new variable called user, and then we're going to use the function underlying pulse. And then let's just go behind here. And so what we're basically doing is in our home homepage, you have the contact info, our forms. And basically we're going to send this info to our database so that we receive the message. The first thing, which is our fullName, our user's full name. We put here that the name is called user. So basically we're going to insert here user. So basically this is going to import the they username to our database. Let's create another one for our email. Same thing. Then. You just go and check. What did you write down the name? The email. Then the final one is the message. We are going to do the same process. It is called message. Now, we'll use the query function, which is going to basically send a query to our database. And now we're going to write this query on MySQL language. You'll have to know a little bit of that, right? This will insert into usury for data because it's our table. And we're going to insert on ours, on our columns, which is going to be user, email and message, which are columns I added. But you can call them whatever you want. Let's just call it user email message. Just put it like this so that it doesn't get messy. Then the values are going to be, now we are going to insert our variables. Email, sorry, forgot, symbol. Then finally, we have them as such. We close all of this. Okay? Perfect. Okay, Okay. Know what you want to do is create a new query, which is going to be MySQL query. The only inserts gone variable and the query variable. So that's our IPO is sent to our database. And then we're going just writes phage message was sent. Note that this is done. Let's check if this works. Okay. Let's got in email and then our message here, it says message was sent. Let's see. We have our message right here and our email and username. It works. 9. The End and a Few Tips: Solely this and gentlemen, thank you for watching this class. You are at the end of this course, but rest assured, we're not there. I think what you have right now when you apply everything I told you, I think that's amazing. That's where I am right now and that's perfect for you to begin creating our websites. Have any questions. Feel free to contact me through email or leave a question on the discussion panel. Hope you liked it and hope to see you on the next one. Connect with us.