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:

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:

// utils.ts
import { Lamatic } from 'lamatic'
 
export const lamaticClient = new Lamatic({
    projectId: process.env.LAMATIC_PROJECT_ID,
    apiKey: process.env.LAMATIC_API_KEY,
  })

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.

// app.tsx
import { lamaticClient } from './utils'
 
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>
  )
}

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