|
| 1 | +# Larger APIs |
| 2 | +These APIs give you an incredible amount of data to play with. You may not care about the subject, but when it comes to building something with several routes, these are great options |
| 3 | + |
| 4 | + |
| 5 | +## Pokemon API |
| 6 | +A massive set of data about pokemon |
| 7 | +- https://pokeapi.co/ |
| 8 | + |
| 9 | +## Star Wars API |
| 10 | +A huge API with a ton of info about Star Wars you can work with |
| 11 | +- https://swapi.dev/ |
| 12 | + |
| 13 | +## Open Library |
| 14 | +This API is a *little* opaque from the docs, but messing around eventually reveals answers. |
| 15 | +- https://openlibrary.org/developers/api |
| 16 | + |
| 17 | +Here are some hints to get started, try: |
| 18 | +- get a list of books by a search string: |
| 19 | + - https://openlibrary.org/search.json?q=fantasy |
| 20 | +- Take one of the books "key" property and query it individually with `.json` |
| 21 | + |
| 22 | +```js |
| 23 | +const getBook = async () => { |
| 24 | + const response = await fetch('https://openlibrary.org/works/OL45804W.json') |
| 25 | + const { title, covers } = await response.json() |
| 26 | + |
| 27 | + const titleEl = document.createElement('h1'); |
| 28 | + titleEl.textContent = title; |
| 29 | + const coverEl = document.createElement('img'); |
| 30 | + coverEl.src = `https://covers.openlibrary.org/b/id/${covers[0]}-L.jpg`; |
| 31 | + |
| 32 | + document.body.append(titleEl, coverEl); |
| 33 | +} |
| 34 | + |
| 35 | +getBook(); |
| 36 | +``` |
| 37 | + |
| 38 | +Play around there's a lot of info! |
| 39 | + |
| 40 | +# Simpler APIs |
| 41 | +These offer a more limited range of data, but still a lot to go through! Especially the Chicago Art Museum! Remember, you can combine APIs. Maybe you have a "cheer up" app that loads up a random joke for a user, and lets them see random pictures of dogs by breed, and then a stretch goal could be it lets them favorite those photos to a gallery (saved urls in localStorage). |
| 42 | + |
| 43 | +Get creative and have fun! |
| 44 | + |
| 45 | +https://anapioficeandfire.com/api/characters/583 |
| 46 | + |
| 47 | +| api site | API example Link | description | |
| 48 | +| -------------------------------------------- | -------------------------------------------------------------------------- | -------------------------------------------------- | |
| 49 | +| http://api.artic.edu/docs/#quick-start | https://api.artic.edu/api/v1/artworks | Chicago Museum of Art | |
| 50 | +| https://docs.api.jikan.moe/ | https://api.jikan.moe/v4/anime/32/full | Anime Data | |
| 51 | +| https://thronesapi.com | https://thronesapi.com/api/v2/Characters | Game of Thrones | |
| 52 | +| https://www.tvmaze.com/api | https://api.tvmaze.com/search/shows?q=girls | TV Shows | |
| 53 | +| https://anapioficeandfire.com | https://anapioficeandfire.com/api/characters/583 | Game of Thrones | |
| 54 | +| https://datausa.io/about/api/ | https://datausa.io/api/data?drilldowns=State&measures=Population&year=2016 | Cool and simple population data | |
| 55 | +| https://github.com/15Dkatz/official_joke_api | https://official-joke-api.appspot.com/random_joke | Random Jokes | |
| 56 | +| https://randomuser.me/ | https://randomuser.me/api/ | New Fake random user | |
| 57 | +| https://github.com/wh-iterabb-it/meowfacts | https://meowfacts.herokuapp.com/ | Cat facts, not sure if true | |
| 58 | +| https://www.zippopotam.us/ | https://api.zippopotam.us/us/33162 | Zip code to lat/long | |
| 59 | +| https://funtranslations.com/api/ | POST request | A fun translator with options from pirates to Yoda | |
| 60 | +| https://www.themealdb.com/api.php | https://www.themealdb.com/api/json/v1/1/categories.php | A recipe API | |
| 61 | +| https://dog.ceo/dog-api/documentation/ | https://dog.ceo/api/breeds/image/random | Random dog pics | |
| 62 | +| https://randomfox.ca/floof/ | https://randomfox.ca/floof/ | Random pictures of foxes | |
| 63 | +| https://xkcd.vercel.app/ | https://xkcd.vercel.app/?comic=latest | Load up XKCD comics | |
| 64 | +| https://www.ipify.org | https://api.ipify.org?format=json | Get the user's IP | |
| 65 | +| https://ipinfo.io/developers | https://ipinfo.io/161.185.160.93/geo | Get geographic data from an IP | |
| 66 | +| https://sunrise-sunset.org/api | https://api.sunrise-sunset.org/json?lat=36.7201600&lng=-4.4203400 | Sunset/sunrise time for geographic location | |
| 67 | +| https://api.attackontitanapi.com/ | https://api.attackontitanapi.com/characters | Attack on Titan | |
| 68 | + |
| 69 | + |
| 70 | +# More APIs |
| 71 | +There are of course more APIs out there than what we listed above. However, really try to aim for APIs that: |
| 72 | +- Do not have API keys |
| 73 | +- Require Servers |
| 74 | +- Are needlessly complicated |
| 75 | + |
| 76 | +Remember, the point of this project is to show you can make network requests, get data, and then manipulate that dom to show the data. Don't get distracted! |
0 commit comments