Skip to content

project-checklist.md

Latest commit

 

History

History
28 lines (21 loc) · 2.26 KB

project-checklist.md

File metadata and controls

28 lines (21 loc) · 2.26 KB

Angular Mini-Project

Build an Angular SPA to consume an API. You'll want to choose an API and present some data from it to users. You'll want to add in some interactivity, for instance if using the IMDB API you could get a movie title from the user. Get creative! If you aren't feeling creative, I would suggest using the PokeAPI. You can also look at the catalogue of API's listed on the RapidAPI hub.

Here are the necessary concepts and techniques we want to see on display in your mini-project:

  • SPA Route Navigation
  • Consume a RESTful API
  • User Interaction
  • Multiple Components

If you would like more direction for this project, come see me and we can discuss it. This is a mini-project, we only have 3-4 days to work on it. The scope of this project is fairly small. If you can retrieve data from a remote API, weave that data into a template/view, and render it for the user you are almost done. Add in some user activity, for instance let the user request what data they're shown. Make sure we have several components, and that we can navigate between them.

Here is an example mini-project using the PokeAPI:

Poke-Team

Description

This angular SPA consumes the PokeAPI (https://pokeapi.co/) allowing users to build a 6-member Pokemon team, and quickly look up info about the team members. Initially presented with 6 blank slots for teammates, users will select Pokemon to fill those slots. There is a view for the whole team, and clicking any of the pokemon will navigate to a details page with up-to-date information retrieved from the API.

Concepts

  • SPA Route Navigation - when clicking on a pokemon in the team view, route to the individual detail view. There should also be a link to route back to the team view.
  • Consume a RESTful API - fetch up-to-date information on demand from the pokeAPI
  • User Interaction - allow users to select the pokemon, either from a list or by typing into a text field
  • Multiple Components - There are at minimum 2 components here:
    • team view
    • team member details




If you wanted to do a different project, take this example as an indication of the scope you should be aiming for.