Transport For London React Hooks
This challenge uses TFL API, and react hooks, bootstrap.
https://tfl-react-challenge.netlify.app/
Live at :useful links:
- tfl api documentations: https://api.tfl.gov.uk/
- All lines : https://api.tfl.gov.uk/Line/Route?ids=100&serviceTypes=Regular
- methods: https://api.tfl.gov.uk/Line/Meta/Modes
- react-google-charts: https://react-google-charts.com/
secreenshoot
objectives:
- practice useState
- practice useEffect
- practice connecting to multiple api endpoints.
- pracitce using third party packages
- practice looking into the docs of third party tools.
- chance to take a look at charts and data representation.
students supposed to do:
- fetch tfl api to get all transport methods, then create dropdown menu for methods.
- fetch tfl api again depending on selection from the first dropMenu, or the can cache those data from the beginning using useEffect
- create second dropDown menu for each line of the the selected transport method.
- select one line will fill up the table with line origin, destination, type and name.
- represent some data using google-react-charts