> ## Documentation Index
> Fetch the complete documentation index at: https://docs.typebot.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Create a new block

export const YoutubeVideo = ({id}) => <div style={{
  position: 'relative',
  paddingBottom: '64.63195691202873%',
  height: 0
}}>
    <iframe title="Youtube video" src={`https://www.youtube.com/embed/${id}`} allowFullScreen style={{
  position: 'absolute',
  top: 0,
  left: 0,
  width: '100%',
  height: '100%',
  borderRadius: '8px'
}}></iframe>
  </div>;

<Frame style={{ maxWidth: '400px' }}>
  <img src="https://mintcdn.com/typebot/rHkgfCATWjP6ntzz/images/contribute/forging-robot.png?fit=max&auto=format&n=rHkgfCATWjP6ntzz&q=85&s=dd0ac4148f12f39f5e0b1f9df1a122e7" alt="A blue robot forging a new block" width="1024" height="1024" data-path="images/contribute/forging-robot.png" />
</Frame>

Creating a new block on Typebot is pretty easy and straightforward using our in-house framework [The Forge](../the-forge/overview).

<Note>
  If you are considering merging this new block to the official Typebot
  repository, make sure to open a [Github
  issue](https://github.com/baptisteArno/typebot.io/issues/new) first. This will
  allow us to discuss the specification and the best way to implement it.
</Note>

1. [Install the project locally](./local-installation)

2. Create a new branch:

   ```sh theme={null}
   git checkout -b MY_BRANCH_NAME
   ```

3. Create your new block using the [Forge CLI](../the-forge/overview#forge-cli):

   ```sh theme={null}
   bun create-new-block
   ```

4. The files should be generated in `packages/forge/blocks/YOUR_BLOCK_NAME`

5. Add the block's SVG logo in `packages/forge/blocks/YOUR_BLOCK_NAME/src/logo.tsx`

6. Right away you should be able to [run the application](./local-installation#running-the-project-locally) and see your newly-created logo in the sidebar of the editor.

7. Create a new action in the `packages/forge/blocks/YOUR_BLOCK_NAME/src/actions` folder. See [Action](../the-forge/action) for more information.

8. List this action in the `actions` array in `packages/forge/blocks/YOUR_BLOCK_NAME/src/index.ts`

9. Implement the action handler in `packages/forge/blocks/YOUR_BLOCK_NAME/src/handlers.ts`. See [Run](../the-forge/run) for more information.

10. To go further, check out the [Forge documentation](../the-forge/overview).

Make sure to check out other blocks implementations in the [packages/forge/blocks](https://github.com/baptisteArno/typebot.io/tree/main/packages/forge/blocks) folder.

## Video tutorials

<AccordionGroup>
  <Accordion title="NocoDB block">
    <YoutubeVideo id="0bleJ5uBgd4" />
  </Accordion>

  <Accordion title="Elevenlabs block">
    <YoutubeVideo id="PUQtzbpGd14" />
  </Accordion>
</AccordionGroup>

Make sure to join our [Discord community](https://typebot.io/discord) to participate to these weekly office hours.
