This sample app demonstrates the use of the Miro REST API's App Card endpoints. It makes use of each of the available CRUD (create, read, update, delete) methods to add and manage App Cards on a Miro board. It also provides an example of creating Miro App Cards from external structured data (.CSV file) and embedding a Miro board via direct link.
Miro capabilities covered in this sample app:
- Miro App Card items
- Create App Card API, GET App Card API, Update App Card API, DELETE App Card API
- Import structured data into Miro
- Miro Live Embed
- Create an app in Miro
- Generate an OAuth access_token (see Quickstart Guide) for authorization of our REST API or leverage our OAuth 2.0 NodeJS sample app and include it in your project.
- NodeJS
- HandlebarsJS
- ExpressJS
- Axios
- Fast-CSV
- Clone or download repo
- cd to root folder
- Run
npm install
to install dependencies - Create a
.env
file in the root folder, and set the following variables:
boardId={MIRO_BOARD_ID}
oauthToken={MIRO_ACCESS_TOKEN}
- From your desired Miro board, grab the board ID from the URL and paste it into the
.env
boardId
variable (above)
In this example, we will host the project locally at PORT 8000
.
- Run
nodemon app.js
to run the project - Your express server console should reflect "The web server has started on port 8000" (or the port of your choice)
.
├── package.json <-- The app dependencies which are installed in "How to start"
└── app.js <-- The main Node.js script to run the Express server and render our Handlebars app
└── .env <-- File where you are storing your sensitive credentials
└── node_modules <-- Node modules that are installed based on dependencies
└── views
└── createCard.hbs <-- Handlebars file to render app card creation page
└── deleteCard.hbs <-- Handlebars file to render app card deletion page
└── updateCard.hbs <-- Handlebars file to render app card update page
└── uploadCard.hbs <-- Handlebars file to render app card upload page
└── viewCard.hbs <-- Handebars file to render app card list page
└── home.hbs <-- main Handlebars file to render universal/root rendering
└── layouts
└── main.hbs <-- the Handlebars app itself
This is a backend app built on Node.js and Express.js, with Handlebars.js for rendering.