mcp javascript typescript tutorial

MCP 101: Quickstart (JavaScript/TypeScript)

Get CodeMem running in your JS/TS project with a single command. A practical tutorial for developers who want AI memory without the complexity.

CodeMem Team

TL;DR: One Command Setup

If you're a JavaScript or TypeScript developer using Claude, you can add persistent memory to your AI assistant with a single command:

claude mcp add codemem --transport http --url https://app.codemem.dev/mcp

Claude opens a browser window where you enter your API key once. That's it—your Claude assistant now remembers everything across sessions. Let's dive deeper into what this enables.

What is MCP?

The Model Context Protocol (MCP) is an open standard that lets AI assistants connect to external tools and services. Think of it as USB for AI—a universal way to plug capabilities into your favorite AI coding assistant.

CodeMem uses MCP to give your AI persistent memory. Instead of repeating your preferences every session, your assistant remembers your coding style, project architecture, and team conventions.

Prerequisites

Before we start, make sure you have:

  • Claude CLI installed (npm install -g @anthropic-ai/claude-cli)
  • Node.js 18+ for your JS/TS projects
  • CodeMem API key from app.codemem.dev/dashboard

Step-by-Step Setup

1. Get Your API Key

Sign up at app.codemem.dev and grab your API key from the dashboard. Free tier includes 1,000 memories—plenty for personal projects.

2. Connect CodeMem to Claude

Run the setup command:

claude mcp add codemem --transport http --url https://app.codemem.dev/mcp

A browser window opens with a nice authorization page. Paste your API key (from step 1), click Authorize, and you're done. Claude will now have access to memory tools in every conversation.

3. Verify the Connection

Check that CodeMem is properly configured:

claude mcp list

You should see codemem in the list of active MCP servers.

Core Tools: add_memory & search_memory

CodeMem exposes two primary tools your AI assistant will use automatically:

add_memory

Stores information for future reference. The AI calls this when you say things like:

  • "Remember that this project uses ESM modules"
  • "Save that we use Vitest for testing"
  • "Note: always use async/await, never .then()"
// What the AI calls internally
add_memory({
  content: "Project uses ESM modules with .mjs extension",
  tags: ["config", "modules"],
  project: "my-ts-app"
})

search_memory

Retrieves relevant memories using semantic search. The AI automatically searches when context is needed:

// AI searching for relevant context
search_memory({
  query: "testing framework preferences",
  limit: 5
})

// Returns matching memories:
// → "We use Vitest for testing"
// → "Prefer integration tests over unit tests"
// → "Test files go in __tests__ folders"

Real-World Usage Examples

Example 1: Project Setup Preferences

You:

"Remember that for this project we use pnpm, TypeScript strict mode, and Prettier with single quotes"

Next time you ask Claude to create a config file, it'll use these preferences automatically.

Example 2: Architecture Decisions

You:

"Save this: We follow hexagonal architecture. Domain logic in /src/domain, adapters in /src/adapters, and ports as interfaces"

When you ask Claude to add a new feature, it'll structure the code correctly without you explaining the architecture again.

Example 3: Code Style

You:

"Note: I prefer explicit return types on all functions, and use 'type' over 'interface' unless extending"

Tips for JavaScript/TypeScript Developers

  • Use project tags: Prefix memories with project names to keep contexts separate
  • Store your tsconfig preferences: "strict", "moduleResolution", paths—save them once
  • Document error handling patterns: How you handle async errors, logging conventions
  • Save dependency decisions: Why you chose Zod over Joi, or Fastify over Express

Next Steps

You're all set! Here's how to go deeper:

Pro tip: The best way to use CodeMem is to just code naturally. When you catch yourself repeating something to your AI assistant, that's your cue to say "remember this." Over time, your AI becomes a true coding partner that knows your style.