Extensions

Press shift + S to search API reference.

Guide

Building a new extension

You’ve installed the CLI and created a Hello World extension—let’s dive into building your own custom extension!

This guide assumes you’ve already completed Getting started and the Hello world tutorial. If you’re looking to get more familiar with the platform but don’t have a extension in mind to build yet, try the To-do list tutorial—it walks through building a simple extension from the ground up.

React in Extensions

Extensions are React applications, with Airtable-specific utilities available to you via the Blocks SDK. After you block init, you can build your extension as you would a standard React extension. You can import and use the Blocks SDK just like any other npm package.

If you’re not familiar with React, we recommend taking a look at their Getting Started guide. The core React concepts used in the Blocks SDK are function components and hooks. (Our hooks are also compatible with class components—see our note here.)

Starting from an existing extension

When creating a new extension, you can start from any of our existing example extensions. These provide a working extension for you to jump in and customize.

Here are some good starting points for different use cases:

  • Custom embeds: the URL preview extension shows an embedded preview when a cell with a URL is selected. (You can also install this extension from the extensions gallery!)
  • Custom reports: the Print records extension reads record data from your base and formats it for printing.
  • Custom charts: the Simple chart extension reads record data from your base and graphs it using Chart.js.
  • API integrations: the Wikipedia enrichment extension fetches data from an external API and saves it back to the base
  • Updating records: the Update records extension updates selected records when a button is clicked

You can also remix an open source extension if you have a link to the GitHub repo.

If none of the examples catch your eye or you just prefer a blank slate, create your extension using the “Hello world” template. This template is available in both JavaScript and TypeScript.

Useful features of the Blocks SDK

The API reference has full details, but here are some key features for inspiration:

  • You can fetch data for tables, views, fields, and records, and the extension will live update as that data changes—see the Read data from Airtable guide for details.
  • You can create, update, and delete records—see the Write back to Airtable guide for details.
  • You can see what table and view the user has open, and what records or fields they have selected with the Cursor API.
  • You can quickly build extensions that match the Airtable UI with a library of pre-built UI components. The library includes components such as Button, CellRenderer, TablePickerSynced, and many more.

Useful resources

  • The Custom Extensions community forum is the best place for asking questions about building extensions. You can also see what other developers have built and share feedback.
  • When you’ve finished your extension, the Polishing and sharing your extension guide has a checklist for getting your extension production ready for others to use.
  • More to come in the future! Let us know in the community forum if there are specific resources that would be helpful.