← Back to directory
L

LangGraph.js AI Agent Template

Community
Production-ready Next.js + LangGraph.js template with dynamic MCP tool loading and human-in-the-loop approval
GitHub source repository ↗
★ 130 Stars Category · Other Popular Source revision 2ed0c99b1af1
51FMRS · D
Reliability
5/20
Security and permissions
12/20
Maintenance
11/20
Documentation
14/20
Setup experience
9/20

This repository is a full-featured LangGraph.js + Next.js agent template whose value is acting as an MCP client host that dynamically connects to external tool servers, rather than being an MCP server that can itself be added to a client. No server manifest or self-exposed tool list is provided in the README, so tools and transport fields are left empty; this assessment is based solely on the public documentation and described functionality.

Read the FMRS scoring method →

This is an open-source Next.js full-stack template (agentailor/fullstack-langgraph-nextjs-agent) for building AI agents on LangGraph.js. It is not itself an MCP server exposing tools — it is an MCP client/host application: users can add stdio or HTTP MCP servers (e.g. the official filesystem server) through its settings UI, and the app loads, prefixes, and invokes those external tools on the agent's behalf. It also provides human-in-the-loop tool call approval, PostgreSQL-backed persistent conversation memory, S3/MinIO multimodal file uploads, real-time SSE streaming, and optional Langfuse observability. Built with TypeScript, React 19, Next.js, Prisma, and Tailwind CSS, licensed under MIT, and maintained by an individual developer (agentailor/IBJunior) — not an official LangChain or MCP protocol project.

Tools

The tool list has not been reviewed yet.

Setup

  1. git clone the repository and run pnpm install. 2. Copy .env.example to .env.local and set DATABASE_URL plus at least one model provider API key (OpenAI/Google/Anthropic). 3. Run docker compose up -d to start PostgreSQL and MinIO. 4. Run pnpm prisma:generate and pnpm prisma:migrate to set up the database. 5. Run pnpm dev and open http://localhost:3000. 6. To connect external tools, use 'Add MCP Server' in the settings UI to configure a stdio command or an HTTP MCP server URL.

Fit and risk

Best for

  • Teams comfortable with TypeScript/Next.js who want to build their own agent product on top of this scaffold
  • Developers evaluating or demoing MCP dynamic tool loading and human-in-the-loop approval patterns
  • Deployments with existing PostgreSQL/Docker infrastructure willing to self-host a full stack app

Not for

  • Users who just want to plug a single 'tool server' into Claude Desktop or another MCP client — this project is not that kind of drop-in MCP server
  • Users unwilling to operate a database, object storage, and a full front/back-end stack themselves
  • Use cases requiring official LangChain- or MCP-protocol-team maintenance and support guarantees

Required permissions

  • Database read/write access (PostgreSQL) for conversation history and stored MCP server configs
  • Object storage read/write access (S3-compatible storage / MinIO) for file uploads
  • Outbound network access to call OpenAI/Google/Anthropic model APIs
  • Ability to execute local commands or reach remote HTTP endpoints as configured by the user when they register stdio/HTTP MCP servers

Risks and side effects

  • Users can register arbitrary stdio commands as MCP servers via the settings UI; trusting an unverified command can lead to local command execution
  • An optional 'auto-approval' mode skips the human-in-the-loop review of tool calls, amplifying the impact of mistaken or malicious tool invocations
  • API keys and database connection strings are stored as environment variables and must be protected (`.env.local`)
  • The app exposes an OpenAPI explorer at `/api-docs`, so production access controls should be reviewed

Troubleshooting

  1. Verify `DATABASE_URL` and the chosen model provider's API key are set correctly in `.env.local`
  2. Confirm `docker compose up -d` was run and the PostgreSQL/MinIO containers are healthy
  3. For database errors, check that `pnpm prisma:generate` and `pnpm prisma:migrate` have been run
  4. If using Langfuse observability, verify `LANGFUSE_ENABLED` and related env vars per docs/OBSERVABILITY.md
  5. If adding an MCP server fails, double-check the stdio command/args or the HTTP MCP server URL and auth headers

Use cases

Standing up a full-featured LangGraph.js AI agent with a chat UI quickly
Dynamically wiring multiple third-party MCP tool servers into an agent without code changes
Automation workflows that require human approval before executing risky tool calls
Chat applications needing persistent multi-turn memory and file/image uploads

Supported clients

Supported clients have not been confirmed yet.