Inngest Workflow Kit

You can deploy this template directly to Vercel. Follow these steps for a cloud deployment:

1. Deployment

Use the Vercel deployment button provided in the repository to clone and deploy the project.

2. Inngest Integration

Navigate to the Inngest Vercel Integration page and link your Vercel application with Inngest to ensure workflows are triggered correctly.

3. Environment Variables

Ensure the following variables are configured in your Vercel project settings:

• OPENAI_API_KEY: Your OpenAI API key.
• NEXT_PUBLIC_SUPABASE_URL: Your Supabase project URL.
• NEXT_PUBLIC_SUPABASE_ANON_KEY: Your Supabase anon key.

4. Database Setup

Follow the same Supabase setup as the local installation:

1. Create a Supabase project.
2. Run examples/nextjs-blog-cms/supabase/schema.sql in the Supabase SQL Editor.
3. Run examples/nextjs-blog-cms/supabase/seed.sql in the Supabase SQL Editor.

To run the Next.js blog back-office demo locally, follow these steps to clone, install, and configure the environment.

1. Clone and Install

Navigate to the example directory and install dependencies using your preferred package manager:

git clone
cd examples/nextjs-blog-cms
npm i
# or
yarn
# or
pnpm --ignore-workspace i

2. Environment Configuration

Copy .env.example to .env.local and provide your OPENAI_API_KEY.

3. Database Setup (Supabase)

You must set up a Supabase project to store blog posts and workflows:

1. Create a new project in the Supabase Dashboard.
2. Update .env.local with NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_ANON_KEY.
3. In the Supabase SQL Editor, run the contents of examples/nextjs-blog-cms/supabase/schema.sql.
4. In the Supabase SQL Editor, create a new snippet and run the contents of examples/nextjs-blog-cms/supabase/seed.sql.
5. Verify that the blog_posts and workflows tables exist in the Table Editor.

4. Running the Application

Start the Next.js application:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Then, start the Inngest Dev Server in a separate terminal to monitor workflows:

npx inngest-cli@latest dev

Access the app at http://localhost:3000 and the Inngest Dev Server at http://localhost:8288.

git clone
cd examples/nextjs-blog-cms
npm i

# Start Next.js
npm run dev

# Start Inngest Dev Server
npx inngest-cli@latest dev

The demo includes pre-configured automations and a UI to modify them.

Modifying an Automation

1. Navigate to the automation tab in the application.
2. Click Configure on an existing automation (e.g., "When a blog post is moved to review").
3. Use the + icon on existing nodes (like blog-post.updated) to add new steps.
4. Select steps from the right-side panel, such as "Add a Table of Contents" or "Perform a grammar review".
5. Add an "Apply changes after approval" step as the final node.
6. Click Save changes.

Triggering and Reviewing Workflows

1. Navigate to the blog posts page.
2. Click Send to review on a draft post.
3. Monitor the workflow execution in real-time via the Inngest Dev Server or Inngest Platform.
4. Once the workflow pauses for approval, return to the app. The post will have a "Needs approval" status.
5. Use the tabs to compare the Original post with the AI revision.
6. Click Approve suggestions & Publish to complete the workflow and set the post status to "Published".