diff --git a/.claude/commands/setup-firecrawl.md b/.claude/commands/setup-firecrawl.md new file mode 100644 index 00000000..73fe505f --- /dev/null +++ b/.claude/commands/setup-firecrawl.md @@ -0,0 +1,305 @@ +--- +name: setup-firecrawl +description: Interactive setup wizard for Firecrawl web scraping scripts +allowed-tools: [Read, Write, Bash, AskUserQuestion] +argument-hint: + "(optional) skip steps with 'quick' if you already have API key configured" +--- + +# Firecrawl Setup Wizard + +This command guides you through setting up Firecrawl for web scraping, enabling +you to save articles, documentation, and web content directly to your vault as +clean, searchable markdown. + +## Task + +Set up Firecrawl web scraping by: + +1. Explaining the benefits of Firecrawl for research workflows +2. Getting a Firecrawl API key (300 free credits to start) +3. Configuring the FIRECRAWL_API_KEY environment variable +4. Understanding the available scripts (single and batch scraping) +5. Testing with a sample scrape +6. Showing example research workflows + +## Process + +### 1. Welcome & Explain Benefits + +Start by explaining what Firecrawl enables: + +**The Research Game-Changer:** Instead of Claude reading webpages and +summarizing (losing details), Firecrawl saves the FULL text as markdown in your +vault. This means: + +- **Permanent archive**: Articles stay in your vault forever +- **Full context**: Complete text, not summaries +- **Searchable**: Find anything across thousands of saved articles +- **No limits**: Build a massive research library without context limits +- **Clean format**: Beautiful markdown, not messy HTML + +**Perfect for:** + +- Research projects (save all related articles) +- Documentation archives (keep important guides) +- Knowledge bases (build your own reference library) +- Reading lists (save now, read later) +- Academic research (preserve sources) + +### 2. Prerequisites Check + +Verify required tools are installed: + +```bash +curl --version # Should be installed +jq --version # Should be installed (for JSON parsing) +``` + +If jq is missing: + +- **macOS**: `brew install jq` +- **Linux**: `apt-get install jq` or `yum install jq` +- **Windows**: Use WSL or Git Bash + +### 3. Get Firecrawl API Key + +Ask: "Do you already have a Firecrawl API key? (yes/no)" + +If no: + +1. Direct them to: https://firecrawl.dev +2. Explain: + - Sign up for free account + - Get 300 free credits to start + - Open-source project, can self-host if needed +3. Guide to dashboard: "Go to your dashboard and copy your API key (starts with + 'fc-...')" +4. Wait for them to confirm they have the key + +If yes: + +1. Check if it's already in their environment: `echo $FIRECRAWL_API_KEY` +2. If not set, ask them to provide it + +### 4. Configure Environment Variable + +Detect their shell: + +```bash +echo $SHELL +``` + +Based on the shell, add the API key to the appropriate config file: + +**For zsh** (.zshrc): + +```bash +echo 'export FIRECRAWL_API_KEY="fc-their-actual-key"' >> ~/.zshrc +source ~/.zshrc +``` + +**For bash** (.bashrc or .bash_profile): + +```bash +echo 'export FIRECRAWL_API_KEY="fc-their-actual-key"' >> ~/.bashrc +source ~/.bashrc +``` + +Verify it's set: + +```bash +echo $FIRECRAWL_API_KEY +``` + +### 5. Explain Available Scripts + +There are two scraping scripts in `.scripts/`: + +#### firecrawl-scrape.sh (Single URL) + +For scraping one URL at a time with control over the filename: + +```bash +# Basic usage +.scripts/firecrawl-scrape.sh "https://example.com/article" "00_Inbox/Clippings/article-name.md" + +# You choose the filename +.scripts/firecrawl-scrape.sh "https://blog.com/post" "03_Resources/Articles/my-note.md" +``` + +#### firecrawl-batch.sh (Multiple URLs) + +For scraping multiple URLs at once with auto-generated filenames: + +```bash +# Default: saves to 00_Inbox/Clippings/ +.scripts/firecrawl-batch.sh "https://url1.com" "https://url2.com" "https://url3.com" + +# Custom output directory +.scripts/firecrawl-batch.sh -o "01_Projects/Research/" "https://url1.com" "https://url2.com" +.scripts/firecrawl-batch.sh --output-dir "03_Resources/Articles/" "https://url1.com" +``` + +### 6. Create Necessary Folders + +Make sure the default Clippings folder exists: + +```bash +mkdir -p 00_Inbox/Clippings +``` + +### 7. Test Connection + +Perform a test scrape to verify everything works: + +Ask: "Would you like to test with a sample article? (yes/no)" + +If yes: + +```bash +.scripts/firecrawl-scrape.sh "https://example.com" "00_Inbox/test-scrape.md" +``` + +Check the output: + +- Look for: "✓ Scraped content saved to: 00_Inbox/test-scrape.md" +- Verify the file has content: `wc -l 00_Inbox/test-scrape.md` +- Show first few lines: `head -20 00_Inbox/test-scrape.md` + +If successful, offer to delete test file: + +```bash +rm 00_Inbox/test-scrape.md +``` + +### 8. Show Research Workflows + +#### Workflow 1: Save Single Article + +```bash +# User says: "Save this article to my vault: https://blog.example.com/great-post" +# You run: +.scripts/firecrawl-scrape.sh "https://blog.example.com/great-post" "00_Inbox/Clippings/great-post.md" +``` + +#### Workflow 2: Batch Research Collection + +```bash +# User provides list of research URLs +# You run: +.scripts/firecrawl-batch.sh -o "01_Projects/AI-Research/" \ + "https://paper1.com" \ + "https://paper2.com" \ + "https://paper3.com" +``` + +#### Workflow 3: Build Reference Library + +```bash +# Save documentation and tutorials to Resources +.scripts/firecrawl-batch.sh -o "03_Resources/Tech-Docs/" \ + "https://docs.example.com/guide1" \ + "https://docs.example.com/guide2" +``` + +#### Workflow 4: Reading List + +```bash +# Quickly save interesting articles to read later +.scripts/firecrawl-batch.sh \ + "https://article1.com" \ + "https://article2.com" \ + "https://article3.com" +# All saved to 00_Inbox/Clippings/ for later processing +``` + +### 9. Usage Tips + +**Best Practices:** + +1. **Organize as you save**: Use meaningful filenames and folders +2. **Batch similar content**: Group related articles in same folder +3. **Add frontmatter**: After scraping, add tags/metadata to notes +4. **Link notes**: Create connections between related saved articles +5. **Clean up**: Regularly process Clippings folder + +**Cost Management:** + +- Free tier: 300 credits +- Each scrape uses ~1 credit +- Monitor usage in Firecrawl dashboard +- Can self-host for unlimited use + +**Common Patterns:** + +- Ask Claude: "Save this to my vault: [URL]" +- Ask Claude: "Scrape these 10 articles into my Research folder: [URLs]" +- Ask Claude: "Find and save the top 5 articles about [topic]" + +### 10. Success Message + +Show a summary: + +``` +✓ Firecrawl is now set up! + +Available scripts: + .scripts/firecrawl-scrape.sh + .scripts/firecrawl-batch.sh [-o dir] ... + +Usage with Claude: + "Save this article to my vault: https://example.com" + "Scrape these URLs to my Research folder: url1, url2, url3" + +Your research workflow is now supercharged! +``` + +## Troubleshooting + +Common issues: + +1. **"jq: command not found"** + - Install jq: `brew install jq` (macOS) or `apt-get install jq` (Linux) + +2. **"Failed to scrape content"** + - Check API key is set: `echo $FIRECRAWL_API_KEY` + - Verify key is valid at https://firecrawl.dev/dashboard + - Check credits remaining + - Some sites may block scraping + +3. **"Permission denied"** + - Make scripts executable: `chmod +x .scripts/firecrawl-*.sh` + +4. **Empty or incomplete files** + - Some sites have aggressive anti-scraping + - Try the URL directly in browser first + - Check if site requires authentication + +## Reference Documentation + +For detailed script documentation: `.scripts/README.md` + +For more web scraping options: https://docs.firecrawl.dev + +## Output + +Progress through each step, showing: + +- ✓ Checkmarks for completed steps +- Clear examples of usage +- Verification that scraping works +- Workflow examples tailored to user's needs +- Final success message with quick reference + +## Example Usage + +``` +/setup-firecrawl +``` + +Or with API key already configured: + +``` +/setup-firecrawl quick +``` diff --git a/.claude/commands/setup-gemini.md b/.claude/commands/setup-gemini.md new file mode 100644 index 00000000..d8f6ae38 --- /dev/null +++ b/.claude/commands/setup-gemini.md @@ -0,0 +1,211 @@ +--- +name: setup-gemini +description: + Interactive setup wizard for Gemini Vision MCP server for image/video analysis +allowed-tools: [Read, Write, Bash, AskUserQuestion] +argument-hint: + "(optional) skip steps with 'quick' if you already have API key configured" +--- + +# Gemini Vision Setup Wizard + +This command guides you through setting up the Gemini Vision MCP server, which +enables Claude to analyze images, videos, PDFs, and other visual content in your +vault. + +## Task + +Set up Gemini Vision MCP server by: + +1. Checking prerequisites (Node.js v22+, pnpm, Claude Code) +2. Getting a free Gemini API key from Google AI Studio +3. Configuring the GEMINI_API_KEY environment variable +4. Installing required dependencies +5. Registering the MCP server with Claude +6. Testing the connection + +## Process + +### 1. Welcome & Prerequisites Check + +Start by welcoming the user and explaining what Gemini Vision does: + +- Analyze images directly (screenshots, diagrams, photos) +- Extract text from PDFs and scanned documents +- Process videos (local files and YouTube URLs) +- Auto-generate filenames based on content +- Compare multiple images + +Then check prerequisites: + +```bash +node --version # Should be v22+ +pnpm --version # Should be installed +claude --version # Should be installed +``` + +If any are missing, guide them to install: + +- Node.js: https://nodejs.org/ (v22+) +- pnpm: `npm install -g pnpm` +- Claude Code: https://claude.ai/code + +### 2. Get Gemini API Key + +Ask: "Do you already have a Gemini API key configured? (yes/no)" + +If no: + +1. Direct them to: https://aistudio.google.com/apikey +2. Explain: "Click 'Create API Key' and copy the key (starts with 'AIzaSy...')" +3. Wait for them to confirm they have the key + +If yes: + +1. Check if it's already in their environment: `echo $GEMINI_API_KEY` +2. If not set, ask them to provide it + +### 3. Configure Environment Variable + +Detect their shell: + +```bash +echo $SHELL +``` + +Based on the shell, add the API key to the appropriate config file: + +**For zsh** (.zshrc): + +```bash +echo 'export GEMINI_API_KEY="their-actual-api-key"' >> ~/.zshrc +source ~/.zshrc +``` + +**For bash** (.bashrc or .bash_profile): + +```bash +echo 'export GEMINI_API_KEY="their-actual-api-key"' >> ~/.bashrc +source ~/.bashrc +``` + +Verify it's set: + +```bash +echo $GEMINI_API_KEY +``` + +### 4. Install Dependencies + +CRITICAL: Must install dependencies BEFORE registering MCP server! + +```bash +pnpm install +``` + +This installs: + +- @google/generative-ai (Gemini API client) +- @modelcontextprotocol/sdk (MCP server framework) +- Other required dependencies + +If pnpm fails, fall back to npm: + +```bash +npm install +``` + +### 5. Register MCP Server + +Ask: "Do you want project-scoped (just this vault) or user-scoped (all projects) +installation?" + +**Project-scoped (recommended for this vault only)**: + +```bash +claude mcp add --scope project gemini-vision node .claude/mcp-servers/gemini-vision.mjs +``` + +This will create .mcp.json. The MCP server will automatically inherit the +GEMINI_API_KEY environment variable from your shell. + +**User-scoped (all projects)**: + +```bash +claude mcp add --scope user gemini-vision node .claude/mcp-servers/gemini-vision.mjs +``` + +This will update ~/.claude.json. The MCP server will automatically inherit the +GEMINI_API_KEY environment variable from your shell. + +**Important**: The API key is read from your shell environment (set in +.zshrc/.bashrc), NOT stored in any config file. The MCP server inherits it +automatically when Claude Code starts. + +### 6. Test Connection + +Important: User must open a NEW Claude Code window for MCP to connect! + +Guide them to: + +1. Exit current Claude session (or open new terminal) +2. Start Claude again: `claude` +3. Check connection: `/mcp` +4. Look for: `gemini-vision ✔ connected` + +If connected, test with a sample command: "Try: 'Use gemini-vision to list +available tools'" + +### 7. Success & Next Steps + +If everything works: + +- Congratulate them! +- Show example commands: + - "Analyze this image: 05_Attachments/screenshot.png" + - "Extract text from this PDF: 05_Attachments/document.pdf" + - "Analyze this YouTube video: https://youtube.com/watch?v=..." + - "Suggest a filename for IMG_1234.jpg" + +If issues occur: + +- Direct them to troubleshooting guide: + `.claude/mcp-servers/GEMINI_VISION_QUICK_START.md` +- Common issues: + - Dependencies not installed → run `pnpm install` + - Server not showing in /mcp → restart Claude Code + - API key not working → verify at https://aistudio.google.com/apikey + +## Troubleshooting Reference + +For detailed troubleshooting, refer to: +`.claude/mcp-servers/GEMINI_VISION_QUICK_START.md` + +Common issues: + +1. "Cannot find package '@modelcontextprotocol/sdk'" → Run `pnpm install` +2. Server shows "failed" → Check API key is set: `echo $GEMINI_API_KEY` +3. Tools don't work → Verify API key is valid, restart terminal to reload env + vars +4. Server not listed in /mcp → Must restart Claude Code after adding server + +## Output + +Progress through each step, showing: + +- ✓ Checkmarks for completed steps +- Clear instructions for manual steps +- Verification of each component +- Final success message with usage examples + +## Example Usage + +``` +/setup-gemini +``` + +Or with API key already configured: + +``` +/setup-gemini quick +```