> For the complete documentation index, see [llms.txt](https://lamatic.ai/llms.txt).

# Using Lamatic SDK with Next.js

This guide demonstrates how to integrate the Lamatic SDK with Next.js applications to execute flows.

## Setup

First, install the Lamatic SDK in your Next.js project:

```bash
npm install lamatic
```

## Environment Configuration

Create a `.env.local` file in your project root with your Lamatic credentials:

```
LAMATIC_PROJECT_ENDPOINT=your-project-endpoint
LAMATIC_FLOW_ID=your-flow-id
LAMATIC_PROJECT_ID=your-project-id
LAMATIC_PROJECT_API_KEY=your-project-api-key
```

## Basic Integration

### Create a Lamatic Client

Create a utility file to initialize the Lamatic client:

```tsx
// utils.ts

export const lamaticClient = new Lamatic({
    projectId: process.env.LAMATIC_PROJECT_ID,
    apiKey: process.env.LAMATIC_PROJECT_API_KEY,
    endpoint: process.env.LAMATIC_PROJECT_ENDPOINT,
  })
```

### Using the Client in a Next.js Component
Now, you can use the Lamatic client in your Next.js components to execute flows or agents.

<Tabs items={['Flow']}>
<Tab>
```tsx
// app.tsx

export default async function Page() {
  const executeFlow = async () => {
    const response = await lamaticClient.executeFlow(process.env.LAMATIC_FLOW_ID, {
      prompt: 'hello',
    })
    console.log(response)
  }

  return (
    <div>
      <button onClick={executeFlow}>Execute Flow</button>
    </div>
  )
}
```
</Tab>
</Tabs>

When the button is clicked, the component will execute the flow and log the response to the console.