Skip to content

javierarce/corcho

Repository files navigation

Corcho

Corcho (/ˈkoɾt͡ʃo/) is a tool that creates and sync web slideshows using the contents of a Figma file. You can then use GitHub Pages to host your slideshow on the web and have it automatically updated using GitHub Actions.

How to run Corcho

  1. Create a file in Figma and your slides as frames.
  2. Create a non-expiring Figma personal access token.
  3. Copy the file id of your Figma file (which is the string of random alphanumeric characters found in the URL after figma.com/design/)

On GitHub Pages

  1. Fork this project and add two secrets:
  • FIGMA_FILE: with the file id.
  • FIGMA_TOKEN: with your Figma Personal Access Token.

Optionally, add FILE_FORMAT to specify the format of the exported images. The default is jpg, but you can also use png or svg.

  1. Enable:
  • GitHub pages for the main branch.
  • The deploy workflow (by visiting the Actions tab).

Customization

By default the cronjob of the GitHub Action will run every hour on the hour, but you can change the scheduling to be more frequent. Here's an example of a job that gets executed every 5 minutes (which is the shortest interval allowed):

name: Cron
on:
  push:
    branches: [ "main" ]
  schedule:
    - cron: "*/5 * * * *" # Runs every 5 minutes

If you don't need continuous updates, you can remove the .github/workflows/deploy.yml file.

Also, please note that free accounts have a limit of 500 MB and 2,000 minutes of run time per month. Please check the included storage and minutes available for your account type.

Locally

  1. Clone this project
  2. Rename the .env.sample file to .env and update it:
  • FIGMA_FILE: with the file id.
  • FIGMA_TOKEN: with your Figma Personal Access Token.
  1. Install the dependencies with yarn install or npm install
  2. Run the project with yarn start or npm run start
  3. Open the index.html file in your browser using a local server.

Shortcuts

Key Action
or Space + Shift Previous slide
or Space Next slide
J or Page Down Next page
K or Page Up Previous page
Tab Open navigation
F Toggle fullscreen
Esc Exit fullscreen
C Toggle comments
R Go to the first slide of the current presentation

When the navigation is open

Key Action
or Tab + Shift Previous page
or Tab Next page
Enter Select page
Esc Close navigation

Example