# figma-mcp-server

This project runs a Model Context Protocol (MCP) server for Figma integration using the `figma-developer-mcp` package.

## Prerequisites
- Node.js v20 or higher
- A Figma Personal Access Token (API key)

## Installation

Install dependencies:

```sh
npm install
```

## Running the Server

### Option 1: Using Podman Compose 

This project includes containerization support using Red Hat Universal Base Image (UBI) for both Apple Silicon (ARM64) and Linux (AMD64) architectures.

#### Prerequisites
- Podman installed
- A Figma Personal Access Token (API key)

#### Steps
1. Create a `.env` file in the project root:
   ```
   FIGMA_API_KEY=your_figma_personal_access_token_here
   ```

2. Start the service:
   ```sh
   podman-compose up -d
   ```

3. Stop the service:
   ```sh
   podman-compose down
   ```

### Option 2: Using Podman Directly

#### Building the Container

##### Using the Build Script
```sh
./build-container.sh
```

##### Build with Podman
```sh
# For current architecture
podman build -t quay.io/balki404/figma-mcp-server:1.0 .

# For specific architecture
podman build --platform linux/amd64 -t fquay.io/balki404/figma-mcp-server:1.0-amd64 .
podman build --platform linux/arm64 -t quay.io/balki404/figma-mcp-server:1.0-arm64 .
```

#### Running the Container
```sh
# Run with environment variable
podman run -e FIGMA_API_KEY=your_figma_api_key_here quay.io/balki404/figma-mcp-server:1.0-arm64

# Run in detached mode with port mapping
podman run -d --name figma-mcp -p 3333:3333 -e FIGMA_API_KEY=your_figma_api_key_here quay.io/balki404/figma-mcp-server:1.0-arm64

# Run with restart policy and port mapping
podman run -d --restart=unless-stopped --name figma-mcp -p 3333:3333 -e FIGMA_API_KEY=your_figma_api_key_here quay.io/balki404/figma-mcp-server:1.0-arm64
```

### Option 3: Direct Node.js 

You can start the server directly with your Figma API key using the following command:

```sh
npx figma-developer-mcp --figma-api-key <YOUR_FIGMA_API_KEY>
```

Replace `<YOUR_FIGMA_API_KEY>` with your actual Figma Personal Access Token.

### Features
- **Environment-based configuration**: Easy API key management through environment variables
- **SSE endpoint**: Server-Sent Events available at `http://localhost:3333/sse`