# Inngest - 101

In the era of AI and bots, have you ever wondered how long-running tasks—like waiting for a response from an assistant—actually work behind the scenes? With a traditional HTTP request, this kind of interaction isn’t always feasible, since HTTP is typically short-lived and request–response based.

To support real-time, bi-directional communication, developers often rely on technologies like WebSockets.

This is where **Inngest** comes in.

## 1\. What is Inngest?

Inngest replaces traditional message queues (like RabbitMQ or SQS) and state management systems. It allows you to write plain functions in TypeScript, Python, or Go that are **durable**—meaning they can run for minutes, hours, or months, survive server restarts, and automatically retry on failure.

**Key Concepts**

* **Events:** Instead of calling a function directly, you "send" an event (like user.signup). Inngest then triggers any functions listening for that event.
    
* **Steps:** Functions are broken into atomic "steps" (step.run, step.sleep). If a function fails at step 3, Inngest knows to only retry step 3 without re-running steps 1 and 2.
    
* **Durable Execution:** Inngest handles the state and "waits" for you. For example, you can tell a function to step.sleep("wait-a-week", "7d"), and the function will pause and resume a week later.
    

## 2\. Core Features

* **Zero Infrastructure:** You don’t need to host a queue or a worker. Inngest calls your functions via a secure HTTPS webhook.
    
* **Flow Control:** Built-in support for **concurrency** (limit how many jobs run at once), **throttling** (limit throughput to third-party APIs), and **debouncing**.
    
* **Observability:** A built-in dashboard shows every event, every function run, and precisely where a workflow failed or is currently paused.
    
* **Local Development:** The **Inngest Dev Server** gives you a local UI to trigger events and visualize your functions as you write them.
    

You can read more about Inngest and it’s features from this document

%[https://www.inngest.com/] 

Now we will see how we can integrate inngest in Next.js application

## 3.Next.js Quick Start

Before we start ensure you have created a Next.js application using the below command

```bash
npx create-next-app@latest --ts --eslint --tailwind --src-dir --app --import-alias='@/*' inngest-guide
```

once done run the application using the command `npm run dev`

Now we will install the inngest. With the Next.js app now running open a new tab in your terminal. In your project directory's root, run the following command to install Inngest SDK:

```bash
npm install inngest
```

Now we will run the inngest server which is a fast, in-memory version of Inngest where we can quickly send and view events and function runs

```bash
npx --ignore-scripts=false inngest-cli@latest dev
```

In your browser open [http://localhost:8288](http://localhost:8288) to see the development UI where later you will test the functions you write:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769967306439/3bbd677c-f37f-4149-9bce-cc1f1825d075.png align="center")

### Create an Inngest Client

Inngest invokes your functions securely via an API endpoint at `/api/inngest`. To enable that, you will create an Inngest client in your Next.js project, which you will use to send events and create functions.

Make a new directory next to your app directory (for example, src/inngest) where you'll define your Inngest functions and the client.

In the /src/inngest directory create an Inngest client:

```typescript
import { Inngest } from "inngest";

// Create a client to send and receive events
export const inngest = new Inngest({ id: "my-app" });
```

Next, we will set up a route handler for the `/api/inngest` route. To do so, create a file inside your `app` directory (for example, at `src/app/api/inngest/route.ts`) with the following code:

```typescript
import { serve } from "inngest/next";
import { inngest } from "../../../inngest/client";

// Create an API that serves zero functions
export const { GET, POST, PUT } = serve({
  client: inngest,
  functions: [
    /* your functions will be passed here later! */
  ],
});
```

### Create your first Inngest Function

In this step, we will write our first reliable serverless function. This function will be triggered whenever a specific event occurs (in our case, it will be test/[hello.world](http://hello.world)). Then, it will sleep for a second and return a "Hello, World!".

Inside your `src/inngest` directory create a new file called `functions.ts` where you will define Inngest functions. Add the following code:

```typescript
import { inngest } from "./client";

export const helloWorld = inngest.createFunction(
  { id: "hello-world" },
  { event: "test/hello.world" },
  async ({ event, step }) => {
    await step.sleep("wait-a-moment", "1s");
    return { message: `Hello ${event.data.email}!` };
  },
);
```

Now we will add the function to `serve()`

Next, import your Inngest function in the routes handler (`src/app/api/inngest/route.ts`) and add it to the `serve` handler so Inngest can invoke it via HTTP:

```typescript
import { serve } from "inngest/next";
import { inngest } from "../../../inngest/client";
import { helloWorld } from "../../../inngest/functions";

export const { GET, POST, PUT } = serve({
  client: inngest,
  functions: [
    helloWorld, // <-- This is where you'll always add all your functions
  ],
});
```

## Trigger your function from the Inngest Dev Server UI

Inngest is powered by events.You will trigger your function in two ways: first, by invoking it directly from the Inngest Dev Server UI, and then by sending events from code.

With your Next.js app and Inngest Dev Server running, open the Inngest Dev Server UI and select the "Functions" tab [`http://localhost:8288/functions`](http://localhost:8288/functions). You should see your function. (Note: if you don't see any function, select the "Apps" tab to troubleshoot)

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769967718163/c017fb80-bf87-4fc7-bb28-033f53725692.png align="center")

To trigger your function, use the "Invoke" button for the associated function:

In the pop up editor, add your event payload data like the example below. This can be any JSON and you can use this data within your function's handler. Next, press the "Invoke Function" button:

```typescript
{
  "data": {
    "email": "test@example.com"
  }
}
```

The payload is sent to Inngest (which is running locally) which automatically executes your function in the background! You can see the new function run logged in the "Runs" tab:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769967870020/1736a8ac-5445-457f-902a-465e9959e100.png align="center")

When you click on the run, you will see more information about the event, such as which function was triggered, its payload, output, and timeline:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769967929418/5e7abaeb-2584-43ac-9141-f2866560765e.png align="center")

### Triggering from code

To trigger Inngest functions to run in the background, you will need to send events from your application to Inngest. Once the event is received, it will automatically invoke all functions that are configured to be triggered by it.

To send an event from your code, you can use the Inngest client's send() method.

```typescript
import { NextResponse } from "next/server";
import { inngest } from "../../../inngest/client"; // Import our client

// Opt out of caching; every request should send a new event
export const dynamic = "force-dynamic";

// Create a simple async Next.js API route handler
export async function GET() {
  // Send your event payload to Inngest
  await inngest.send({
    name: "test/hello.world",
    data: {
      email: "testUser@example.com",
    },
  });

  return NextResponse.json({ message: "Event sent!" });
}
```

Every time this API route is requested, an event is sent to Inngest. To test it, open [`http://localhost:3000/api/hello` (change your port if your Next](http://localhost:3000/api/hello).js app is running elsewhere). You should see the following output: `{"message":"Event sent!"}`

If you go back to the Inngest Dev Server, you will see a new run is triggered by this event:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769968090377/8e845141-aab2-4d8f-9a8b-9afdad086ed2.png align="center")

That’s it you have learned how to create Inngest functions and you have sent events to trigger those functions