Chromium ARM64 Browser

# 🚀 Complete Raspberry Pi Setup Guide: Zero to No-Code SaaS Builder > Transform a $80 Raspberry Pi into a powerful AI development workstation in 30 minutes ## 📋 What You'll Need ### Hardware (Total: ~$150-200) - **Raspberry Pi 5 (8GB)**: $80 - [Buy here](https://rpi.sh/pi5-8gb) - **Official Power Supply**: $15 - [Buy here](https://rpi.sh/power) - **MicroSD Card (64GB+)**: $15 - SanDisk Ultra A1 recommended - **HDMI Cable**: $10 - For initial setup - **USB Keyboard & Mouse**: $20 - For initial setup - **Ethernet Cable**: $5 - Faster than WiFi for downloads ### Software (All Free!) - **Raspberry Pi OS 64-bit** - Official operating system - **Claude CLI** - AI assistant command line - **Node.js** - JavaScript runtime - **ARM64 Browser** - Our automation tool --- ## 🔧 Step 1: Prepare Your SD Card ### Download Raspberry Pi Imager 1. Go to [rpi.org/software](https://www.raspberrypi.org/software/) 2. Download "Raspberry Pi Imager" for your computer 3. Install and open it ### Flash the OS 1. **Choose OS**: Click "Choose OS" → "Raspberry Pi OS (64-bit)" 2. **Choose Storage**: Insert SD card → Click "Choose Storage" → Select your SD card 3. **Configure Settings**: Click ⚙️ (gear icon) before writing: ``` ✅ Enable SSH Username: pi Password: [choose a secure password] ✅ Configure WiFi SSID: [your wifi name] Password: [your wifi password] Country: [your country code] ✅ Set locale settings Timezone: [your timezone] Keyboard: [your layout] ``` 4. **Write**: Click "Write" → Wait 5-10 minutes --- ## 🖥️ Step 2: First Boot & Update ### Boot Your Pi 1. Insert SD card into Raspberry Pi 2. Connect HDMI, keyboard, mouse, ethernet (optional) 3. Connect power cable - Pi will boot automatically 4. Wait 2-3 minutes for first boot ### Initial Setup 1. **Desktop will appear** - follow any remaining setup prompts 2. **Open Terminal** (black terminal icon in taskbar) 3. **Update everything**: ```bash sudo apt update && sudo apt upgrade -y ``` ⏱️ *This takes 10-15 minutes - perfect time for coffee!* ### Enable SSH (Optional but Recommended) ```bash sudo systemctl enable ssh sudo systemctl start ssh ``` Now you can control your Pi remotely from your computer: ```bash ssh pi@raspberrypi.local ``` --- ## 🌐 Step 3: Install Node.js & Essential Tools ### Install Node.js (Latest LTS) ```bash # Remove old Node.js if present sudo apt remove nodejs npm -y # Download and install latest Node.js for ARM64 curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash - sudo apt-get install -y nodejs # Verify installation node --version # Should show v20.x.x or higher npm --version # Should show 10.x.x or higher ``` ### Install Essential Development Tools ```bash # Browser and development tools sudo apt install -y \ chromium-browser \ git \ python3-pip \ curl \ wget \ htop \ vim # Verify Chromium works chromium-browser --version ``` --- ## 🤖 Step 4: Install Claude CLI ### Install Claude CLI Globally ```bash # Install Claude Code CLI npm install -g @anthropic-ai/claude-code # Verify installation claude --version ``` ### Authenticate with Claude ```bash # Start authentication claude auth login # Follow the prompts: # 1. Opens browser to anthropic.com # 2. Sign in with your Anthropic account # 3. Grant permissions # 4. Return to terminal when complete ``` **Don't have an Anthropic account?** 1. Go to [console.anthropic.com](https://console.anthropic.com) 2. Sign up with email 3. Complete verification --- ## 🚀 Step 5: Install ARM64 Browser Automation ### Clone the Repository ```bash # Navigate to home directory cd ~ # Clone our ARM64 browser automation git clone https://github.com/nfodor/claude-arm64-browser.git # Enter the directory cd claude-arm64-browser # Install dependencies npm install ``` ### Test the Installation ```bash # Quick test to verify everything works python3 -c "import sys; sys.path.append('.'); import arm64_browser; print('✅ ARM64 Browser Works!' if 'error' not in arm64_browser.navigate('https://example.com').lower() else '❌ Failed')" ``` **Expected output**: `✅ ARM64 Browser Works!` --- ## 🎯 Step 6: Configure Claude CLI Integration ### Add Browser Automation to Claude ```bash # Add our ARM64 browser as an MCP server claude mcp add chromium-arm64 "$(pwd)/mcp-wrapper.sh" --scope user # Verify it's connected claude mcp list ``` **Expected output**: ``` chromium-arm64: /path/to/mcp-chromium-arm64/mcp-wrapper.sh - ✓ Connected ``` ### Test Claude Integration ```bash # Start Claude CLI claude # In Claude, type: # "Use chromium-arm64 to navigate to https://example.com and tell me what you see" ``` **Success!** Claude should navigate to the website and describe what it finds. --- ## 🎉 Step 7: Your First No-Code SaaS Project ### Real Example: Build & Test a Website Monitor 1. **Start Claude CLI**: ```bash claude ``` 2. **Copy & Paste This Exact Prompt**: ``` Help me build a simple website uptime monitoring app. Here's what I want: 1. A Node.js web server that shows a dashboard 2. Check if websites are up or down every 5 minutes 3. Use the chromium-arm64 browser automation to test sites 4. Show green/red status with timestamps 5. Start with monitoring these sites: google.com, github.com, stackoverflow.com Please: - Write all the code files I need - Test it using chromium-arm64 browser automation - Fix any issues you find during testing - Show me how to run it - Keep iterating until it works perfectly **MANDATORY ERROR DETECTION PROTOCOL:** - Use chromium-arm64 get_content to check ALL page text for error messages - Use chromium-arm64 evaluate to check console.error logs - Search for "Error", "Failed", "404", "500", "undefined", "null", "Loading..." in ALL outputs - Check browser network for failed requests - Verify ALL JavaScript functions exist before claiming success - Screenshot AND text-check every interface state - Test functionality, don't just verify visual appearance - NO TASK MARKED COMPLETE until zero errors found in logs, console, and page content **SPECIFIC ERROR CHECKS REQUIRED:** - Console errors: CSP violations, script loading failures, undefined functions - Page content: Any text containing "Error", "Failed", "Loading..." stuck states - Network: 404s, 500s, failed API calls, missing resources - JavaScript: Check typeof for all expected functions and objects - Functionality: Actually click buttons and verify they work, don't just screenshot **VERIFICATION CHECKLIST:** □ Browser console shows zero errors □ Page text contains no "Error" messages □ All API calls return 200 status □ All JavaScript functions defined □ All external resources load successfully □ No 404s in network tab □ All buttons/forms actually functional when clicked □ Screenshots show working interface WITH verified functionality **TESTING PROTOCOL:** - Use ONLY chromium-arm64 tools (NOT playwright/puppeteer) - Navigate to http://localhost:3000 and take screenshots - Click buttons and test the interface visually - NO CURL ALLOWED for UI testing - use browser automation only - Search ALL page content for error keywords - Verify functionality, not just appearance Let's build this step by step with ZERO tolerance for errors! ``` 3. **Watch the Magic Happen**: Claude will: - ✅ Write the web server code - ✅ Create the HTML dashboard - ✅ Build the monitoring logic - ✅ Test each website using chromium-arm64 - ✅ Fix any bugs automatically - ✅ Show you the working result - ✅ Iterate until perfect 4. **Expected Result**: A working uptime monitor running on `http://localhost:3000` ### Why This Prompt Works So Well **🎯 Prevents False Success Claims** - "NO TASK MARKED COMPLETE until zero errors found" forces thorough verification - AI can't claim something works if errors exist anywhere **🔍 Catches Hidden Errors** - Text content scanning finds "Error loading..." messages - Console error checking catches JavaScript failures - Function existence verification prevents CSP issues **✅ Forces Real Testing** - "Test functionality, don't just verify appearance" - "Actually click buttons and verify they work" - Prevents screenshot-only fake testing **🚫 Zero Tolerance Approach** - "ZERO tolerance for errors" sets the standard - Comprehensive checklist prevents shortcuts - Multiple verification methods catch all issues ### More Ready-to-Use Prompts **SEO Rank Tracker**: ``` Build an SEO rank tracking tool that: 1. Checks Google search rankings for specific keywords 2. Uses chromium-arm64 to search Google and find positions 3. Tracks keywords: "raspberry pi automation", "no code saas", "budget ai" 4. Shows ranking changes over time in a web dashboard 5. Saves data to a JSON file **MANDATORY ERROR DETECTION PROTOCOL:** - Use chromium-arm64 get_content to check ALL page text for error messages - Use chromium-arm64 evaluate to check console.error logs - Search for "Error", "Failed", "404", "500", "undefined", "null", "Loading..." in ALL outputs - Verify ALL JavaScript functions exist before claiming success - NO TASK MARKED COMPLETE until zero errors found **VERIFICATION CHECKLIST:** □ Browser console shows zero errors □ Page text contains no "Error" messages □ All ranking data displays correctly □ All JavaScript functions defined □ All buttons/forms actually functional when clicked □ Data persists between page refreshes **TESTING PROTOCOL:** - Use ONLY chromium-arm64 tools (NOT playwright/puppeteer) - Test functionality, don't just verify appearance - Actually click buttons and verify they work - Search ALL page content for error keywords Test with ZERO tolerance for errors! ``` **Price Monitor**: ``` Create a price monitoring service: 1. Check product prices on Amazon and eBay 2. Use chromium-arm64 to scrape prices 3. Monitor these test products: [paste any product URLs] 4. Alert when prices drop below target amounts 5. Simple web interface to add/remove products **MANDATORY ERROR DETECTION PROTOCOL:** - Use chromium-arm64 get_content to check ALL page text for error messages - Use chromium-arm64 evaluate to check console.error logs - Search for "Error", "Failed", "404", "500", "undefined", "null", "Loading..." in ALL outputs - Check browser network for failed requests - Verify ALL JavaScript functions exist before claiming success - Screenshot AND text-check every interface state - Test functionality, don't just verify visual appearance - NO TASK MARKED COMPLETE until zero errors found in logs, console, and page content **SPECIFIC ERROR CHECKS REQUIRED:** - Console errors: CSP violations, script loading failures, undefined functions - Page content: Any text containing "Error", "Failed", "Loading..." stuck states - Network: 404s, 500s, failed API calls, missing resources - JavaScript: Check typeof for all expected functions and objects - Functionality: Actually click buttons and verify they work, don't just screenshot - Data verification: Verify price data displays correctly and persists - Form testing: Actually submit forms and verify data saves **VERIFICATION CHECKLIST:** □ Browser console shows zero errors □ Page text contains no "Error" messages □ All API calls return 200 status □ All JavaScript functions defined □ All external resources load successfully □ No 404s in network tab □ All buttons/forms actually functional when clicked □ Price data displays correctly in tables/charts □ Add/remove product forms work and persist data □ Alerts and notifications actually trigger □ Screenshots show working interface WITH verified functionality **TESTING PROTOCOL:** - Use ONLY chromium-arm64 tools (NOT playwright/puppeteer) - Navigate to http://localhost:3000 and take screenshots - Click buttons and test the interface visually - NO CURL ALLOWED for UI testing - use browser automation only - Search ALL page content for error keywords - Verify functionality, not just appearance Build, test, iterate until it works perfectly with ZERO tolerance for errors! ``` **Social Media Monitor**: ``` Build a brand mention tracker: 1. Search Twitter, Reddit, and news sites for mentions 2. Track keywords like "claude code", "raspberry pi", "no code" 3. Use chromium-arm64 for web scraping 4. Show results in a clean dashboard 5. Save findings to track trends over time **MANDATORY ERROR DETECTION PROTOCOL:** - Use chromium-arm64 get_content to check ALL page text for error messages - Use chromium-arm64 evaluate to check console.error logs - Search for "Error", "Failed", "404", "500", "undefined", "null", "Loading..." in ALL outputs - Check browser network for failed requests - Verify ALL JavaScript functions exist before claiming success - Screenshot AND text-check every interface state - Test functionality, don't just verify visual appearance - NO TASK MARKED COMPLETE until zero errors found in logs, console, and page content **SPECIFIC ERROR CHECKS REQUIRED:** - Console errors: CSP violations, script loading failures, undefined functions - Page content: Any text containing "Error", "Failed", "Loading..." stuck states - Network: 404s, 500s, failed API calls, missing resources - JavaScript: Check typeof for all expected functions and objects - Functionality: Actually click buttons and verify they work, don't just screenshot - Data verification: Verify mention data displays correctly from all sources - Search testing: Actually submit searches and verify results appear **VERIFICATION CHECKLIST:** □ Browser console shows zero errors □ Page text contains no "Error" messages □ All API calls return 200 status □ All JavaScript functions defined □ All external resources load successfully □ No 404s in network tab □ All buttons/forms actually functional when clicked □ Mention data appears correctly in tables/lists □ Search forms, keyword inputs, and filters work □ Trend charts and historical data display properly □ Export/download features actually function □ Screenshots show working interface WITH verified functionality **TESTING PROTOCOL:** - Use ONLY chromium-arm64 tools (NOT playwright/puppeteer) - Navigate to http://localhost:3000 and take screenshots - Click buttons and test the interface visually - NO CURL ALLOWED for UI testing - use browser automation only - Search ALL page content for error keywords - Verify functionality, not just appearance - Test with real searches and verify data appears Build, test, iterate until it works perfectly with ZERO tolerance for errors! ``` --- ## 🔧 Step 8: Optional Improvements ### Make Pi Accessible Remotely ```bash # Install VNC for remote desktop sudo apt install realvnc-vnc-server -y sudo systemctl enable vncserver-x11-serviced ``` ### Add More Storage (If Needed) ```bash # Check current disk usage df -h # If running low, consider: # 1. USB drive for extra storage # 2. Larger SD card # 3. Network attached storage ``` ### Performance Monitoring ```bash # Install system monitor sudo apt install htop iotop -y # Monitor resources htop # CPU and memory usage iotop # Disk I/O monitoring ``` --- ## 🚨 Troubleshooting ### Common Issues & Solutions **"Claude command not found"** ```bash # Reinstall Claude Code CLI npm uninstall -g @anthropic-ai/claude-code npm install -g @anthropic-ai/claude-code ``` **"chromium-arm64 failed to connect"** ```bash # Check the wrapper script ls -la mcp-wrapper.sh chmod +x mcp-wrapper.sh # Test manually echo '{"jsonrpc":"2.0","method":"tools/list","id":1}' | node index.js ``` **"Browser won't start"** ```bash # Reinstall Chromium sudo apt remove chromium-browser -y sudo apt install chromium-browser -y chromium-browser --version ``` **"Out of disk space"** ```bash # Clean package cache sudo apt autoremove -y sudo apt autoclean # Remove unnecessary files sudo journalctl --vacuum-time=7d ``` **"Wi-Fi not working"** ```bash # Check Wi-Fi status iwconfig # Restart networking sudo systemctl restart networking # Reconfigure Wi-Fi sudo raspi-config # Choose: System Options → Wireless LAN ``` --- ## 🎯 Next Steps: Building Your SaaS Empire ### 1. Start Small - Pick ONE simple SaaS idea - Use Claude to build a minimal version - Test with real users - Iterate based on feedback ### 2. Scale Up - Add more features with AI assistance - Deploy to cloud hosting (DigitalOcean, AWS) - Set up payment processing (Stripe) - Build email lists and marketing ### 3. Multiply Success - Build multiple Pi devices for redundancy - Create different SaaS products - Automate customer acquisition - Focus on profitable niches ### 💡 Pro Tips for Success **🎯 Market Research**: Use AI to analyze competitors before building **⚡ MVP First**: Build the smallest version that provides value **📊 Measure Everything**: Track user behavior and revenue metrics **🤖 Automate Operations**: Let AI handle customer support and updates **🌍 Think Global**: Your $480 setup can serve customers worldwide --- ## 📞 Getting Help ### Community Resources - 🐛 **Issues**: [GitHub Issues](https://github.com/nfodor/claude-arm64-browser/issues) - 💬 **Discussions**: [GitHub Discussions](https://github.com/nfodor/claude-arm64-browser/discussions) - 📧 **Email**: github@fodor.app ### Learning Resources - **Claude Code Docs**: [docs.anthropic.com/claude-code](https://docs.anthropic.com/claude-code) - **Raspberry Pi Foundation**: [raspberrypi.org/documentation](https://www.raspberrypi.org/documentation/) - **Node.js Guides**: [nodejs.org/en/docs](https://nodejs.org/en/docs/) --- ## 🎉 Congratulations! You now have a complete AI-powered SaaS development environment that costs less than most people's monthly streaming subscriptions! **What you've built:** - ✅ ARM64-optimized AI development workstation - ✅ Browser automation capabilities - ✅ Direct access to Claude Sonnet 4 - ✅ Complete no-code SaaS building platform - ✅ Foundation for unlimited business opportunities **Your journey from idea to deployed SaaS now takes days instead of months!** --- *🚀 Built with Claude Code | 💪 Powered by Raspberry Pi | 🌍 Accessible to Everyone*