Meme generator with human-in-the-loop approval

Overview

This demo is a full stack example that uses the following:

• A Next.js app, with an endpoint for approving the generated memes
• Trigger.dev tasks to generate the images and orchestrate the waitpoint workflow
• OpenAI DALL-E 3 for generating the images
• A Slack app for the human-in-the-loop step, with the approval buttons linked to the endpoint

GitHub repo

<Card title="View the meme generator human-in-the-loop example repo" icon="GitHub" href="https://github.com/triggerdotdev/examples/tree/main/meme-generator-human-in-the-loop"

Click here to view the full code for this project in our examples repository on GitHub. You can fork it and use it as a starting point for your own project. </Card>

Post to Slack

Relevant code

• Meme generator task:

  • The memegenerator.ts task:
    • Generates two meme variants using DALL-E 3
    • Uses batchTriggerAndWait to generate multiple meme variants simultaneously (this is because you can only generate 1 image at a time with DALL-E 3)
    • Creates a waitpoint token
    • Sends the generated images with approval buttons to Slack for review
    • Handles the approval workflow

• Approval Endpoint:

  • The waitpoint approval handling is in page.tsx, which processes:
    • User selections from Slack buttons
    • Waitpoint completion with the chosen meme variant
    • Success/failure feedback to the approver

Learn more

To learn more, take a look at the following resources:

• Waitpoint tokens - learn about waitpoint tokens in Trigger.dev and human-in-the-loop flows
• OpenAI DALL-E API - learn about the DALL-E image generation API
• Next.js Documentation - learn about Next.js features and API
• Slack Incoming Webhooks - learn about integrating with Slack