APIs

Apps are constantly sending messages to each other. The browser talks to your backend, and your backend talks to services like an AI model or a payment system. APIs make that possible.

What is an API?

An API is like a waiter. You don't walk into the kitchen yourself. You tell the waiter what you want, and the waiter brings back your food.

API stands for Application Programming Interface. In plain words, it's a set of rules for how one program can ask another program for something.

• A request is the order: "Give me all products under $40."
• A response is the food that comes back: the list of products.
• An endpoint is the address you send the request to, like /api/products.

Requests and responses

Every API conversation is a simple back-and-forth. For example, here is what happens when a shopper opens a product page in an online shop.

Let's break this down:

• GET means "please give me data." POST means "please save or do something," like placing an order.
• 200 OK is a status code that means it worked. 404 means not found. 500 means the server had a problem.

What JSON looks like

Most APIs send data back as JSON. JSON is a simple text format for data. It uses labels and values, a bit like a filled-in form.

{
  "products": [
    { "id": 1, "name": "Ceramic plant pot", "price": 24, "inStock": true },
    { "id": 2, "name": "Woven basket", "price": 38, "inStock": false }
  ]
}

• Curly braces { } hold one thing with labels, like one product.
• Square brackets [ ] hold a list of things.
• Each label (like "price") has a value (like 24).

AI APIs

ChatGPT, Claude, and Gemini have chat apps you use in the browser. Their makers also offer APIs, so your own app can send a prompt and get an answer back.

• The Claude API from Anthropic.
• The OpenAI API for GPT models.
• The Gemini API from Google.

To use any of them, your backend sends a request with a prompt and a secret API key. The key proves the request comes from you, and usage is billed to your account. Check each provider's pricing page for current costs.

For example, here's how you might ask an AI coding tool like Claude Code to add an AI shopping assistant to an online shop:

Create a server-side API route at /api/assistant.
It receives a shopper's question as JSON, like { "question": "a gift under $40 for a plant lover" }.
It sends the question plus our product list to the Claude API and returns the answer as JSON.
Read the key from the ANTHROPIC_API_KEY environment variable. Never send the key to the browser.
If the Claude API fails, return a friendly error message instead of crashing.

Common mistakes

• Calling an AI API straight from the browser. The key gets exposed. Always go through your backend.
• Ignoring error codes. If you see 401, your key is missing or wrong. Tell the AI the exact code you see.
• Assuming API calls are free. Every request to an AI API can cost money, so set a spending limit in your provider's dashboard.

What's next?

The kitchen often needs ingredients from the pantry. Next, let's look at databases, where your app keeps its data.