CC

Claude Code Workshop

Building Educational Tools with AI - A Practical Lunch & Learn

60 minutes

Pre-Workshop Setup (Do This Before We Meet!)

Complete these steps ahead of time so we can focus on building during our live session

⏱️ 10-15 minutes total
📱 Beginner Friendly No coding required - just account creation!

Create your accounts and install Claude Code beforehand - we'll do all the building together during the workshop!

Why Set Up Accounts Ahead of Time?

Account creation involves email verification and can sometimes be slow. By handling this beforehand, our live workshop time is 100% focused on the exciting parts - building amazing educational tools!

What You'll Accomplish

Just 4 simple steps to get ready:

1

Create Accounts

GitHub (free), Render (free), and Anthropic (paid subscription required)

2

Get Your API Key

Create an Anthropic API key to power your AI chat assistant

3

Fork & Deploy Your Workshop

Get your personal copy running on Render with your AI assistant

4

Install Claude Code

Set up the AI development tool for building your educational tool

Pre-Workshop Checklist

Just create these accounts - that's it! We'll do everything else together during the workshop.

1

Create Your Accounts

5 minutes

Get set up with the three services you'll need:

📸 Step-by-Step Screenshots
GitHub signup page with Sign up button highlighted, showing email and password input fields
GitHub signup page - Click "Sign up"
Render registration page showing Create account form with email, name, and password fields
Render signup page - "Create account"
Anthropic Console signup page with account creation form and authentication options
Anthropic Console - Create account
2

Get Your Anthropic API Key

3 minutes

Create your API key to power the AI chat functionality in your workshop:

⚡ Essential Step

Your workshop won't work without this! The AI chat assistant requires an API key to function. This is what makes your workshop interactive.

Getting Your API Key:
  1. Go to console.anthropic.com
  2. Sign in with the Anthropic account you just created
  3. Click on "API Keys" in the left sidebar
  4. Click "Create Key" button
  5. Give it a name like "Workshop API Key"
  6. Copy the key (starts with sk-ant-)
💡 Important Notes

Save your key somewhere safe! You won't be able to see it again after you close the page. You'll need it for the next step when deploying your workshop.

💳 Billing Required: Anthropic requires a payment method on file to generate API keys. You control usage costs - typical workshop usage costs under $1.
Check this box when you have created and saved your Anthropic API key
3

Fork & Deploy Your Workshop

5 minutes

Get your personal copy of the workshop running with your AI assistant:

🧠 Don't worry if this feels overwhelming!

You're not alone: We'll help you through any technical issues during the workshop. Focus on creating the accounts - that's the most important part.

  1. Fork this repository: Go to this GitHub repo and click "Fork" to create your own copy
  2. Deploy to Render: Go to render.com → "New +" → "Web Service" → Connect your forked repo
  3. Add your API key: In Environment Variables, add:
    Key: ANTHROPIC_API_KEY
    Value: paste your API key from Step 2
  4. Deploy: Click "Create Web Service" and wait ~3 minutes
📸 Step-by-Step Screenshots
Animated GIF showing GitHub repository page with Fork button in top-right corner being clicked to create personal copy
GitHub repo - Click "Fork" in top right
Animated GIF showing Render dashboard with New button being clicked to reveal dropdown menu, then Web Service option selected
Render dashboard - Click "New +" → "Web Service"
Animated GIF demonstrating GitHub repository connection process in Render, showing repository selection and authorization steps
Connect your forked GitHub repository
Animated GIF showing Environment Variables section in Render with ANTHROPIC_API_KEY being added and configured
Add ANTHROPIC_API_KEY in Environment Variables
Why your own copy? This gives you a personalized workshop you can keep, customize, and share. The AI assistant will work with YOUR API key, so all responses are private to you!
4

Install Claude Code

5 minutes

Install Claude Code on your computer - this is the AI development tool we'll use to build your educational tool:

System Requirements:
  • Node.js 18+ (we'll check this during workshop if needed)
  • Terminal/Command Line access
  • 4GB+ RAM
💡 New to command line tools?

The "terminal" or "command prompt" is just a text-based way to talk to your computer. Don't worry - we'll help you find it during the workshop if needed!

Installation Steps:
  1. Open your terminal/command prompt
  2. Run: npm install -g @anthropic-ai/claude-code
  3. After installation, type claude to start
  4. Sign in with your Anthropic account when prompted
  5. Run claude doctor to verify everything works
📸 Claude Code Setup Screenshots
Terminal window showing npm install -g @anthropic-ai/claude-code command with installation progress and success confirmation
Terminal: npm install -g @anthropic-ai/claude-code
Terminal showing claude command launched with authentication prompt and instructions to sign in with Anthropic account
Type 'claude' and sign in with your Anthropic account
Terminal showing claude doctor command output with green checkmarks confirming successful installation and authentication
Run 'claude doctor' to verify setup
⚡ Priority Reminder

Most important: Having your accounts ready! If Claude Code installation feels too technical right now, skip it - we'll help you install during the workshop.

Need help with installation? We'll help you install during the workshop if you run into any issues. The important thing is having your accounts ready!
Important: Claude Code requires a Claude Pro ($20/month) or Max ($40/month) subscription, or an Anthropic Console account with billing enabled. There is no free tier for Claude Code access.
Alternative Access: If you already have Claude Pro or Max, you can authenticate with your existing Claude credentials instead of Console.

You're Ready When

Complete these 4 simple steps and you'll be set for an amazing workshop experience:

← Previous: Overview Next: Live Workshop →