danalexilewis / airtable-json-block

Written in TypeScript. Import data from JSON files, and query with JSONPath

📊 JSON Import Block for Airtable

Written in TypeScript. Import data from JSON files, and query with JSONPath.

Built by the SVI Team. Featured on Airtable's Developers Blocks.

Looking for help with your software project? Email us to chat at [e-mail]!

Quick Start

Recommended method: Remix from GitHub

1. On your Airtable base, open the Blocks sidebar on the right, and click Install a block

2. On the modal that opens, click Build a custom block

3. Select Remix from GitHub on the Build a block modal

4. Enter JSON import Block in the Block name field

5. Enter https://github.com/SiliconValleyInsight/airtable-json-block in the GitHub repository field

   

6. Click Create block, and follow the instructions on the next screens to run and test the Block locally

Manual method (no longer recommended)

1. Clone this git repo

   $ git clone [e-mail]:SiliconValleyInsight.com/airtable-json-block.git

2. Install necessary packages with npm

   $ cd airtable-json-block/json_import
   $ npm install @airtable/blocks-cli
   $ npm install @airtable/blocks
   $ npm install

3. Follow this guide to setup a new Block for your base

4. Take note of the Block ID (format: blkxxxxxxxxx) and Base ID (format: appxxxxxxxxx) from the guide above, modify the baseID and blockID in remote.json, and save

5. Run $ block run and ensure that the Block is running locally

6. On your newly created Block from step 3, enter htps://localhost:9000 as the URL and click "Start editing block"

   

Developing

• Make sure to follow Airtable's style guides for React and TypeScript (refer to Airtable's developer docs)
• Install eslint and prettier, and make sure to run both before committing a file

Screenshots

Block dashboard screen

JSON import and mapping screen