Step Into Vision MCP Server

Step Into Vision MCP Server

Provides AI assistants with access to visionOS development articles from stepinto.vision, enabling browsing, retrieving, and searching content with AI-ready formats.

Category
Visit Server

README

Step Into Vision MCP Server

A TypeScript-powered MCP (Model Context Protocol) server that makes Step Into Vision's visionOS development content accessible to AI assistants. Serves both REST API and MCP endpoints from a unified codebase.

What it does: Fetches articles from https://stepinto.vision, converts them to AI-ready formats, and provides MCP tools/resources plus a REST API for easy access to visionOS development content.

Quick Start

1. Prerequisites

  • Node.js 18+ and npm 10+
  • (Optional) Cloudflare account for production deployment

2. Install & Run Locally

git clone <repository>
cd stepintovision.ai
npm install

# Fetch latest content from Step Into Vision
npm run ingest

# Start local development server
npm run dev

Visit http://localhost:8787 - serves both REST API and MCP endpoints.

3. Use with Claude Desktop

Add to your claude_desktop_config.json:

{
  "mcp_servers": {
    "stepIntoVision": {
      "url": "http://localhost:8787/mcp"
    }
  }
}

What You Get

MCP Tools & Resources

  • listStepIntoVisionPosts - Browse articles with filters
  • getStepIntoVisionPost - Retrieve specific articles
  • searchStepIntoVisionPosts - Full-text search
  • stepIntoVisionPost resources - AI-ready markdown content
  • stepIntoVisionPostMeta resources - Structured metadata

REST API Endpoints

  • GET / - Service metadata
  • GET /posts - Paginated article listings
  • GET /posts/:slug - Individual article (JSON/Markdown)
  • GET /search?q=query - Keyword search
  • POST /mcp - Model Context Protocol endpoint

Deployment Options

Option 1: Local Development (Recommended for testing)

npm run dev  # http://localhost:8787

Option 2: Cloudflare Workers (Production)

Important: Cloudflare Workers Free tier has ~10ms CPU limit, so ingestion is disabled by default.

Step 1: Generate catalog locally

npm run ingest  # Creates data/stepintovision.json

Step 2: Upload to Cloudflare KV

npx wrangler kv key put catalog.json \
  --binding=STEPINTOVISION_CATALOG_KV \
  --path=data/stepintovision.json \
  --remote

Step 3: Deploy worker

npm run build
npx wrangler deploy

Alternative: Environment Variable (No KV needed)

wrangler secret put STEPINTOVISION_CATALOG < data/stepintovision.json

Option 3: Self-hosted (Node.js)

Build and run the Node.js server anywhere:

npm run build
npm start

Content Updates

Manual Updates (Recommended)

# 1. Fetch new content
npm run ingest

# 2. Upload to Cloudflare (if using Workers)
npx wrangler kv key put catalog.json --binding=STEPINTOVISION_CATALOG_KV --path=data/stepintovision.json --remote

# 3. Deploy worker (if needed)
npx wrangler deploy

Automatic Updates (Advanced)

Set STEPINTOVISION_ALLOW_WORKER_INGEST=true environment variable to enable worker-side ingestion (requires paid Cloudflare plan for sufficient CPU time).

CLI Options

Ingestion Control

# Basic ingestion
npm run ingest

# Custom options
npm run ingest -- --max-pages 10
npm run ingest -- --modified-after 2025-11-01
npm run ingest -- --output custom.json

Development

npm run dev          # Start dev server
npm run test         # Run tests
npm run check        # Format & lint
npm run build        # Build for production

MCP Client Integration

Direct HTTP Clients

[mcp_servers.stepIntoVision]
url = "http://localhost:8787/mcp"

STDIO Clients (via mcp-remote)

npx -y mcp-remote http://localhost:8787/mcp

Project Structure

src/
├── app.ts           # Shared Hono application factory
├── index.ts         # Local Node.js entrypoint
├── worker.ts        # Cloudflare Workers entrypoint
├── lib/             # Core business logic
│   ├── mcp.ts       # MCP server implementation
│   ├── catalog/     # Catalog loading strategies
│   └── wordpress.ts # WordPress ingestion
├── cli/
│   └── ingest.ts    # Content ingestion CLI

Troubleshooting

Common Issues

Q: Content isn't updating

# Solution: Manual ingestion and upload
npm run ingest
npx wrangler kv key put catalog.json --binding=STEPINTOVISION_CATALOG_KV --path=data/stepintovision.json --remote
npx wrangler deploy

Q: Worker ingestion is disabled

This is intentional! Free tier Workers have 10ms CPU limits. Use manual ingestion workflow above.

Q: TypeScript build errors

npm run check  # Auto-fixes formatting issues
npm run build  # Verify compilation

Q: Local server not loading content

# Ensure catalog exists locally
npm run ingest
npm run dev

Environment Variables

Variable Default Description
STEPINTOVISION_ALLOW_WORKER_INGEST false Enable worker-side ingestion (requires paid plan)
STEPINTOVISION_CATALOG - Fallback catalog JSON (environment binding)
STEPINTOVISION_CATALOG_KV - KV namespace binding for catalog storage

Architecture Highlights

  • Dual Interface: Same codebase serves REST API + MCP
  • Content Processing: HTML → Markdown + AI-ready metadata
  • Search: Fuse.js-powered fuzzy search
  • Flexible Storage: File-based, KV, or environment variables
  • Type Safety: Full TypeScript with Zod validation
  • Performance Optimized: Content digests, caching, efficient indexing

License

All rights reserved. Step Into Vision content remains the property of its respective creators.

Recommended Servers

playwright-mcp

playwright-mcp

A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.

Official
Featured
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.

Official
Featured
Local
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.

Official
Featured
Local
TypeScript
VeyraX MCP

VeyraX MCP

Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.

Official
Featured
Local
graphlit-mcp-server

graphlit-mcp-server

The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.

Official
Featured
TypeScript
Kagi MCP Server

Kagi MCP Server

An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.

Official
Featured
Python
E2B

E2B

Using MCP to run code via e2b.

Official
Featured
Neon Database

Neon Database

MCP server for interacting with Neon Management API and databases

Official
Featured
Qdrant Server

Qdrant Server

This repository is an example of how to create a MCP server for Qdrant, a vector search engine.

Official
Featured
Exa Search

Exa Search

A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.

Official
Featured