Optimal Developer Setup

Build the same AI-powered environment that built Ignite — $1.77 for an entire desktop app. OpenCode TUI, Superpowers skills, MCP servers, and 53 community skills working together.

Why this setup matters

This exact configuration built Ignite — 4.6K lines of code across Go and TypeScript, 38 commits, a full desktop app with streaming LLM chat, SQLite history, 4 providers, template engine, settings, and native macOS integration — for just $1.77. Without it, the same project would cost $50-115 on premium AI providers or 1-2 weeks of developer time. The 5-layer efficiency stack (OpenCode → Superpowers → DCP → Skills → MCPs) makes the difference.

1. Install OpenCode CLI

OpenCode is the agent harness that runs everything. Install globally:

npm install -g opencode

Configuration lives at ~/.config/opencode/opencode.jsonc. This file controls plugins, MCP servers, and provider settings.

OpenCode on GitHub ↗ · opencode.ai ↗

2. Configure Plugins

Add these four plugins. Each provides a specific optimization layer. Paste this into your opencode.jsonc:

{
  "plugin": [
    "@mohak34/opencode-notifier@latest",
    "@tarquinen/opencode-dcp@latest",
    "@franlol/opencode-md-table-formatter@latest",
    "superpowers@git+https://github.com/obra/superpowers.git"
  ]
}
PluginWhat it doesResource
superpowersWorkflow discipline — brainstorm→plan→subagent pipeline, 1% rule, 14 built-in skillsGitHub ↗
opencode-dcpDynamic Context Pruning — compresses stale conversation, keeps live context ~25%npm ↗
opencode-notifierDesktop notifications when subagents complete — zero token costnpm ↗
opencode-md-table-formatterAuto-formats markdown tables — prevents agent re-read loopsnpm ↗

3. Add MCP Servers

MCP servers provide structured tool access — browser automation, GitHub API, web search, Next.js diagnostics. They return parsed, structured output instead of raw HTML/logs, saving thousands of tokens per invocation.

"mcp": {
  "chrome-devtools": {
    "type": "local",
    "command": ["npx", "-y", "chrome-devtools-mcp@latest"]
  },
  "github": {
    "type": "remote",
    "url": "https://api.githubcopilot.com/mcp/",
    "headers": {
      "Authorization": "Bearer {file:~/.config/opencode/.secrets/github-pat}"
    }
  },
  "next-devtools": {
    "type": "local",
    "command": ["npx", "-y", "next-devtools-mcp@latest"]
  },
  "exa": {
    "type": "remote",
    "url": "https://mcp.exa.ai/mcp"
  }
}
MCP ServerWhat it providesResource
Chrome DevToolsBrowser automation: screenshots, clicks, perf traces, Lighthouse auditsnpm ↗
GitHubRepos, PRs, commits, issues, code search — authenticated via PATGitHub ↗
Next.js DevToolsRuntime introspection: routes, errors, build status, cachenpm ↗
Exa AIWeb search with clean markdown output — no HTML/JS/CSS payloadexa.ai ↗

Store your GitHub Personal Access Token at ~/.config/opencode/.secrets/github-pat. The {file:...} directive tells OpenCode to read it from disk — never put tokens directly in config files.

4. Superpowers Skills (14 built-in)

The Superpowers plugin includes 14 skills that enforce a disciplined workflow. They are auto-loaded — no manual install needed once the plugin is configured in Step 2.

SkillPurpose
brainstorming ↗Design refinement via Socratic dialogue — hard gate before any code
writing-plans ↗Bite-sized implementation plans (2-5 min per step), zero placeholders
subagent-driven-development ↗Fresh subagent per task, 2-stage review, isolated context
executing-plans ↗Batch execution with human checkpoints
test-driven-development ↗Red-Green-Refactor cycle enforcement
systematic-debugging ↗4-phase root cause analysis (reproduce → isolate → identify → fix)
requesting-code-review ↗Pre-review checklist + reviewer dispatch template
receiving-code-review ↗Technical rigor when processing feedback
using-git-worktrees ↗Parallel isolated development branches
finishing-a-development-branch ↗Merge/PR/cleanup decisions after implementation
dispatching-parallel-agents ↗Concurrrent subagent workflows for independent tasks
verification-before-completion ↗Evidence before assertions — run commands, confirm output
writing-skills ↗Meta-skill for creating new agent skills
using-superpowers ↗Bootstrap skill — 1% rule, red flags, platform adaptation

5. Community Skills (53 via agentskill.sh)

Install via /learn @author/skill-name in OpenCode. Each skill listed with its agentskill.sh ↗ link. Some links may 404 if the author or skill name differs — search agentskill.sh directly to find the exact listing.

SkillDomain
dmux-workflows ↗Multi-agent orchestration via tmux panes, cross-harness coordination
error-handling ↗Robust error handling — typed errors, boundaries, retries, circuit breakers
git-workflow ↗Branching strategies, merge vs rebase, conflict resolution
motion-advanced ↗Drag-drop, gestures, text animations, SVG path drawing, useAnimate
motion-foundations ↗Motion tokens, spring presets, performance rules for React/Next.js
mysql-patterns ↗Schema, query, indexing, transaction, replication patterns for production
nextjs-turbopack ↗Incremental bundling, FS caching, Turbopack vs webpack
repo-scan ↗Repository scanning for structure, dependencies, and patterns
learn ↗Search/install/update/rate skills from agentskill.sh (100K+ catalog)
review-skill ↗Audit SKILL.md files against best practices + 10 quality dimensions
documentation ↗Technical writing — API docs, architecture docs, operational runbooks
nextjs-app-router ↗File-system routing, Layouts, Route Groups, App Router patterns
bash-linux ↗Bash patterns — critical commands, piping, error handling, scripting
backend-patterns ↗API design, database optimization, Node.js/Express/Next.js patterns
coding-standards ↗Universal TS/JS/React/Node.js best practices and patterns
code-simplifier ↗Refinement for clarity, consistency, maintainability — preserves functionality
conversation-memory ↗Persistent memory systems — short-term, long-term, entity-based
create-plan ↗Concise implementation plans from specifications
database-schema-designer ↗Scalable schema design — normalization, indexing, migration, constraints
javascript-pro ↗Modern JS/ES6+, async patterns, Node.js APIs, event loops
nextjs-app-router-patterns ↗Comprehensive Next.js 14+ Server Components, full-stack React
PocketBase SDK ↗JavaScript SDK for PocketBase — CRUD, auth, realtime, file handling
readme-v2 ↗Comprehensive README generator workflow
git ↗Epicenter conventions for commits, branches, standalone commit checking
sveltekit ↗SvelteKit routing, load functions, form actions, hooks, env
excalidraw-diagram-generator ↗Flowcharts, mind maps, architecture diagrams from natural language
refactor ↗Surgical refactoring — extract functions, rename, break down god functions
sql-optimization ↗Query tuning, indexing strategies, performance analysis (all SQL dialects)
llm-wiki ↗Persistent knowledge base (Obsidian) — incremental ingestion, entity tracking
golang ↗Idiomatic Go — concurrency patterns, interface design, testing, HTTP servers
IaC Security Scanning ↗Terraform/CloudFormation/K8s security scanning (Checkov, tfsec, KICS)
javascript-testing ↗Vitest/Jest testing with mocking, component testing, coverage
ascii-art ↗Pyfiglet, cowsay, boxes, image-to-ascii generation
technical-writer ↗Technical writing assistance for documentation and guides
get-chat-history ↗Retrieve current chat history including user messages and task notifications
release-notes ↗User-facing summaries from tickets, PRDs, changelogs
sql-queries ↗Natural language → SQL for BigQuery, PostgreSQL, MySQL
agent-refinement ↗Agent skill refinement workflow
coverage-guard ↗Coverage enforcement and test quality monitoring
ask-questions-if-underspecified ↗Clarify requirements before implementing
baseline-ui ↗Animation duration validation, typography scale, component accessibility
filesystem-context ↗File-based context management, dynamic discovery, context bloat prevention
landing-page-generator ↗High-converting Next.js/React landing pages with Tailwind CSS
networkx ↗Complex network/graph creation, manipulation, and analysis in Python
project-development ↗Task-LLM fit recognition, pipeline architecture, structured output
react-component-performance ↗Diagnose slow React components, targeted performance fixes
site-architecture ↗Website hierarchy, navigation, URL patterns, breadcrumbs, linking
skill-router ↗Targeted questioning to recommend the best skill for a goal
mvp ↗Minimal viable product — manual first, then processized, then automated
code-review-excellence ↗Constructive feedback practices, bug catching, knowledge sharing
debugging-strategies ↗Systematic debugging, profiling tools, root cause analysis
parallel-debugging ↗Competing hypotheses, parallel investigation, evidence arbitration
web-component-design ↗React, Vue, Svelte component patterns — CSS-in-JS, composition strategies

6. Provider Setup

Models cached locally in SQLite, refreshed every 15 minutes. Configure your API key once.

ProviderPricing (per 1M tokens)API key setup
DeepSeek V4 Pro$0.435 input / $0.87 output / $0.0036 cache-hitDeepSeek Platform ↗
DeepSeek V4 Flash$0.14 input / $0.28 output / $0.0028 cache-hitDeepSeek Platform ↗
OpenCode GoSubscription-basedopencode.ai ↗
OpenCode ZenSubscription-basedopencode.ai ↗

DeepSeek V4 Pro delivered Ignite for $1.77 with 75% permanent discount and prompt caching (99.7% savings on cached prefixes). DeepSeek API Pricing Docs ↗

7. Token Efficiency Explained

This setup reduced Ignite's build cost from an estimated $50-115 (on GPT-4o or similar premium model) to $1.77. Here's how each layer contributes:

LayerWhat it doesImpact
Prompt cachingSystem prompt + skill definitions (~120K tokens) cached at $0.0036/M — 99.7% cheaper than cache-miss-$50/session
DCP (Context Pruning)Compresses resolved conversation into dense summaries, keeps live context at ~62K of 249K window-81% context growth
Subagent isolationEach task gets a fresh subagent with only the task brief — no cross-task context pollutionPrevents context bloat
Workflow disciplineBrainstorm → plan → subagent. Prevents unstructured exploration (the most expensive waste)-40-60% token waste
Structured MCP outputClean JSON/markdown from tools instead of raw HTML/logs. Exa, Chrome DevTools, GitHub all return parsed dataThousands saved/call
Skill on-demand loading67 skills contribute ~105K to system cache, but only ~2K loaded per task — rest never enters contextEfficient scaling

8. Putting It Together — Sample Workflow

Here's a real workflow using this setup to build a new project:

  1. Start a new project — Open OpenCode in your project directory
  2. Brainstorm — The Superpowers skill kicks in automatically. Answer questions one at a time until the design is approved.
  3. Write a plan — A bite-sized implementation plan (17 tasks) is generated with exact file paths, code, and verification steps.
  4. Dispatch subagents — One fresh subagent per task. Each starts with only the task brief — zero context from previous tasks.
  5. Review each task — After each subagent finishes, a reviewer checks spec compliance + code quality.
  6. Push to GitHub — When all tasks pass review, commit and push. Done.

For Ignite specifically, this workflow produced 38 commits across 17 tasks in a single session — from empty directory to shipped .app bundle — for $1.77.

Pro Tips

  • Use cheap models for mechanical tasks. Save DeepSeek V4 Pro for architecture, review, and debugging. Use DeepSeek Flash for single-file edits and boilerplate.
  • Keep the pipeline tight. Don't skip brainstorm (the most expensive waste is building the wrong thing). Don't skip plan (ambiguity causes subagent re-dispatches).
  • Watch your context. If live tokens exceed 30%, DCP needs tuning. If they grow fast, your agents are holding too much state.
  • Pin your versions. Plugins, MCPs, and skills all evolve. Pin them in your config for reproducibility across your team.
  • Install all skills upfront. The 67 skills are cached as a system prompt prefix — installing them costs nothing in ongoing token usage since they sit in cache.