🎵 Welcome to your Langchain MCP Spotify Chatbot Project!

This repository is a demo project showing how to build a chat agent with MCP-Builder.ai and LangChain.

It integrates with Spotify API features to showcase conversational AI capabilities. The project is split into two parts:

• Backend: A FastAPI + LangChain + MCP-powered agent.
• Frontend: A Lovable-generated chatbot UI

📖 For more details and step-by-step guides, check out the related blog post:

• Build an AI Agent connected with any API using LangChain MCP & Python

📌 Project Info

• Backend:

  • Built with FastAPI
  • Uses LangChain, LangGraph, and MCP tools
  • Provides /chat API for handling conversations
  • Manages chat history per user
  • Configurable via .env file (OPENAI_KEY, MCP_TOKEN, SSE_URL)

• Frontend:

  • Generated with Lovable
  • Connects directly to the backend

⚙️ Backend Setup (FastAPI + MCP Agent)

Requirements

• Python 3.10+
• Virtual environment recommended

Install dependencies

# Step 1: Clone the repository
git clone <YOUR_GIT_URL>
cd <YOUR_PROJECT_NAME>

# Step 2: Create & activate a virtual environment
python -m venv venv
source venv/bin/activate   # On Windows: venv\Scripts\activate

# Step 3: Install backend dependencies
pip install -r requirements.txt

Environment variables

Create a .env file in the project root:

OPENAI_KEY=your-openai-api-key
MCP_TOKEN=your-mcp-token
SSE_URL=http://localhost:8080/sse (Your MCP server URL)

Run the backend

uvicorn server:app --host 0.0.0.0 --port 8000 --reload

The backend will be available at: http://localhost:8000

💻 Frontend Setup (Lovable Chatbot)

The frontend was generated using Lovable.

Follow these steps:

# Step 1: Clone the repository using the project's Git URL.
git clone <YOUR_GIT_URL>

# Step 2: Navigate to the project directory.
cd <YOUR_PROJECT_NAME>/frontend

# Step 3: Install the necessary dependencies.
npm i

# Step 4: Start the development server with auto-reloading and instant preview.
npm run dev

🚀 Development Workflow

• Backend changes → edit server.py and restart uvicorn.
• Frontend changes → edit files in /frontend and Lovable’s dev server hot-reloads.