This project was generated with Angular CLI version 17.3.0.
- have a quick overview of the project structure
- get familiar with TriviaService, TriviaABCService and TriviaFirstLastLetterService services as well as Trivia interface
- create reusable
TriviaGame
component insrc/app/components/trivia-game
directory TriviaGame
component should be able to display a list of questions loaded through service- for each question there should be displayed hints coming from different services e.g. ABCD hints coming from TriviaABCService or first and last letter hints coming from TriviaFirstLastLetterService
- created component should be independent from specific services as their number will grow in the future
- below each question there should be input to allow answer on question and next question should be displayed when user hits enter to send answer,
- after sending each answer please write 'Correct' or 'Incorrect' message next to answered question
- already answered questions should be displayed until you finish game,
- when you answer all questions display 'You got x out of y questions correct!' bellow questions instead of input and 'End Game' button to return to screen with toggle button to select mode
- in
App
component you will find Button toggle component with two game modes - ABCD and First and Last Letter, using createdTriviaGame
component display game's questions. You can use any known method to provide correct services forTriviaGame
component however using Strategy design pattern is preferred - add unit tests to cover functionalities in selected components/services
TriviaABCService
and TriviaFirstLastLetterService
should have access to following functions:
getHints
- should return array of hints for given questionvalidateAnswer
- should return boolean value if answer is correctgetTriviaQuestions
- should return array of questions
See gameDemo.mp4 file for example of how the game should work.
Run ng serve
for a dev server. Navigate to http://localhost:4200/
. The application will automatically reload if you change any of the source files.
Run ng generate component component-name
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module
.
Run ng test
to execute the unit tests via Karma.
To get more help on the Angular CLI use ng help
or go check out the Angular CLI Overview and Command Reference page.