Author: Cara Cai
What is an API?
An API (Application Programming Interface) is a structured set of rules, protocols, and tools that allow different software applications to communicate and share functionality. APIs are not limited to web-based interactions; they also exist in various forms, including Operating System APIs (allowing applications to interact with system resources like file systems or memory), Database APIs (facilitating querying and data manipulation in databases), Hardware APIs (enabling communication with devices like cameras or sensors), and Library APIs (offering predefined functionalities for developers to integrate into their applications). Some APIs operate locally within a system, some connect disparate systems, sometimes over a network.
What is a Web API?
A Web API is a specialized type of API designed for communication over the Internet using web protocols like HTTP/HTTPS. It facilitates interaction between clients and servers, enabling applications to request and exchange data dynamically. For instance, Web APIs power functionalities like embedding Google Maps into a website, fetching real-time weather updates, or processing online payments through gateways. By enabling seamless integration between platforms, devices, and services, Web APIs are crucial for building modern, interactive web applications.
Arduino as API and Web API Client
Arduino as an API
Arduino can be understood as an API for hardware. Through its built-in Serial library, Arduino enables developers to send and receive data between the microcontroller and connected devices. For example, using functions like Serial.print() or Serial.read(), developers can transfer sensor readings to a computer or receive commands to control an actuator.
Arduino as a Web API Client
When equipped with network capabilities, such as Wi-Fi or Ethernet shields, or by using boards like the ESP32 or Arduino Uno WiFi, Arduino can interact with web servers via HTTP, making it capable of working with web APIs. This transforms Arduino into a powerful tool for Internet of Things (IoT) projects. For instance, an Arduino board can use a REST API to send sensor data—such as temperature or humidity readings—to a cloud server, which can then process and display the data in real time on a dashboard. Similarly, it can retrieve data or control commands from a web server, such as fetching weather updates or toggling a connected device based on user inputs from a web application.
To distinguish:
- If you’re building an installation where Arduino sends sensor data to a web app (via HTTP) or retrieves commands, you’re leveraging web APIs.
- If you’re controlling Arduino from software like Processing or p5.js using serial communication, that’s an API for hardware, not a web API.
P5.js as a Web API
P5.js as a commonly used tool in ITP as well as the creative field, is not just a creative coding library; it functions as a web API designed to make graphics, multimedia, and interaction accessible to everyone.
It operates on two primary levels: as a simplified JavaScript API and as an API for the HTML5 Canvas.
P5.js as a Simplified JavaScript API
p5.js simplifies the complexities of JavaScript by providing a high-level interface tailored for creative coding. For instance, functions like createCanvas() and mousePressed() make it easy to set up drawing environments and handle user interaction without requiring extensive knowledge of the Document Object Model (DOM) or event handling.
On top of that, p5.js extends JavaScript’s capabilities by incorporating features for animation, sound, video handling, etc.
P5.js as an API for the HTML5 Canvas
p5.js can be understood as an API for the HTML Canvas, which requires detailed commands and a solid understanding of low-level drawing operations. P5.js builds on this foundation, offering intuitive, high-level functions like ellipse() and rect() that translate into the corresponding drawing commands for the Canvas. P5.js also extends Canvas’s functionality by integrating features such as WebGL for 3D rendering.
Common Web APIs in Creative Technology
| API Type | Example | Use Case |
|---|---|---|
| RESTful API | Spotify API | Interactive music installations. |
| GraphQL API | GitHub GraphQL API | Querying project repositories for visualizations. |
| Web Audio API | p5.sound (built on Web Audio API) | Generative soundscapes. |
| Canvas API | Used by p5.js | Drawing interactive graphics. |
| Media Devices API | Accessing webcams/microphones for installations. | Integrating live video or audio streams. |
A Common Web API: RESTful API
RESTful API Overview
Note: I added a link to the previous REST explainer article. Please check that they’re more or less in agreement.
A RESTful API is one of the most widely used types of Web APIs, offering a structured and efficient way for applications to communicate over the Web. It facilitates the retrieval, updating, and interaction of data between clients (such as web browsers or mobile apps) and servers. The RESTful API process revolves around two primary components: Request and Response.
Request
A request is what the client sends to the server to operate. It consists of three main components: the HTTP method, the headers, and the body (optional). The method defines the action to be taken, headers provide metadata such as content type or authentication, and the body contains the payload—the actual data being sent.
Here are some key terms and concepts to understand Request:
Endpoint
An endpoint is a specific URL or URI (Uniform Resource Identifier) that defines where an API resource can be accessed. It serves as the address for performing operations, such as retrieving, updating, or deleting data. For example, in the API https://api.example.com/users, the /users endpoint allows the client to manage user data, whether by retrieving a list of users or adding a new one.
HTTP Methods
RESTful APIs use standard HTTP methods to perform actions on resources, providing a consistent and intuitive framework for interaction. The most common methods include GET (retrieve data), POST (create new data), PUT (update existing data), and DELETE (remove data). For example, a GET request to /users fetches a list of users, while a POST request to the same endpoint creates a new user.
Headers
Headers are metadata included in both requests and responses to provide additional context. In a request, headers might specify the content type (Content-Type: application/json) or include authentication tokens. In response, headers might inform the client about the data format or server details. Headers ensure smooth communication between the client and server by standardizing how data is sent and received.
Payload and JSON
The payload refers to the actual data or content sent in a request or received in a response. It is the meaningful part of the interaction, excluding metadata like headers. For example, in a POST request to add a new user, the payload might be:
{ "name": "Alice", "email": "alice@example.com" }
Similarly, the server’s response may include a payload containing the created user’s details.
To note, this data format is JSON (JavaScript Object Notation), the most commonly used data format in RESTful APIs due to its simplicity, readability, and compatibility with most programming languages. It can be used to structure the payload for both requests and responses. JSON ensures that data can be easily understood by both humans and machines, making it a key component of modern APIs.
Example of a Request
Here’s an example of a complete RESTful API request to create a new user in a user management system. You are building a system where users can sign up. To create a new user, the client sends a POST request with user information in the request body to the /users endpoint.
HTTP Method: POST (create a new resource)
Endpoint: https://api.example.com/users
Headers:
Content-Type: application/json
Authorization: Bearer your-access-token
Body:
{
"name": "Alice",
"email": "alice@example.com",
"age": 25
}
Response
A response is what the server sends back to the client after processing a request. It includes three main elements: the status code, which indicates the result of the operation (e.g., 200 for success, 404 for not found); the headers, which provide metadata about the response; and the body, which contains the payload with the requested or updated data.
Example of a Response
Response Status Code: 201 Created (Response successfully created)
Response Headers:
Content-Type: application/json
Response Body:
{
"id": 1,
"name": "Alice",
"email": "alice@example.com",
"age": 25,
"createdAt": "2024-11-28T10:15:00Z"
}
Key Features of REST APIs
REST APIs offer several essential features, making them a cornerstone of modern web development. They use human-readable URLs like /users or /artworks, which makes endpoints intuitive and easy to navigate (As a contrast example: https://www.example.com/query?name=here&lat=40.77&long=-74.99, this is a query string API that is not as friendly to read).
REST APIs also support flexible data formats, with JSON being the most widely used due to its simplicity and compatibility, though XML and other formats are also supported. These features make REST APIs particularly valuable in creative technology, where they power data-driven installations, IoT systems, and real-time art platforms, enabling seamless integration and innovation.
Conclusion
Web APIs are powerful tools for enabling creative, dynamic, and interactive projects in fields like ITP. Whether using RESTful APIs to fetch data, p5.js to manipulate visuals, or integrating IoT devices with Arduino APIs, Web APIs provide the essential foundation for many modern projects. By leveraging Web APIs, creative technologists can seamlessly design innovative solutions that connect the digital and physical worlds