Skip to content
A Magic Mirror module to display tables from Airtable.
JavaScript CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
screenshots
MMM-Airtable.js Rename MMM-airtable.js to MMM-Airtable.js Jul 25, 2019
MMM-airtable.css updates CSS Aug 12, 2019
README.md Update README.md Jul 31, 2019
lodash.core.min.js Initial commit Jul 23, 2019
node_helper.js
package-lock.json Updates package name Jul 24, 2019
package.json

README.md

MMM-Airtable

This a module for the MagicMirror.

It can display your Table(s) from your Airtable and update them at a regular interval. Check the screenshots for more details.

Installation

  1. Navigate into your MagicMirror modules folder and execute git clone https://github.com/yashatgit/MMM-Airtable.git.
  2. Enter the MMM-Airtable directory and execute npm install. cd MMM-Airtable && npm install.

Airtable API configuration

Go to https://airtable.com/api and select the base to view its API documentation. Click the Javascript version of the Sample API. (Just search for the keyword apiKey and you will find the relevant details.)

We would need following details for the module to fetch the data:

  1. API key
  2. Base id
  3. Table name(s)

Module Config

Option Description
airtableAPIKey REQUIRED API Key for Airtable.

Type: string
airtableBaseId REQUIRED Airtable Base ID.

Type: string
animationSpeed Table refresh change animation time in ms.

Type: number
Defaults to 1500
updateInterval Interval for refetching the latest data.

Type: number
Defaults to 60*1000 (i.e. one minute).
tables A list of table configurations. See Table below for more details.

Type: array

Each object in the tables array can have the following parameters:

Option Description
workspaceName REQUIRED Name of the Workspace Tab/Table.

Type: string
tableTitle Optional title for your table. How you would like this displayed on your MagicMirror?

Type: string
maxRows Optional number to limit the maximum rows to be displayed.

Type: number
Defaults to 20
updateInterval Optional interval for refetching the latest data. Overrides the value from updateInterval in main config.

Type: number
rowBorder Optional bool check to show Borders below each row.

Type: boolean

Example of an entry in `config.js` which displays 2 tables as shown in Screenshot
{
  module: 'MMM-Airtable',
  position: 'top_right',
  config: {
	airtableAPIKey: '<YOUR_API_KEY>',
	airtableBaseId: '<YOUR_BASE_ID>',
	animationSpeed: 1.5 * 1000,
	updateInterval: 1000 * 50, //refresh after 50 sec
	tables: [
	  {
		workspaceName: 'Meal Planner',
		tableTitle: 'Meal Planner',
		maxRows: 7,
        	rowBorder: true, //shows row borders
	  },
	  {
		workspaceName: 'Todos',
		tableTitle: 'To Do',
		maxRows: 8,
	  },
	],
  },
},

Screenshots

You can’t perform that action at this time.