This lesson we're going to be setting up our Temel that we're going to be making use of in the upcoming
lessons, so as you can see, we've got our basic HTML structure and you can go ahead and set the same
thing up so that you have the same starting place that I'm working with.
First of all, we need a div.
We'll just call this one.
We're going to use classes and then we're going to connect to the elements using JavaScript.
So we've got a class of game area and this is where all of our gameplay will take place, will indebt
indented, create another div and this div is for our stats and we're just going to leave them blank
because we are going to be using JavaScript to populate all of the details, create another div.
We want to have multiple pages, so multiple screens.
So the way that we're going to do that is we're going to have pages and I'm going to call this one main
and within the main page.
This is where our start screen is going to be.
So we'll have another div here and give it a class of starter and then within the starter we're going
to add in a start button so this can be a hyperlink if we want, or we can have it as a button if we
want as well.
So it actually doesn't matter.
I'll call it, I'll call it Class BTM and New Game.
So it's going to initiate and start out our new game.
So starting out our new game, you could also make it into a button if you wanted to.
And then one more div that we're going to need.
And this is going to be the next page where all of the gameplay is going to take place.
We'll call it game and we're also going to call it Page.
And you'll see in the next lesson why we're calling it page.
So this is going to give us a quick way to identify all the page areas that we want to utilize and all
of the different screens right now.
Within this game, we're going to have two different screens.
We're going to have the main starting page, and then we're going to have the actual gameplay page and
we're going to be building out all of the rest of the elements and all of the rest of the HTML structuring
it using JavaScript.
And as you can see, when you go out and you refresh it, not a whole lot happening there.
We simply have that button class, the only one that's visible.
I'll make this visible to two hundred percent so that it's a lot easier to see it in the next lesson.
We're going to be starting with JavaScript and connecting our elements, using the DOM connections and
JavaScript.
So that's coming up next.
So go ahead and set up your own index page and set it up within the similar structure.
So you have a main gameplay area, you've got two main pages, you've got a start button that you can
use and also stats so that you can place score and any other relevant information that the player needs
to know during gameplay.