ossamarafique / drooms-swapi-angular-coding-challenge Goto Github PK

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.

• When the user opens the application
• Then the user should see a list of "Star Wars" movies

• Given the user has opened the home page
• When the user clicks on a movie name
• Then the user should be redirected to the movie details page

• When the user opens the movie details page
• Then the movie title, producer, director, and release date should be displayed
• And the opening crawl of the movie should be shown
• And a list of characters should be displayed

• Given the user has opened the movie details page
• When the user clicks on a character name
• Then the user should be redirected to the character details page

• When the user opens the character details page
• Then the character's personal data should be displayed
• And a list of movies in which the character appeared should be shown

• Given the user has opened the character details page
• When the user clicks on a movie name
• Then the user should be redirected to the movie details page

• Use Angular.
• Use Angular Routing.
• Show spinner(s) during data loading.
• Avoid extra requests: don't request the data from the API if you have already loaded it.
• Use Angular Material, Bootstrap, or any other library to set up basic styles.
• Use any other libraries if you need them.
• The application should support the latest version of Google Chrome.

Would be a plus:

• Use NgRx or similar libraries for state management.
• Create a mobile-friendly (responsive) design.