Example projects
Vercel AI SDK image generator
This example Next.js project uses the Vercel AI SDK to generate images from a prompt.
Overview
This demo is a full stack example that uses the following:- A Next.js app using shadcn for the UI
- Our ‘useRealtimeRun’ React hook to subscribe to the run and show updates on the frontend
- The Vercel AI SDK to generate images using OpenAI’s DALL-E models
GitHub repo
View the Vercel AI SDK image generator repo
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.
Video
Relevant code
- View the Trigger.dev task code which generates the image using the Vercel AI SDK in src/trigger/realtime-generate-image.ts.
- We use a useRealtimeRun hook to subscribe to the run in src/app/processing/[id]/ProcessingContent.tsx.
Learn more about Trigger.dev Realtime
To learn more, take a look at the following resources:- Trigger.dev Realtime - learn more about how to subscribe to runs and get real-time updates
- Realtime streaming - learn more about streaming data from your tasks
- Batch Triggering - learn more about how to trigger tasks in batches
- React hooks - learn more about using React hooks to interact with the Trigger.dev API