GitHub Blocks Examples

The GitHub Blocks app depends on a set of "blocks" that handle how to render files and folders. This repo contains a set of example blocks that can serve as inspiration for you to create your own.

Example blocks

Blocks come in two types: file blocks and folder blocks.

All blocks require an object within blocks.config.json to describe their intended use. For example:

{
  "type": "file",
  "id": "css-block",
  "title": "Styleguide block",
  "description": "View selectors in a css file",
  "sandbox": false,
  "entry": "blocks/file-blocks/css.tsx",
  "matches": ["*.css"],
  "example_path": "https://github.com/githubnext/blocks-tutorial/blob/main/global.css"
}

👀 Preview these example blocks by going to blocks.githubnext.com!

File blocks

Folder blocks

Create your own custom blocks

Follow the instructions in our custom blocks template repository.