From 0fa7277feb42f71f22d8d31350c009f849e6fb6b Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 13 Dec 2024 17:25:13 +0000
Subject: [PATCH 1/7] Added new side menu section and updated intro
---
docs/guides/introduction.mdx | 14 +++++++++++---
docs/mint.json | 4 ++++
2 files changed, 15 insertions(+), 3 deletions(-)
diff --git a/docs/guides/introduction.mdx b/docs/guides/introduction.mdx
index 51d58b0a49..2bce143633 100644
--- a/docs/guides/introduction.mdx
+++ b/docs/guides/introduction.mdx
@@ -33,16 +33,24 @@ Get set up fast using our detailed walk-through guides.
| [Using webhooks in Remix](/guides/frameworks/remix-webhooks) | Trigger tasks from a webhook in Remix |
| [Stripe webhooks](/guides/examples/stripe-webhook) | Trigger tasks from incoming Stripe webhook events |
+## Example projects
+
+Example projects are full projects with example repos you can fork and use. These are a great way of learning how to encorporate Trigger.dev into your project.
+
+| Example project | Description | Framework | GitHub Repo |
+| :-------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------- | :-------- | :------------------------------------------------------------------------- |
+| [Vercel AI SDK LLM evaluator with Realtime streaming](/guides/examples/vercel-ai-sdk-llm-evaluator) | A full-stack demo showing off Trigger.dev triggering from the frontend, Batch triggering and Realtime streams. | Next.js | [View the repo](https://github.com/triggerdotdev/batch-llm-evaluator) |
+| [Fal.ai with Realtime](/guides/examples/fal-ai-realtime) | Generate an image from a prompt using Fal.ai and show the progress of the task on the frontend using Realtime. | Next.js | [View the repo](https://github.com/triggerdotdev/nextjs-realtime-fal-demo) |
+| [Fal.ai image to cartoon](/guides/examples/fal-ai-image-to-cartoon) | Convert an image to a cartoon using Fal.ai, and upload the result to Cloudflare R2. | Next.js | Coming soon |
+
## Example tasks
-Tasks you can copy and paste to get started with Trigger.dev. They can all be extended and customized to fit your needs.
+Task code you can copy and paste to use in your project. They can all be extended and customized to fit your needs.
| Example task | Description |
| :---------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------- |
| [DALL·E 3 image generation](/guides/examples/dall-e3-generate-image) | Use OpenAI's GPT-4o and DALL·E 3 to generate an image and text. |
| [Deepgram audio transcription](/guides/examples/deepgram-transcribe-audio) | Transcribe audio using Deepgram's speech recognition API. |
-| [Fal.ai image to cartoon](/guides/examples/fal-ai-image-to-cartoon) | Convert an image to a cartoon using Fal.ai, and upload the result to Cloudflare R2. |
-| [Fal.ai with Realtime](/guides/examples/fal-ai-realtime) | Generate an image from a prompt using Fal.ai and show the progress of the task on the frontend using Realtime. |
| [FFmpeg video processing](/guides/examples/ffmpeg-video-processing) | Use FFmpeg to process a video in various ways and save it to Cloudflare R2. |
| [Firecrawl URL crawl](/guides/examples/firecrawl-url-crawl) | Learn how to use Firecrawl to crawl a URL and return LLM-ready markdown. |
| [LibreOffice PDF conversion](/guides/examples/libreoffice-pdf-conversion) | Convert a document to PDF using LibreOffice. |
diff --git a/docs/mint.json b/docs/mint.json
index 0154122ef1..73053dabe4 100644
--- a/docs/mint.json
+++ b/docs/mint.json
@@ -378,6 +378,10 @@
}
]
},
+ {
+ "group": "Example projects",
+ "pages": ["guides/examples/fal-ai-image-to-cartoon", "guides/examples/fal-ai-realtime"]
+ },
{
"group": "Example tasks",
"pages": [
From 039e703104e094b400bb9854fc33265cdc306c4d Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 13 Dec 2024 18:11:02 +0000
Subject: [PATCH 2/7] Updated the fal ai realtime project
---
docs/guides/examples/fal-ai-realtime.mdx | 38 ++++++++++++++++++++----
1 file changed, 32 insertions(+), 6 deletions(-)
diff --git a/docs/guides/examples/fal-ai-realtime.mdx b/docs/guides/examples/fal-ai-realtime.mdx
index 999ad6c438..a555b1ae9f 100644
--- a/docs/guides/examples/fal-ai-realtime.mdx
+++ b/docs/guides/examples/fal-ai-realtime.mdx
@@ -1,7 +1,7 @@
---
title: "Generate an image from a prompt using Fal.ai and Trigger.dev Realtime"
sidebarTitle: "Fal.ai with Realtime"
-description: "This example task generates an image from a prompt using Fal.ai and shows the progress of the task on the frontend using Trigger.dev Realtime."
+description: "This example project generates an image from a prompt using Fal.ai and shows the progress of the task on the frontend using Trigger.dev Realtime."
---
## Walkthrough
@@ -9,14 +9,40 @@ description: "This example task generates an image from a prompt using Fal.ai an
This video walks through the process of creating this task in a Next.js project.
-
+
-## Prerequisites
+## Tech stack
-- An existing project
-- A [Trigger.dev account](https://cloud.trigger.dev) with Trigger.dev [initialized in your project](/quick-start)
-- A [Fal.ai](https://fal.ai/) account
+- Next.js using the App Router for the frontend
+- Trigger tasks from the frontend using our [React hooks](/frontend/react-hooks)
+- [Trigger.dev Realtime](/realtime/overview) to stream updates to the frontend
+- [Trigger.dev](https://cloud.trigger.dev) for task processing
+- [Fal.ai](https://fal.ai/) for AI image generation
+- [Cloudflare R2](https://r2.cloudflarestorage.com/) for storing the generated image
+
+You will need all of these services to run this project.
+
+## GitHub Repo
+
+Check out and fork the full code in our [nextjs-realtime-fal-demo repo
+](https://github.com/triggerdotdev/nextjs-realtime-fal-demo).
+
+
+ To run the project and tasks locally, add your API keys to an `.env` file, and update the project
+ ID in the `trigger.config.ts` file to your project ID. To run the project in production, set the
+ `TRIGGER_API_KEY` environment variable to your project API key, and update the environment
+ variables in the Trigger.dev dashboard.
+
## Task code
From 008ab685f5328bddc7ec88fbf4385962b2d41226 Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 13 Dec 2024 18:14:44 +0000
Subject: [PATCH 3/7] Copy update
---
docs/guides/examples/fal-ai-realtime.mdx | 3 +--
1 file changed, 1 insertion(+), 2 deletions(-)
diff --git a/docs/guides/examples/fal-ai-realtime.mdx b/docs/guides/examples/fal-ai-realtime.mdx
index a555b1ae9f..ccaa431ca9 100644
--- a/docs/guides/examples/fal-ai-realtime.mdx
+++ b/docs/guides/examples/fal-ai-realtime.mdx
@@ -28,7 +28,6 @@ This video walks through the process of creating this task in a Next.js project.
- [Trigger.dev Realtime](/realtime/overview) to stream updates to the frontend
- [Trigger.dev](https://cloud.trigger.dev) for task processing
- [Fal.ai](https://fal.ai/) for AI image generation
-- [Cloudflare R2](https://r2.cloudflarestorage.com/) for storing the generated image
You will need all of these services to run this project.
@@ -46,7 +45,7 @@ Check out and fork the full code in our [nextjs-realtime-fal-demo repo
## Task code
-This task converts an image to a cartoon using fal AI, and uploads the result to Cloudflare R2.
+This task converts an image to a cartoon using fal AI.
```ts trigger/fal-ai-image-from-prompt-realtime.ts
import * as fal from "@fal-ai/serverless-client";
From a7acc433a08835f7a551a450f6c92e07748603a6 Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 3 Jan 2025 15:48:32 +0000
Subject: [PATCH 4/7] Added example project
---
.../example-projects/realtime-fal-ai.mdx | 40 ++++++++++++
docs/guides/introduction.mdx | 8 +--
docs/mint.json | 64 ++++---------------
3 files changed, 57 insertions(+), 55 deletions(-)
create mode 100644 docs/guides/example-projects/realtime-fal-ai.mdx
diff --git a/docs/guides/example-projects/realtime-fal-ai.mdx b/docs/guides/example-projects/realtime-fal-ai.mdx
new file mode 100644
index 0000000000..f35b0732d7
--- /dev/null
+++ b/docs/guides/example-projects/realtime-fal-ai.mdx
@@ -0,0 +1,40 @@
+---
+title: "Generate an image from a prompt using Fal.ai and Trigger.dev Realtime"
+sidebarTitle: "Realtime image gen with Fal.ai"
+description: "This example project generates an image from a prompt using Fal.ai and shows the progress of the task on the frontend using Trigger.dev Realtime."
+---
+
+## Overview
+
+This full stack Next.js project showcases the following:
+
+- A Trigger.dev task which [generates an image from a prompt using Fal.ai](https://github.com/triggerdotdev/examples/blob/main/realtime-fal-ai-image-generation/src/trigger/realtime-generate-image.ts)
+- When a [form is submitted](https://github.com/triggerdotdev/examples/blob/main/realtime-fal-ai-image-generation/src/app/page.tsx) in the UI, triggering the task using a [server action](https://github.com/triggerdotdev/examples/blob/main/realtime-fal-ai-image-generation/src/app/actions/process-image.ts)
+- Showing the [progress of the task](https://github.com/triggerdotdev/examples/blob/main/realtime-fal-ai-image-generation/src/app/processing/%5Bid%5D/ProcessingContent.tsx) on the frontend using Trigger.dev Realtime. This also includes error handling and a fallback UI
+- Once the task is completed, showing the generated image on the frontend next to the original image
+
+## Walkthrough
+
+This video walks through the process of creating this task in a Next.js project.
+
+
+
+
+
+
+ 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.
+
diff --git a/docs/guides/introduction.mdx b/docs/guides/introduction.mdx
index 2bce143633..9dd66e7997 100644
--- a/docs/guides/introduction.mdx
+++ b/docs/guides/introduction.mdx
@@ -37,11 +37,9 @@ Get set up fast using our detailed walk-through guides.
Example projects are full projects with example repos you can fork and use. These are a great way of learning how to encorporate Trigger.dev into your project.
-| Example project | Description | Framework | GitHub Repo |
-| :-------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------- | :-------- | :------------------------------------------------------------------------- |
-| [Vercel AI SDK LLM evaluator with Realtime streaming](/guides/examples/vercel-ai-sdk-llm-evaluator) | A full-stack demo showing off Trigger.dev triggering from the frontend, Batch triggering and Realtime streams. | Next.js | [View the repo](https://github.com/triggerdotdev/batch-llm-evaluator) |
-| [Fal.ai with Realtime](/guides/examples/fal-ai-realtime) | Generate an image from a prompt using Fal.ai and show the progress of the task on the frontend using Realtime. | Next.js | [View the repo](https://github.com/triggerdotdev/nextjs-realtime-fal-demo) |
-| [Fal.ai image to cartoon](/guides/examples/fal-ai-image-to-cartoon) | Convert an image to a cartoon using Fal.ai, and upload the result to Cloudflare R2. | Next.js | Coming soon |
+| Example project | Description | Framework | GitHub Repo |
+| :--------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------- | :-------- | :---------------------------------------------------------------------------------------------------- |
+| [Realtime Fal.ai image generation](/guides/example-projects/realtime-fal-ai) | Generate an image from a prompt using Fal.ai and show the progress of the task on the frontend using Realtime. | Next.js | [View the repo](https://github.com/triggerdotdev/examples/tree/main/realtime-fal-ai-image-generation) |
## Example tasks
diff --git a/docs/mint.json b/docs/mint.json
index 73053dabe4..0ebf027168 100644
--- a/docs/mint.json
+++ b/docs/mint.json
@@ -1,10 +1,7 @@
{
"$schema": "https://mintlify.com/schema.json",
"name": "Trigger.dev",
- "openapi": [
- "/openapi.yml",
- "/v3-openapi.yaml"
- ],
+ "openapi": ["/openapi.yml", "/v3-openapi.yaml"],
"api": {
"playground": {
"mode": "simple"
@@ -140,30 +137,20 @@
"pages": [
{
"group": "Tasks",
- "pages": [
- "tasks/overview",
- "tasks/schemaTask",
- "tasks/scheduled"
- ]
+ "pages": ["tasks/overview", "tasks/schemaTask", "tasks/scheduled"]
},
"triggering",
"runs",
"apikeys",
{
"group": "Configuration",
- "pages": [
- "config/config-file",
- "config/extensions/overview"
- ]
+ "pages": ["config/config-file", "config/extensions/overview"]
}
]
},
{
"group": "Development",
- "pages": [
- "cli-dev",
- "run-tests"
- ]
+ "pages": ["cli-dev", "run-tests"]
},
{
"group": "Deployment",
@@ -173,9 +160,7 @@
"github-actions",
{
"group": "Deployment integrations",
- "pages": [
- "vercel-integration"
- ]
+ "pages": ["vercel-integration"]
}
]
},
@@ -187,13 +172,7 @@
"errors-retrying",
{
"group": "Wait",
- "pages": [
- "wait",
- "wait-for",
- "wait-until",
- "wait-for-event",
- "wait-for-request"
- ]
+ "pages": ["wait", "wait-for", "wait-until", "wait-for-event", "wait-for-request"]
},
"queue-concurrency",
"versioning",
@@ -238,10 +217,7 @@
"management/overview",
{
"group": "Tasks API",
- "pages": [
- "management/tasks/trigger",
- "management/tasks/batch-trigger"
- ]
+ "pages": ["management/tasks/trigger", "management/tasks/batch-trigger"]
},
{
"group": "Runs API",
@@ -280,9 +256,7 @@
},
{
"group": "Projects API",
- "pages": [
- "management/projects/runs"
- ]
+ "pages": ["management/projects/runs"]
}
]
},
@@ -328,17 +302,11 @@
},
{
"group": "Help",
- "pages": [
- "community",
- "help-slack",
- "help-email"
- ]
+ "pages": ["community", "help-slack", "help-email"]
},
{
"group": "",
- "pages": [
- "guides/introduction"
- ]
+ "pages": ["guides/introduction"]
},
{
"group": "Frameworks",
@@ -380,7 +348,7 @@
},
{
"group": "Example projects",
- "pages": ["guides/examples/fal-ai-image-to-cartoon", "guides/examples/fal-ai-realtime"]
+ "pages": ["guides/example-projects/realtime-fal-ai"]
},
{
"group": "Example tasks",
@@ -408,15 +376,11 @@
},
{
"group": "Dashboard",
- "pages": [
- "guides/dashboard/creating-a-project"
- ]
+ "pages": ["guides/dashboard/creating-a-project"]
},
{
"group": "Migrations",
- "pages": [
- "guides/use-cases/upgrading-from-v2"
- ]
+ "pages": ["guides/use-cases/upgrading-from-v2"]
}
],
"footerSocials": {
@@ -424,4 +388,4 @@
"github": "https://github.com/triggerdotdev",
"linkedin": "https://www.linkedin.com/company/triggerdotdev"
}
-}
\ No newline at end of file
+}
From 13e3ec48e5a49a152452ca67dd5b5b7ba4abe6cb Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 3 Jan 2025 19:25:23 +0000
Subject: [PATCH 5/7] Swapped walkthrough and repo
---
.../example-projects/realtime-fal-ai.mdx | 22 ++++++++++---------
1 file changed, 12 insertions(+), 10 deletions(-)
diff --git a/docs/guides/example-projects/realtime-fal-ai.mdx b/docs/guides/example-projects/realtime-fal-ai.mdx
index f35b0732d7..7c156276b2 100644
--- a/docs/guides/example-projects/realtime-fal-ai.mdx
+++ b/docs/guides/example-projects/realtime-fal-ai.mdx
@@ -13,7 +13,18 @@ This full stack Next.js project showcases the following:
- Showing the [progress of the task](https://github.com/triggerdotdev/examples/blob/main/realtime-fal-ai-image-generation/src/app/processing/%5Bid%5D/ProcessingContent.tsx) on the frontend using Trigger.dev Realtime. This also includes error handling and a fallback UI
- Once the task is completed, showing the generated image on the frontend next to the original image
-## Walkthrough
+## GitHub 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.
+
+
+## Walkthrough video
This video walks through the process of creating this task in a Next.js project.
@@ -29,12 +40,3 @@ This video walks through the process of creating this task in a Next.js project.
allowfullscreen
/>
-
-
- 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.
-
From d50d4f41d1b4b4f9f428866508cfe6936b63ce45 Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 3 Jan 2025 19:32:34 +0000
Subject: [PATCH 6/7] Restore original fal task page
---
docs/guides/examples/fal-ai-realtime.mdx | 28 +++++-------------------
1 file changed, 6 insertions(+), 22 deletions(-)
diff --git a/docs/guides/examples/fal-ai-realtime.mdx b/docs/guides/examples/fal-ai-realtime.mdx
index ccaa431ca9..2314f4d7cb 100644
--- a/docs/guides/examples/fal-ai-realtime.mdx
+++ b/docs/guides/examples/fal-ai-realtime.mdx
@@ -1,7 +1,7 @@
---
title: "Generate an image from a prompt using Fal.ai and Trigger.dev Realtime"
sidebarTitle: "Fal.ai with Realtime"
-description: "This example project generates an image from a prompt using Fal.ai and shows the progress of the task on the frontend using Trigger.dev Realtime."
+description: "This example task generates an image from a prompt using Fal.ai and shows the progress of the task on the frontend using Trigger.dev Realtime."
---
## Walkthrough
@@ -21,31 +21,15 @@ This video walks through the process of creating this task in a Next.js project.
/>
-## Tech stack
+## Prerequisites
-- Next.js using the App Router for the frontend
-- Trigger tasks from the frontend using our [React hooks](/frontend/react-hooks)
-- [Trigger.dev Realtime](/realtime/overview) to stream updates to the frontend
-- [Trigger.dev](https://cloud.trigger.dev) for task processing
-- [Fal.ai](https://fal.ai/) for AI image generation
-
-You will need all of these services to run this project.
-
-## GitHub Repo
-
-Check out and fork the full code in our [nextjs-realtime-fal-demo repo
-](https://github.com/triggerdotdev/nextjs-realtime-fal-demo).
-
-
- To run the project and tasks locally, add your API keys to an `.env` file, and update the project
- ID in the `trigger.config.ts` file to your project ID. To run the project in production, set the
- `TRIGGER_API_KEY` environment variable to your project API key, and update the environment
- variables in the Trigger.dev dashboard.
-
+- An existing project
+- A [Trigger.dev account](https://cloud.trigger.dev) with Trigger.dev [initialized in your project](/quick-start)
+- A [Fal.ai](https://fal.ai/) account
## Task code
-This task converts an image to a cartoon using fal AI.
+This task generates an image from a prompt using Fal.ai.
```ts trigger/fal-ai-image-from-prompt-realtime.ts
import * as fal from "@fal-ai/serverless-client";
From c11c8a404928234b2547669b9b3f6044c5c2fc86 Mon Sep 17 00:00:00 2001
From: D-K-P <8297864+D-K-P@users.noreply.github.com>
Date: Fri, 3 Jan 2025 19:36:04 +0000
Subject: [PATCH 7/7] Added links back to the intro
---
docs/guides/introduction.mdx | 2 ++
1 file changed, 2 insertions(+)
diff --git a/docs/guides/introduction.mdx b/docs/guides/introduction.mdx
index 9dd66e7997..5ed3e4d4de 100644
--- a/docs/guides/introduction.mdx
+++ b/docs/guides/introduction.mdx
@@ -49,6 +49,8 @@ Task code you can copy and paste to use in your project. They can all be extende
| :---------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------- |
| [DALL·E 3 image generation](/guides/examples/dall-e3-generate-image) | Use OpenAI's GPT-4o and DALL·E 3 to generate an image and text. |
| [Deepgram audio transcription](/guides/examples/deepgram-transcribe-audio) | Transcribe audio using Deepgram's speech recognition API. |
+| [Fal.ai image to cartoon](/guides/examples/fal-ai-image-to-cartoon) | Convert an image to a cartoon using Fal.ai, and upload the result to Cloudflare R2. |
+| [Fal.ai with Realtime](/guides/examples/fal-ai-realtime) | Generate an image from a prompt using Fal.ai and show the progress of the task on the frontend using Realtime. |
| [FFmpeg video processing](/guides/examples/ffmpeg-video-processing) | Use FFmpeg to process a video in various ways and save it to Cloudflare R2. |
| [Firecrawl URL crawl](/guides/examples/firecrawl-url-crawl) | Learn how to use Firecrawl to crawl a URL and return LLM-ready markdown. |
| [LibreOffice PDF conversion](/guides/examples/libreoffice-pdf-conversion) | Convert a document to PDF using LibreOffice. |