Minimal Integrations Hub starter built with Nuxt and Vercel Connect. Connect third-party tools via OAuth, see their status, and verify each integration with a one-click test. No provider secrets in your environment.
Includes GitHub and Linear out of the box.
Deploy to Vercel, then attach your Connectors in the project settings or via the CLI (see Setup below).
npx giget@latest gh:vercel-labs/nuxt-connect-starter my-connect-app
cd my-connect-app
pnpm installOr clone directly:
git clone https://github.com/vercel-labs/nuxt-connect-starter.git
cd nuxt-connect-starter
pnpm install- A Vercel account
- The Vercel CLI
- Node.js 22+
- pnpm
vercel link
vercel env pullCreate and attach the two connectors:
# Linear (Custom OAuth). UID is mcp.linear.app/<name>
vercel connect create mcp.linear.app --name linear
vercel connect attach mcp.linear.app/linear
# GitHub: create the managed connector in the Vercel dashboard, then attach
vercel connect attach github/nuxt-connect-starterRun vercel connect list to confirm connector UIDs, then update the connector field in server/connectors.ts if yours differ:
connector: 'github/nuxt-connect-starter', // GitHub
connector: 'mcp.linear.app/linear', // LinearOptional canonical URL in production:
NUXT_PUBLIC_SITE_URL=https://your-app.vercel.appStart the dev server:
pnpm devOpen the hub, click Connect on each card, then Test to verify the integration works.
| Area | Description |
|---|---|
| Integrations hub | Connect, status, test, and revoke for each connector |
| Config registry | One entry in server/connectors.ts = one card in the UI |
| Connect wrapper | @vercel/connect helpers in server/utils/connect.ts |
| Demo user id | Anonymous cookie in server/utils/user.ts (swap for real auth) |
app/
├── pages/index.vue
├── composables/ # useConnectors, useConnector, useSite
├── components/ # ConnectorCard, BrandMark, HowItWorks, ...
└── utils/connector.ts
shared/
├── types/connector.ts
└── utils/status.ts
server/
├── connectors.ts # registry
├── api/ # connectors, connect, revoke, test
└── utils/ # connect wrapper, user cookie, linear-mcp
- Create and attach the connector with
vercel connect create/vercel connect attach - Append one object to
server/connectors.tswith the correctconnectorUID and atest.run()function
The UI and API routes iterate the registry automatically.
Connections persist in Vercel Connect. Your app only needs a stable user id to mint fresh tokens at runtime. You do not store OAuth refresh tokens in your database.
User connects → Connect stores the grant keyed by (connector, subject.id)
Later → getToken() returns a short-lived token (refresh is automatic)
Replace the anonymous cookie in server/utils/user.ts with your authenticated user id, then reuse the pattern from server/api/test.post.ts:
const token = await mintUserToken(connector, userId, status.installationId)
await createLinearIssue(token, body)See CONTRIBUTING.md for local development and SECURITY.md for vulnerability reporting.
Published under the MIT license.
Made by @HugoRCD and contributors.