Before we actually start writing the code, we need to get ready for that, I mean, to get familiar
with the files of the project.
So here I have a new folder on my desktop called Project Quiz App.
As we already said, the starting source file is attached to the first lecture of the section.
So before we start coding, you need to download and then write the code step by step with me.
All right, let's open this folder in brackets.
You know, from the previous video that our application consists of four different pages and each of
them has an image as background.
And we had also small small icons.
So all of those images are stored in images folder.
And then we have three files, indexed HTML standards and script OJs.
So as we said, our application consists of four different pages.
And you may think that we have four different HMO files, but all of these sections, XML code is placed
in one document only.
Let's say it opened the index extremophile in browser.
So you can see that all of these parts are placed in one page.
OK.
Let's have a brief overview of index extremophile.
Inside haptics, we have several links, one for style useful, and the rest of them are for different
Google fonts, then in body aliments pages are separated as sections and they start and and of them
is indicated with comments.
First, we have section for a landing page.
It consists of having element with two inputs and button for starting the quiz.
Next, we have Section four admin panel.
It includes three main parts.
First one is for adding questions.
It has multiple inputs and button elements.
Next part is for results list.
And the last one is for inserting questions in question list.
All right, after that, we have Chris section, it has two main parts, one for question and options.
Also in this part, we have container for instant answer.
I mean, message four, correct or wrong answer.
But at this point, this container is hidden.
Using CSFs quiz section also includes Development for Progress Bar.
The last section of Estill document is for final results page.
This one is very simple.
It just includes button for a log out and had an element for showing the final result.
And below, of course, we have a link for our JavaScript file.
OK, let's open Standard Xerces file, it includes hundreds of lines of code, so it is very large file
because I have used pure access without any frameworks like bootstrap material design or any others.
I'm not going to describe which of this line, if you're interested in it, you can have a deep look
at this code and consider it.
Also, I would like to say that if you're not familiar with access or you don't have deep understanding
of it, it's not a problem.
Throughout this project, we are going to use several very simple Sears's properties.
So you won't have any trouble with that.
All right.
As for the JavaScript file, it is completely empty for now because we are going to start writing JavaScript
code right from the beginning.
Before we finish, I want to show you one more thing.
I believe you guessed that we are going to write large JavaScript code because our application has lots
of features and brackets.
Also, other code editors have a nice feature called a mini map.
It has a small view of the entire code and also it helps us to navigate through it.
So if you use brackets and you didn't have install it yet, you can simply go to extension manager and
in available section you can search M.F..
That install it and use all right, that's it now we're ready to go.