Skip to main content

​
Contributing

First off, thank you for considering contributing to MCPJam Inspector! It’s people like you that make the open source community such a great place.

​
Finding an issue to work on

  1. You can find things to work on in our issues tab.
  2. Look for issues labelled good first issue and very easy. These are great starter tasks that are low commitment
  3. Once you find an issue you like to work on, comment on the issue and tag @matteo8p. Then assign yourself the issue. This helps avoid multiple contributors working on the same issue.

​
Getting Started

Before you get started, please consider giving the project a star ⭐. It helps grow the project and gives your contributions more recognition. Also join our Discord channel. That’s where the community and other open source contributors communicate on.

​
Prerequisites

Make sure to have the following:
  • Node.js (LTS version recommended)
  • npm (comes with Node.js)

​
Fork, Clone, and Branch

  1. Fork the repository on GitHub.
  2. Clone your fork locally: 
    git clone https://github.com/YOUR_USERNAME/inspector.git
cd inspector
  3. Create a new branch for your changes: 
    git checkout -b my-feature-branch

​
Setup

Install the dependencies for all workspaces: 
npm install

​
Development

To run the client and server in development mode with hot-reloading, use: 
npm run dev
This runs:
  • Client: Vite dev server on :8080
  • Server: Hono dev server on :3000
For Windows users, there’s a specific script: 
npm run dev:windows

​
Electron Development

To run the Electron app in development mode: 
npm run electron:dev
This runs:
  • Electron main process
  • Embedded Hono server
  • Vite dev server for renderer

​
Building the Project

To build all parts of the project (client, server, and SDK), run: 
npm run build
npm run start // starts the build
You can also build each part individually:
  • npm run build:client - Build React frontend
  • npm run build:server - Build Hono backend
  • npm run build:sdk - Build MCP SDK wrapper

​
Code Style

We use Prettier to maintain a consistent code style. Before you commit your changes, please format your code by running: 
npm run prettier-fix

​
Commit Messages

We follow the Conventional Commits specification. This helps us automate changelog generation and keep the commit history clean and readable. Your commit messages should be structured as follows: 
<type>[optional scope]: <description>

[optional body]

[optional footer(s)]
Example: feat(client): add new button to the main component fix(server): resolve issue with API endpoint

​
Getting Help

Thank you for your contribution!
⌘I