Skip to main content
Glama
stoichodimov

Supabase MCP Server

by stoichodimov
README.md
# Supabase MCP Server - Notes Application

## Description

A full-featured notes management application built with **Model Context Protocol (MCP)** integration and **Supabase** as the database backend. The application ensures secure user access with role-based isolation through combined protection at the application level (JWT) and database level (RLS policies).

## Features

### 🔐 Security

- **OAuth 2.0 Authentication** - supports Email/Password and GitHub login
- **JWT Token Validation** - protects MCP endpoints
- **Row Level Security (RLS)** - database policies for user data isolation
- **XSS Protection** - HTML escape functions in client code

### 📝 Functionality

- **CRUD Operations** - Create, read, update, and delete notes
- **User Association** - each note is linked to its creator
- **Responsive Interface** - optimized for all devices
- **User Management** - login, registration, and logout

### 🏗️ Architecture

- **Backend**: Node.js Express server with MCP integration
- **Frontend**: HTML/CSS/JavaScript without external dependencies
- **Database**: Supabase PostgreSQL
- **API**: RESTful MCP endpoints with JWT authentication

## Getting Started

### Prerequisites

- Node.js (v14+)
- Supabase project (https://supabase.com)
- Postman for API testing (optional)

### Installation

1. **Navigate to project directory:**

```bash
cd supabase-mcp-server
```

2. **Install dependencies:**

```bash
npm install
```

3. **Configure .env file:**

```bash
cp .env.example .env
```

Fill in the following values from your Supabase project:

```
SUPABASE_URL=https://your-project.supabase.co
SUPABASE_ANON_KEY=your-anon-key
PORT=3000
```

4. **Start the server:**

```bash
npm start
```

The server will start at `http://localhost:3000`

## Usage

### Frontend Application

1. Open `http://localhost:3000` in your browser
2. Choose a login option:
   - **Email/Password**: Enter your email and password
   - **GitHub**: Click the GitHub button
3. After login, you can:
   - **Create notes** - fill in title and content, click "Add"
   - **Edit notes** - click "Edit", make changes, click "Save"
   - **Delete notes** - click "Delete" and confirm

### MCP Endpoints (Postman)

The application provides MCP endpoints for CRUD operations:

**Postman Collection**: Open `postman_collection.json` in Postman

**Testing Steps:**

1. Log in to the frontend
2. Copy the JWT token (displayed in the application)
3. In Postman, go to **Collection Variables**
4. Paste the token in the `{{token}}` variable
5. Execute the requests

## Technical Details

**notes Table:**

```sql
CREATE TABLE notes (
  id BIGINT PRIMARY KEY GENERATED BY DEFAULT AS IDENTITY,
  user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE,
  title TEXT NOT NULL,
  content TEXT,
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
```

### RLS Policies

Four RLS policies protect data access:

| Policy                   | Operation | Condition              |
| ------------------------ | --------- | ---------------------- |
| `Users see own notes`    | SELECT    | `auth.uid() = user_id` |
| `Users insert own notes` | INSERT    | `auth.uid() = user_id` |
| `Users update own notes` | UPDATE    | `auth.uid() = user_id` |
| `Users delete own notes` | DELETE    | `auth.uid() = user_id` |

### Local Testing

1. Open two browser windows - one for each user
2. Log in with different accounts
3. Create notes in each account
4. Verify that each user sees only their own notes