Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions app/components/IntegrationsList.vue
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ const integrations = [
to: '/guides/integrations/zapier',
logo: '/docs/img/zapier.png',
},
{
title: 'Vercel',
description: 'Connect Directus with Vercel to trigger deployments and monitor build status.',
to: '/guides/integrations/vercel',
logo: '/docs/img/vercel.webp',
},
];
</script>

Expand Down
2 changes: 2 additions & 0 deletions content/guides/11.integrations/4.vercel/.navigation.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
title: Vercel
headline: Vercel
53 changes: 53 additions & 0 deletions content/guides/11.integrations/4.vercel/0.index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
---
id: vercel-integration
title: Integration
description: Connect Directus with Vercel to trigger deployments, monitor build status, and manage your frontend projects directly from your Directus instance.
technologies:
- vercel
---

Connect your Directus instance with Vercel to centrally manage deployments, monitor build status, and control multiple frontend projects — all without leaving Directus.


::callout{icon="heroicons-outline:rocket-launch"}
**Quick Start**
1. **Enable Deployment module**: Enable the Deployment module from your Directus project settings
2. **Connect your Vercel account**: Navigate to the Deployment module and add your Vercel API token
3. **Add projects**: Connect one or more Vercel projects to your Directus instance
4. **Start deploying**: Trigger builds and monitor deployment status from Directus
::

## Getting Started

### Connect Your Vercel Account

1. In Directus, navigate to **Settings**
2. From the **Modules** section, enable the **Deployment** module
3. Navigate to the Deployment module shown in the primary navigation
4. Select **Configure Vercel** to begin the integration
- **Personal Access Token**: Your Vercel API [access token](https://vercel.com/kb/guide/how-do-i-use-a-vercel-api-access-token)
- **Team ID (Optional)**: The ID of your Vercel team (if deploying team projects rather than personal projects)
5. Click **Save** to establish the connection and begin adding projects

### Configure Projects

1. From the **Vercel Configuration** screen, choose which projects you want to manage from Directus
2. Click **Save** to add the projects to the integration
3. You can return to the Vercel integration settings at any time to add or remove projects

::callout{icon="material-symbols:info-outline"}
**Permissions**
<br>
**Admin Access Required (For Now)**
<br>
Currently, only admin users can trigger deployments and manage Vercel projects. Role-based permissions will be available in an upcoming release, allowing you to grant deployment access to specific users and roles.
::




## Documentation

**[Working with Deployments →](/guides/integrations/vercel/deployments)**

Trigger deployments, monitor build status, and manage your frontend projects directly from your Directus instance.
17 changes: 17 additions & 0 deletions content/guides/11.integrations/4.vercel/deployments.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
---
id: vercel-deployments
title: Deployments
description: Complete guide for triggering deployments, monitoring build status, and viewing logs for your Vercel projects from Directus.
technologies:
- vercel
---

This guide covers how to manage your Vercel deployments from within Directus, including triggering builds, monitoring status, and troubleshooting with build logs.

**[← Back to Vercel Integration](/guides/integrations/vercel)**

## Working with Deployments

Once you've connected your Vercel projects, you can manage all deployment operations directly from the Directus Deployments module.

## TO DO
Binary file added public/img/vercel.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.