Resources & Support
Everything you need to succeed with your educational tool development
🛠️ Essential Tools
- Claude Code - Your AI development partner (command-line tool for building)
- Claude Code Documentation - Complete guide and reference
- Render - Free hosting for your educational tools
- GitHub - Code storage and version control
🎯 Workshop Examples
AnalogueAI
What it does: AI-powered learning inspiration cards with 50 educational concepts
Why it's useful: Shows how AI chat can enhance brainstorming and ideation in education
Built with: Claude Code + simple HTML/CSS interface
Educational Prompts Hub
What it does: Curated collection of proven ChatGPT prompts from expert educators
Why it's useful: Demonstrates how to organize and share educational resources effectively
Built with: Node.js + interactive filtering and search
This Workshop Platform
What it does: Complete workshop interface with AI assistance and progress tracking
Why it's useful: Example of a complex educational application with multiple features
Built with: Express.js + Anthropic API + localStorage for progress
🚨 Troubleshooting Guide
Claude Code Issues
- "Access denied" error: Make sure you're signed into your Anthropic account
- "Rate limit exceeded": Wait a few minutes and try again, or break your request into smaller parts
- "Claude isn't understanding my request": Be more specific about what you want to build and include examples
Deployment Problems
- Render build fails: Check that package.json has correct dependencies and start script
- App crashes after deployment: Look at logs in Render dashboard for error details
- "Application Error" page: Usually means missing environment variables or port configuration
- Site loads but features don't work: Check browser console for JavaScript errors
Code Issues
- JavaScript errors: Open browser developer tools (F12) to see error messages
- Styling problems: Check CSS file paths and class names match HTML
- Features not working: Ask Claude Code: "My [feature] isn't working. Here's my code: [paste code]"
📚 Learning Path
Beginner (Week 1-2)
- Master basic Claude Code prompting techniques
- Build 2-3 simple tools (forms, calculators, quizzes)
- Learn HTML/CSS basics through building
Intermediate (Week 3-6)
- Add interactivity with JavaScript
- Store data with localStorage or simple databases
- Deploy multiple projects and get user feedback
Advanced (Month 2+)
- Integrate APIs for external data
- Build multi-page applications
- Collaborate with other educators on larger projects
🎯 Claude Code Prompt Templates
Educational Tool Creation:
"Create a web-based educational tool for [subject/topic]. It should help [target audience] with [specific learning goal]. Include [specific features like forms, quizzes, progress tracking]. Make it mobile-friendly and accessible."
Debugging & Troubleshooting:
"I'm building an educational tool and getting this error: '[error message]'. Here's my code: [paste code]. The tool is supposed to [describe intended functionality]. Can you help me fix this and explain what went wrong?"
Feature Enhancement:
"I have an educational tool that currently [describe current functionality]. I want to add [specific new feature] to help students [learning objective]. Here's my existing code: [paste code]. How should I implement this?"
Deployment Help:
"I built an educational tool and want to deploy it so students can access it online. My project has [describe project structure]. What's the best way to deploy this, and can you help me prepare it for deployment?"
✅ How to Know Your Tool is Ready
Functionality
- ✅ Core features work as expected
- ✅ No JavaScript errors in browser console
- ✅ Forms submit and provide feedback
- ✅ Data saves and loads correctly
User Experience
- ✅ Clear instructions for users
- ✅ Works on mobile phones and tablets
- ✅ Loads within 3 seconds
- ✅ Looks professional and trustworthy
Educational Value
- ✅ Solves a real educational problem
- ✅ Provides immediate value to users
- ✅ Easy for students/faculty to understand
- ✅ Enhances learning outcomes