[MUSIC] Hi and welcome to the lesson. Last time, we talked about an approach for creating new features in web applications. And in this lesson, we'll be doing some guided practice for the development of your HTML forms with validation. This practice should be helpful while you're working on your project for this course. So the first thing I think you should do is spend a little time thinking about what kind of form you want to create. You can look at forms on the internet but I recommend considering both how you want the form to look and what it's purpose will be. For instance, will it be a customer service form, will it be a form that's specific to some business. Will it be an order form for ordering a product? Will it be a form for submitting a recipe online? There are many possibilities for your form, so give us some thought. Next, I recommend starting with a template that we looked at a few different templates in this class. And you can use any of those or you can use one that you developed along the way. But it's usually a good idea to avoid coding the parts of your form from scratch each time. Now early on it may be good practice, but eventually we begin to make typos and things that we really do know how to do. So the typos just slow us down and we weren't learning anything new. So starting with a template of sorts to save yourself some typing and mistakes is a good idea. So here I have a page that we've worked with before at least a version of it. And I have my HTML tag, my head tag, I have a title, I have on line 7 a link from my CSS. On line is not within 13. I have my script tags and I have a pretty good idea that these are working. This will save you time if you aren't doing it already, you should give us a try. Now because I know I want to go to form, I have form text. And I have more elements that I really need from our previous example, and here it is. So, you could start with something like this if you had it available and merely add and delete as needed. The advantage here is that the quotes are in the right places. You have some of your events ready made. You'll get a little reminders on the syntax based on what you've done before. So start with something like this and get all the elements of your form in place. Now, if you miss one or change your mind at some point of course you can make one of occasions but I recommend you work methodically on this and get your form elements all into place. Next I recommend that you work on your CSS. Now we talked about in a previous lesson how it's a good idea to give just a very basic version of your CSS working so that you know your file is connected properly for your project. So here we have basic.css, it has just a few items, it colors the page its style is H1 and gives a test class. You can do this or even at lest just to get it working initially. And as we can see here, it is working properly. At each point make sure it works. Now, this word has come up brings us to another point. And that's to ones you have your script syntax in place put a little bit of JavaScript something that's going to be visible to you in place to make sure this is working. So for instance this tells you that there isn't some typo in your tags at each step you want to find a way to test it. So, notice that I tested styles I verify that I could see the elements of my form. I tested, the JavaScript is working, do each one of these things in turn and get it working to your satisfaction before you move on to the next point. And avoid the temptation to do too much at once, changing too many elements before you're able to save the file and test. Save regularly and test regularly. This will save you a lot of time because you'll know when something stops working that it was a change you made in the last few moments that is probably the culprit. If you instead work for 30 minutes or even 60 minutes, between tests and your form no longer works. You'll have a difficult time knowing what exactly you did that made it stop working or worked differently than it did before. So this is all previous lessons we'll continue with the same guided practice and add our JavaScript functions for validation in the next lesson.