This Project is a bacic quiz with a question area, a heading and some side links. There is also a score section counting the score of the project. This website is purely a fun exercise and provides a basic general knowledge quiz around gaming. The website is designed as a fun exercise for young Gamers. There are also links to the code institute showing them where to go if they would like to learn how to code and gaming news. There is also a link to the Global Gamers Club which encourages young Gamers to join so they can play together in a safe environment.
The features at the top of the quiz game page are the Logo and Heading. The Logo was designed in Canva and the heading is in a Flex Box designed in CSS.
- The Game area has a start button and a score section below it that keeps track of the score while playing.
- Once started the quiz runs through a random sequence of questions that the player should answer. If the answer is correct the background colour turns green. If the background goes red the background colour goes red.
- This is an example of an incorrect answer.
There are some external links for quiz players to explore, they are the type of website that may be of interest to a gamer taking the quiz.
The Ultimate Gaming Quiz Website has been tested on the W3C html Validator and came back with good results.
Tests for the CSS were also done on W3C CSS Validator
The JS Hint Validator came back with some warnings. This project is was work done from a tutorial as a result the syntax hase som warnings.
The website performed well in the Lighthouse checks for desktop devices.
The Website was slightly weaker on mobile devices.
At time of Deployment the counting score function does not work correctly. This is a work in progress.
This project was Deployed to Github fromo the source section. It was the master branch.
I would like to thank the Code Institute for the opportunity once again. In my previous project I focussed mainly on Love Running as and example. This time I decided to focus on a tutorial that was not part of the course in order to give me more exposure to JavaScript.
I followed this tutorial and all credit goes to this developer Kyle Cook and the Code Institute.
https://www.youtube.com/watch?v=riDzcEQbX6k&t=397s
The Logo was created with Canva. The Favicon was also created with Canva.
The questions are questions that I came up with. My sons are avid gamers and the games mentioned are within their age bracket.
I kept the colours similar to the previous project. If possible I will aim to keep the same theme throughout the projects for cosistency.
The only image used in this project is the logo. There are however media queries created to make sure all flex boxes and the gaming area are totally responsive.
Languages used in project: HTML, CSS, Javascript
Programs or Websites used:
-
Canva : For the Logo Design
-
Gitpod: This was used for building the project
-
Github: Github is used as the primary file library or host.
-
Paint.net: I used Paint.net to rework the logo design and resize the favicon.
-
Python Tutor: This was used for running and checking functions