Quiz Maker

GOAL: Build a small quiz maker application that creates a 5-question quiz based on a trivia API STEP #1 - Implement the ability to select a trivia category and difficulty level - The API used to get the list of categories can be found at: [login to view URL] - The 3 difficulty levels are: Easy, medium, hard. - Note that styling is not that important for this project, and the layout of your application can be different as long as the application works properly. This is an Angular certification, not a CSS or HTML certification. - The category dropdown should have an HTML attribute ID equal to categorySelect, the difficulty dropdown should have an ID equal to difficulty select, and the button should have an ID equal to createBtn Copyright 2023 Interstate 21, LLC - [login to view URL] 3 STEP #2 - Display a 5-question quiz based on the selected category/difficulty - Use the Open Trivia Database API to get the data. For instance, this request will give you 5 questions for easy film trivia: [login to view URL] - Answers should be displayed in a random order. Each possible answer should be a clickable button that gets highlighted and remains as such when clicked. When all questions are answered, a submit button should become visible. Copyright 2023 Interstate 21, LLC - [login to view URL] 4 STEP #3 - Display the results of the quiz with the right/wrong answers RESULTS - Once the user submits their quiz, navigate to a different component (using the Angular router) that highlights the user’s answers in green color when it is a correct answer, or red color when it is the wrong answer. The correct answer is always displayed in green. - Display the final score at the bottom with the following color scale: - Red color if 0 or 1 correct answer, Yellow color if 2 or 3 correct answers, Green color if 4 or 5 correct answers - Add a button at the bottom of the page that redirects to the new quiz creation screen.