Working with APIs
Your app can pull in live weather, generate text with AI, search a photo library — all by talking to other services through APIs. You don’t need to understand the plumbing. You just need to understand the concept so you can tell Claude what you want.
What’s an API?
Think of a restaurant. The menu shows what’s available. You place an order. The kitchen makes it. Food arrives at your table.
An API works the same way. Your app sends a request (“give me the weather for San Francisco”), a server processes it, and data comes back.
Here’s what that actually looks like. Your app calls a URL like this:
https://api.open-meteo.com/v1/forecast?latitude=37.77&longitude=-122.42¤t_weather=trueThat URL is the request. The ? starts the parameters — the specifics of what you’re asking for. latitude and longitude tell it where. current_weather=true tells it what you want back.
The API responds with data that looks like this:
{
"current_weather": {
"temperature": 17.2,
"windspeed": 12.5,
"weathercode": 0
}
}Your app takes that data and turns it into something people can see — a card showing “17°C and clear in San Francisco.”
Understanding JSON
That response above is written in JSON. You’ll see it everywhere when working with APIs, so it’s worth a quick explanation.
{
"temperature": 72,
"condition": "Sunny",
"location": "San Francisco"
}JSON is just data organized with labels. Curly braces {} mean “a thing with properties.” Each property has a name (in quotes) and a value, separated by a colon. Square brackets [] mean “a list of things” — like a list of forecast days or a list of search results.
That’s it. You don’t need to write JSON. You just need to recognize it when Claude shows it to you or when you’re reading an API response.
A Real API: Open-Meteo
Open-Meteo is a free weather API — no account, no key, no setup. It’s what powers the Weather project in this course.
The request is just a URL with parameters:
https://api.open-meteo.com/v1/forecast?latitude=37.77&longitude=-122.42¤t_weather=trueYou could paste that into your browser right now and get a response. But you won’t need to build these URLs yourself. You tell Claude:
Fetch the current weather for San Francisco using the Open-Meteo API and display the temperature and conditions.Claude writes the code that calls the URL, reads the JSON response, and wires everything up to your UI. You describe what you want. Claude handles the how.
API Keys
Some APIs are open like Open-Meteo — anyone can call them. Others require an API key, which works like a password. You sign up for an account, get a key, and include it with every request so the service knows who’s asking.
When a project needs an API key, you’ll store it in a .env file — a special file that keeps secrets out of your actual code. Tell Claude:
Set up a .env file for my OpenAI API key. Make sure it's not committed to git.Claude will create the file, add it to .gitignore, and wire it into your app. For handling keys when you deploy to production, see the Deployment guide.
What You Can Build
APIs open up a huge range of possibilities. A few categories worth knowing:
Weather and location — Open-Meteo, OpenWeather. Dashboards, outdoor activity apps, travel tools.
AI and language — OpenAI, Anthropic. Text generation, summarization, chat interfaces.
Images — Unsplash, Pexels. Search and display stock photography in your app.
Data — REST Countries, Open Library. Pre-built datasets you can query and display.
You don’t need to memorize what’s available. When you have an idea — “I want my app to do X” — ask Claude if there’s an API for it. There usually is.
Handling States
Every API call has four possible outcomes. Good apps handle all of them:
Loading — the request is in flight. Show a spinner or skeleton so the UI doesn’t feel broken.
Success — data came back. Display it.
Error — something went wrong (network issue, bad key, server down). Show a clear message and a retry button.
Empty — the request worked but returned nothing. Show a helpful empty state instead of a blank screen.
You don’t need to build this logic yourself. Tell Claude:
Handle loading, error, and empty states for the weather fetch. Show a spinner while loading, a retry button on error, and a message if no data is returned.Keep Going
You now understand what APIs are, what JSON looks like, and how Claude handles the heavy lifting. To put this into practice:
- Weather project — build a real app that fetches live weather data from Open-Meteo
- Data Persistence — learn how to save API data locally so your app works offline