https://github.com/zebbern/vscode_template
Portable VS Code template for AI-assisted development with Claude models - featuring custom agents, MCP servers, prompt files, and Agent Skills
https://github.com/zebbern/vscode_template
Last synced: about 1 month ago
JSON representation
Portable VS Code template for AI-assisted development with Claude models - featuring custom agents, MCP servers, prompt files, and Agent Skills
- Host: GitHub
- URL: https://github.com/zebbern/vscode_template
- Owner: zebbern
- Created: 2026-01-01T20:12:32.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2026-01-07T04:22:57.000Z (7 months ago)
- Last Synced: 2026-04-26T04:31:43.821Z (3 months ago)
- Size: 37.1 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Agents: AGENTS.md
Awesome Lists containing this project
README
# VS Code + Claude Skills Template
A portable template workspace for VS Code with Claude models, featuring skills, custom agents, MCP integration, and prompt files for consistent AI-assisted development.
---
## 🚀 Setup Guide
### Prerequisites
- **Node.js 18+** - Required for MCP servers (`node --version`)
- **VS Code 1.107+** - Download from [code.visualstudio.com](https://code.visualstudio.com/)
- **VS Code Insiders** - Required for Agent Skills (preview feature)
- **GitHub Copilot** - Subscription with Claude Opus 4.5 model access
- **GitHub Personal Access Token** - Create at [github.com/settings/tokens](https://github.com/settings/tokens)
### Step 1: Copy Template Files
```bash
# Copy to your project
cp -r .github/ your-project/.github/
cp -r .vscode/ your-project/.vscode/
cp AGENTS.md your-project/
```
### Step 2: Install MCP Server Dependencies
```bash
# Pre-install MCP servers for faster startup (optional but recommended)
npm install -g @upstash/context7-mcp@latest
npm install -g @modelcontextprotocol/server-github
npm install -g @modelcontextprotocol/server-filesystem
npm install -g @playwright/mcp@latest
npm install -g @modelcontextprotocol/server-sequential-thinking
npm install -g @modelcontextprotocol/server-memory
```
### Step 3: Configure GitHub Token
1. Create a token at [github.com/settings/tokens](https://github.com/settings/tokens)
2. Select scopes: `repo`, `read:user`, `read:org`
3. VS Code will prompt for the token on first MCP server start
### Step 4: Open in VS Code & Verify
1. Open your project in VS Code
2. Open Chat (`Ctrl+Alt+I` / `Cmd+Alt+I`)
3. Click the **Tools** icon and verify MCP servers are listed
4. Send this initialization message:
```
I'm starting a new session. Please confirm you understand:
1. You have access to custom agents: @plan, @implement, @debug, @code-reviewer
2. Skills are loaded from .github/skills/ when relevant
3. MCP servers are available: context7, github, filesystem, playwright, sequentialThinking, memory
4. Follow the coding guidelines in .github/copilot-instructions.md
5. Use TDD, create plans before implementation, verify before claiming completion
Briefly confirm your understanding and list available tools.
```
---
## Features
### Custom Agents
| Agent | Purpose | When to Use |
| ---------------- | ---------------------------- | --------------------------------------- |
| `@plan` | Read-only planning | Creating implementation plans, research |
| `@implement` | Full implementation with TDD | Writing code, executing plans |
| `@debug` | Systematic debugging | Investigating bugs, test failures |
| `@code-reviewer` | Code quality review | Reviewing completed work |
### Prompt Commands
| Command | Description |
| --------------- | ----------------------------------- |
| `/brainstorm` | Start collaborative design session |
| `/write-plan` | Create detailed implementation plan |
| `/execute-plan` | Execute an existing plan with TDD |
| `/code-review` | Request thorough code review |
| `/debug` | Start systematic debugging |
| `/test` | Create tests using TDD |
### Agent Skills
Skills are automatically loaded when relevant:
- **brainstorming**: Explore requirements before implementation
- **writing-plans**: Create bite-sized task plans
- **executing-plans**: Follow plans with verification
- **test-driven-development**: Red-Green-Refactor cycle
- **systematic-debugging**: Root cause analysis
- **verification-before-completion**: Evidence before claims
- **subagent-driven-development**: Parallel task execution with reviews
### Conditional Instructions
Language-specific guidelines applied automatically:
- `**/*.py` → Python best practices
- `**/*.ts` → TypeScript guidelines
- `**/*.js` → JavaScript standards
- `**/test*/**` → Testing practices
### MCP Servers
Pre-configured high-impact MCP servers:
| Server | Purpose | Key Capabilities |
| ----------------------- | --------------------- | --------------------------------------- |
| **Context7** | Library docs | Real-time documentation for any library |
| **GitHub** | Repository management | Issues, PRs, branches, code search |
| **Filesystem** | File operations | Read/write files, directory trees |
| **Playwright** | Browser automation | Testing, screenshots, web scraping |
| **Sequential Thinking** | Enhanced reasoning | Step-by-step problem solving |
| **Memory** | Persistent memory | Knowledge graph across sessions |
Additional tools available via VS Code extensions:
- **Pylance MCP** - Python analysis and refactoring
- **Terminal Tools** - Named terminals, command management
- **Microsoft Docs** - Azure/Microsoft documentation
## File Structure
```
.github/
├── copilot-instructions.md # Base coding guidelines (always applied)
├── agents/ # Custom agents
│ ├── plan.agent.md
│ ├── implement.agent.md
│ ├── debug.agent.md
│ └── code-reviewer.agent.md
├── skills/ # Agent Skills (auto-loaded)
│ ├── brainstorming/SKILL.md
│ ├── writing-plans/SKILL.md
│ ├── executing-plans/SKILL.md
│ ├── test-driven-development/SKILL.md
│ └── ...
├── prompts/ # Reusable prompts
│ ├── brainstorm.prompt.md
│ ├── write-plan.prompt.md
│ ├── execute-plan.prompt.md
│ └── ...
└── instructions/ # Conditional instructions
├── python.instructions.md
├── typescript.instructions.md
└── ...
.vscode/
├── settings.json # VS Code configuration
└── mcp.json # MCP server configuration
AGENTS.md # Cross-agent compatibility
```
## Development Workflow
### For New Features
1. **Brainstorm** → `/brainstorm` or `@plan`
- Explore requirements
- Design before coding
2. **Plan** → `/write-plan`
- Create detailed implementation plan
- Save to `docs/plans/`
3. **Execute** → `/execute-plan` or `@implement`
- Follow plan with TDD
- Commit after each task
4. **Review** → `/code-review` or `@code-reviewer`
- Verify quality and plan alignment
### For Bug Fixes
1. **Debug** → `/debug` or `@debug`
- Systematic root cause analysis
- NO fixes without understanding
2. **Test** → Create regression test
- Write test that demonstrates bug
- Verify it fails
3. **Fix** → Minimal fix to pass test
- TDD Red-Green-Refactor
4. **Verify** → Run all tests
- Ensure no regressions
## Customization
### Add Language-Specific Instructions
Create `.github/instructions/.instructions.md`:
```markdown
---
applyTo: "**/*."
description: Language-specific guidelines
---
# Your Guidelines Here
```
### Add Custom Prompts
Create `.github/prompts/.prompt.md`:
```markdown
---
name: my-prompt
description: What this prompt does
agent: plan # or implement, debug, code-reviewer
tools: ["search", "fetch"]
---
# Prompt Instructions
```
### Add MCP Servers
Edit `.vscode/mcp.json` to add new servers.
## Requirements
| Requirement | Version | Notes |
| ---------------- | ------- | ----------------------------------- |
| Node.js | 18+ | Required for MCP servers |
| VS Code | 1.107+ | Custom agents, MCP support |
| VS Code Insiders | Latest | Required for Agent Skills (preview) |
| GitHub Copilot | Active | With Claude Opus 4.5 model access |
## Research Sources
This template follows the latest 2025 best practices from:
- [VS Code Copilot Customization](https://code.visualstudio.com/docs/copilot/customization/overview)
- [Agent Skills Standard](https://agentskills.io/) - Open standard for portable skills
- [Custom Agents](https://code.visualstudio.com/docs/copilot/customization/custom-agents)
- [GitHub Copilot Instructions](https://docs.github.com/en/copilot/customizing-copilot/adding-repository-custom-instructions-for-github-copilot)
- [awesome-copilot](https://github.com/github/awesome-copilot) - Community examples