Glide • Introduction to APIs

Have you ever wondered how your apps share data or websites display information from others? APIs, or application programming interfaces, are the answer.

Introduction to APIs

APIs are the gateways between apps. They are the interface through which you program an app to receive, send, replace, edit, or delete information from another app. Each API lays out a set of rules for communicating with that particular app.

A weather API allows your smartphone to get weather information from a computer at the weather station to find out if you'll need an umbrella tomorrow.

A stock API allows your laptop to ask a computer at the stock exchange about the latest price of a share of $NFLX (Netflix).

Beyond retrieving information, many APIs actually do things, like increase the temperature in your house or enable payment processing on e-commerce websites.

But why do we need these interfaces? Why can't computers just talk to each other directly?

It’s because apps have different rules and structures and can be written in entirely different languages. So if you want to program one app to speak to another, you need an interface that speaks both languages.

APIs in Action

Let's look at the Free Dictionary API at https://dictionaryapi.dev. This API takes a word (e.g., “hello”) and returns information about that word.

For example, if you visit: https://api.dictionaryapi.dev/api/v2/entries/en/hello you'll get something like this:

So, the three basic things you need to know about APIs are:

Applications speak different languages
APIs are the gateways between applications
APIs have URLs, but they return data, not websites

Those are the basics. However, in order to start using that data, we need to go a little deeper—starting with a base-level understanding of JSON.

JSON + APIs: The Basics

The data you see when you visit the dictionary API page for “hello” is called JSON. JSON (pronounced like the name “Jay-SON”) is short for “JavaScript Object Notation.” It's a part of the JavaScript programming language that is all about storing values (data).

Although APIs are different, a lot of them use JSON to send data. JSON is a language-independent data format, which makes it great for transmitting data between different software applications.

A basic understanding of JSON goes a long way when working with APIs, so let's get to know the essentials. We'll look at:

Storing values in JSON
Value types
JSON objects
Accessing values in JSON

1. Storing Values in JSON

When people communicate, their language can be rambly, ambiguous, and disorganized, but other humans are very good at picking out useful information. For example, someone might say:

Hi! Oooh, what a nice day! Nice to meet you. Umm.. so I'm Jack and apples are awesome... probably my fave food. Also 42!... oh man, my fave number. Love that number. Anyways.... see you later! 🤪

But computers have a hard time with information that is not well structured. Here's the same information (more or less 😉) in a structured format that's very easy for computers to digest:

{ "name": "Jack", "favorite food": "Apples", "favorite number": "42" }

This is a JSON document with three properties, organized as key-value pairs:

name is a key property with the value of "Jack"
favorite food is a key property with the value of "Apples"
and favorite number is a key property with the value of "42"

Each key has a value that is stored within it. We can then retrieve that value later by asking a program what the value of favorite food is.

💡 The syntax for storing these values is important.

{ and }open and close a collection of key-value pairs. This is also called an
object.
The key and value are both wrapped in quotation marks
A colon comes after the property
Property-value pairs are separated using commas

2. Value Types

You can store different value types in JSON:

Text "Hello World!"
Numbers "123"
Booleans true false
null (Meaning 'no value' or empty)
Arrays (multiple values assigned to one property using square brackets — see 'favorite foods' below)

{ "firstName": "Tom", "secondName": "Jones", "number": 07777888999, "isOnPlanetEarth": true "deepestSecret": null "favoriteFoods": [ "Pizza", "Sushi", "Chocolate" ] }

3. JSON Objects

When you store a group of key-value pairs with curly brackets { }, it's called an "object." JSON is all about storing objects, hence the name JavaScript Object Notation.

You can also have nested objects. For example, if we were to describe the properties of a book, we'd need to use sub-objects:

{ "name": "Harry Potter and the Philosopher's Stone", "author": { "firstName": "Joanne", "lastName": "Rowling" }, "editor": { "firstName": "Arthur" "lastName": "Levine" }, "publisher": "Bloomsbury Publishing Plc", "ISBN 10": "0747532745", "ISBN 13": "9780747532743" }

4. Accessing Values in JSON

Let's go back to the Dictionary API example.

We've requested information on the word “Hello” and we've been given back a lot of information. We know the value we want is in there, but how do we tell our program to navigate to it?

With some simple formatting using JSON Formatter & Validator, we can see that it is well-organized JSON.

Using the + and - buttons, this tool also allows us to fold and unfold the different parts of the JSON to see the higher and lower structures of objects & arrays.

To find a key-value pair in a JSON file, we need to specify the address. We do this with a useful thing called JQ. JQ lets you give the address of a value inside of JSON, and it will navigate to it. There are really only two essential things to remember when using JQ:

. = allows you to navigate to a property

[] = allows you to navigate an array

Let's look at the first part of our JSON. It starts with an array, then inside that array is an object, and inside that object is a key called meanings.

To get there we would write .[0].meanings

The . starts off our JQ
The [0] specifies it's the first element in the array
.meanings is how we access the meanings property

However, the information we need (the definition of the word) is deeper within the JSON. The full JQ we would write to get there would be [0].meanings[0].definitions[0].definition.

You can see how this query builds up in the image below.

Ready to dive into JSON and APIs? Sign up for Glide to build a workplace app or website and start fetching APIs and data!

API Structure

The dictionary example we gave at the start is an example of a public API. In other words, anyone can use it. There are lots of public APIs on the web. However, even if they are free and open to use, some require authentication.

There are different approaches to authentication, which are specific to each API. If you're not working directly with APIs, you don't need to worry about this too much. But if you're interested, you can learn more about configuring APIs in Glide in our docs.

Path Parameters

When you visit an API's URL, it doesn't return a website. Instead, it returns data or “resources.”

For example, if you visit https://pokeapi.co/api/v2 you get high-level data about the Pokemon API.

But we can add parameters to that URL to change the path and, therefore, what data we access. If you add the parameter /pokemon/ and then the name of a Pokemon to the end, you can access that specific resource (i.e., data about that Pokemon).

Path Parameters

Query Parameters

APIs also often have Query Parameters, also knows as Query Strings.

Each API is different when it comes to the parameters it allows. You can read more on this topic here.

There is a lot more to APIs, but these basics are enough to give you greater context when working with developers or talking about APIs.

Create Your Own Software Using an API

Glide is a software-building platform that lets you create business apps and websites using just the spreadsheets you already work with and our robust templates. No need to learn complex code or hire out an expensive custom agency (Have you seen app building costs lately?!).

It’s easy to apply all the knowledge you just learned to create powerful work software with Glide. Sign up for free and import any spreadsheet. Once you’re inside your Glide Data Editor (pictured above), you’ll be able to edit your project's data and add new, powerful computed columns on top of your data.

One of the computed columns you can add is Fetch JSON. It makes fetching data from APIs incredibly simple. Just add the column, add your API’s URL, then add a JQ query to select the data you want.

For more help putting what you’ve learned here into practice, try following along with Darren Alderman's video, where he builds a Glide Page from scratch to make his own dictionary in just over 10 minutes!

Psst: Learn more about APIs and JSON with our Glide University courses with our certified experts.

Search a Dataset in Glide Using the Fetch JSON