How to deploy the LangGraph AI Agent Boilerplate

The LangGraph AI Agent Boilerplate contains the configurations for creating intelligent, real-time agents that can query and interact with data stored in an Azion SQL Database, delivering optimized performance and reduced latency for your applications.

This template is built to leverage Azion’s robust distributed infrastructure, ensuring scalability, security, and seamless integration with SQL Database.

The deployment of this template will create an SQL Database with two tables: one for conversation history and another for reference documents. It also creates a backend application developed with LangGraph for document management and agent functionality, and a Vue-based frontend for user interaction.

This template uses Vue version 3.3.4.

Requirements

• A GitHub account to connect with Azion and create your new repository.
  • Every push will be automatically deployed to this repository to keep your project updated.
• An OpenAI API Key.
• This template uses Application Accelerator, Functions, and SQL Database, and it may generate usage-related costs. Check the pricing page for more information.

Deploying the template

You can obtain and configure your template through the Azion Console. To easily deploy it on Azion, select the button below.

Setting up the template

In the configuration form, you must provide the information to configure your application. Fill in the presented fields.

Fields identified with an asterisk are mandatory.

During the deployment, you’ll be able to follow the process through a window showing the logs. When it’s complete, the page shows information about the application and some options to continue your journey.

Managing the template

Setting up the database

This template creates two tables in the database, one for conversation history and another for reference documents. To start using your own documents, you must set up the database by following these steps:

1. Access the GitHub repository for the backend application created during the deployment. Its name will be similar to <your-agent-name>-backend-agent.

2. You must have a .env file with your environment variables in it. If you want to create a new one, it must follow the structure below:

   Shell

   01AZION_TOKEN="azion_token"

   02OPENAI_API_KEY="your_openai_key"

   03OPENAI_MODEL= 'gpt-4o'

   04EMBEDDING_MODEL= 'text-embedding-3-small'

   05

   06# EdgeSQL database and table names. Usually, table names are not changed,

   07# and the database name is the name of your agent + database: agent_name_database

   08MESSAGE_STORE_DB_NAME="yourdb-database"

   09MESSAGE_STORE_TABLE_NAME='messages'

   10VECTOR_STORE_DB_NAME="yourdb-database"

   11VECTOR_STORE_TABLE_NAME='vectors'

   12

   13# Optional: Langsmith to trace the requests and responses

   14LANGSMITH_API_KEY=

   15LANGCHAIN_PROJECT=

   16LANGCHAIN_TRACING_V2=false

   17

   18# Optional: Clerk authentication with your frontend

   19CLERK_PUBLISHABLE_KEY=

   20CLERK_SECRET_KEY=

   Note that not all environment variables are required. Check details on the table below.

   Environment variable	Description	Required
   AZION_TOKEN	The token for authenticating with Azion’s platform.	Yes
   OPENAI_API_KEY	Your API key for accessing OpenAI services.	Yes
   OPENAI_MODEL	The OpenAI model to be used for processing. If not set, defaults to gpt-4o.	No
   EMBEDDING_MODEL	The model used for generating embeddings. If not set, defaults to text-embedding-3-small. To use a different model, you must create a database with columns configured for the same model.	No
   LANGSMITH_API_KEY	API key for accessing Langsmith services.	No
   LANGCHAIN_PROJECT	The Langchain project identifier.	No
   LANGCHAIN_TRACING_V2	Enables or disables Langchain tracing (set to true or false).	No
   MESSAGE_STORE_DB_NAME	The database name for storing conversation history messages. By default, it is the same as the database for the documents. Default name: <agent-name>-database.	Yes
   MESSAGE_STORE_TABLE_NAME	The table name within the messages database for storing the conversation history. Default name: messages.	Yes
   VECTOR_STORE_DB_NAME	The database name for storing your documents as vector embeddings. By default, it is the same as the database for the messages. Default name: <agent-name>-database.	Yes
   VECTOR_STORE_TABLE_NAME	The table name within the documents database for storing embeddings. Default name: vectors.	Yes

   You can use the Azion EdgeSQL Shell to interact with your databases. This shell provides a command-line interface that allows you to better visualize your databases and tables and execute SQL commands directly from the terminal. It’s also possible to interact with your databases through the Azion API.

3. Go to the project’s migrations folder and run the vector database setup with:

   yarn setup

   • The project uses two main files to configure and initialize the databases:

     • Vector Database (RAG)

       • The file migrations/setupDatabase.ts is responsible for:
         • Configuring the vector database using AzionVectorStore.initialize()
         • Creating the vectors table with the appropriate embedding column (e.g., F32_BLOB(1536) when EMBEDDING_MODEL=text-embedding-3-small)

     • Message Database (Tracing)

       • The file src/services/edgeSqlTracerService.ts automatically manages:
         • The creation of the message database (if it doesn’t exist)
         • The creation of the messages table using the DDL generated by createSetupTableStatement()
         • Configuration is done on demand through the handleErrors method

   The file migrations/uploadDocs.ts only inserts documents into existing databases, so it’s necessary to run the setup before uploading documents.

   You can edit these files to customize the database configuration according to your specific needs.

   • Available Configuration Methods

     • The project offers two approaches to configure the vector database in the migrations/setupDatabase.ts file:

       • Active Method (in use)

         AzionVectorStore.initialize(embeddingModel, { dbName, tableName }, { mode: "hybrid", columns: ["*"] })

       • Alternative Method (commented)

         TypeScript

         01// const vectorStore = new AzionVectorStore(...);

         02// await vectorStore.setupDatabase({ mode: "hybrid", columns: ["*"] });

   Make sure to run yarn setup before the first upload to ensure the vector database is correctly configured.

4. To add your own documents to the RAG system:

   • Place your document files in the folder migrations/files/. The system supports the following formats: PDF, Markdown (.md), Text (.txt), JSON.

   • If the ‘files’ folder does not exist yet, create it.

   • How It Works:

     • The file migrations/uploadDocs.ts processes documents through the function getDocsFromFolder("migrations/files"), which:
       • Reads all supported files from the specified folder
       • Splits the content into smaller chunks
       • Inserts the chunks into the vector store for semantic search

   • Customizing the Path

     • If you prefer to use a different folder for your documents, edit the file migrations/uploadDocs.ts and change the argument of the getDocsFromFolder() function:
     TypeScript

     01// Example: changing to a custom folder

     02const docs = await getDocsFromFolder("my-custom-folder");

   • Uploading Documents

     • After adding your files, execute:
     yarn upload-docs

The database with reference documents is now ready and available for your application to access it. Read the template documentation for more details on how to configure the project.

Managing the application

Considering that this initial setup may not be optimal for your specific application, all settings can be customized any time you need by using the Azion Console.

To manage and edit your application’s settings, follow these steps:

After selecting the application you’ll work on, you’ll be directed to a page containing all the settings you can configure.

Adding a custom domain

The application created during the deployment has an assigned Azion Workload domain to make it accessible through the browser. The domain has the following format: xxxxxxxxxx.map.azionedge.net/. However, you can add a custom domain for users to access your application through it.

For more information, refer to Add a custom domain to a workload.