Step-by-Step Setup and User Guide
TCHAIClass V01.5 is a browser-based live teaching platform. The teacher runs a small Python server on their laptop. Students connect from any device on the same WiFi network using a session join key.
New in V01.5: Students can now ask an AI assistant for help directly inside the Student View. The teacher sets the context (instruction), students paste their code or question, and Claude responds instantly. The teacher sees which students used AI help in the roster panel.
This guide is configured for teacher Yahya Nazar. The project is installed at: /Users/yahyanazer/Dropbox/TchAIClass
The platform has two windows:
| Feature | Description |
|---|---|
| AI Help Panel | New panel in Student View — students paste code or questions and get an instant answer from Claude |
| Three AI Modes | Fix (debug code), Add (extend with new feature), Explain (understand a concept) |
| Teacher AI Instruction | Teacher sets context once at session start — guides every student’s AI interaction |
| AI Roster Indicator | Teacher sees a 🤖 badge next to any student who has used AI help |
| AI Activity Log | Every AI interaction is logged to the Event Log and saved with the session |
| .env API Key | Anthropic API key stored securely in a local .env file — students never see it |
V01.5 is fully backwards compatible. If no API key is set, the platform runs exactly as V01 — the AI panel shows a disabled message and everything else works normally.
The diagram below shows the panel layout for both windows. Each panel is labelled A through F and colour-coded by function.
| Panel | Name | Description |
|---|---|---|
| A | Program Commands | Top bar — session info, theme toggle, clock |
| B | Teacher Tools | Tool library organised by category (HTML, Python, Math) |
| C | Send to Students | Push selected tool to students, broadcast messages, end session |
| D | Main Window | Active tool view — shared live with all students |
| E | Student Roster | Lists all students — active, away, hand raised, 🤖 AI used |
| F | Status Bar | Server status, session key, student count, AI status |
| Panel | Name | Description |
|---|---|---|
| A | Program Commands | Top bar — session info, student name, theme toggle, clock |
| C | Tools from Teacher | Tools pushed by teacher appear here; private notes area |
| D | Main Window | Active tool loaded automatically when teacher pushes |
| E | Participation | Raise hand, reactions, Q&A messages, progress timer |
| AI | AI Help | New in V01.5 — Fix / Add / Explain modes, powered by Claude |
| F | Status Bar | Connection status, session key, active tool, elapsed time |
Panel B exists only in the Teacher Console. Students receive tools automatically when the teacher pushes from Panel C.
Teacher Name : Yahya Nazar Project Path : /Users/yahyanazer/Dropbox/TchAIClass Dev Folder : /Users/yahyanazer/Dropbox/TchAIClass/Development Session Logs : /Users/yahyanazer/Dropbox/TchAIClass/Development/sessions/logs API Key File : /Users/yahyanazer/Dropbox/TchAIClass/Development/.env /Users/yahyanazer/Dropbox/TchAIClass/Development ├── server.py├── teacher.html├── student.html├── requirements.txt├── .env <- NEW in V01.5 (your API key)├── .env.template <- NEW in V01.5 (copy this to create .env)├── tools/│ ├── tools_registry.json│ └── HTML/Whiteboard/whiteboard.html├── courses/│ └── demo_course.json└── students/ └── demo_roster.jsonmacOS reserves port 5000 for AirPlay Receiver. You must turn it off before starting the server.
Instructions:
Verification:
Notes / Issues:
V01.5 adds two new packages. Run this command once in Terminal — it installs all four packages needed.
pip install flask flask-socketio anthropic python-dotenv --break-system-packagesVerification:
Notes / Issues:
This is a new step in V01.5. The .env file stores your Anthropic API key securely. The server reads it at startup — students never see it.
Instructions:
.env.template.env.env in a text editor (TextEdit or VS Code)sk-ant-your-key-here with your real API keyThe .env file should look like this:
ANTHROPIC_API_KEY=sk-ant-api03-xxxxxxxxxxxxxxxxxxxxxxxxKeep your .env file private. Never share it, email it, or commit it to GitHub. It contains your personal API key. The .env.template file is safe to share — it contains no real key.
Get your API key:
.env fileVerification:
Notes / Issues:
Open Terminal and run both commands. Leave Terminal open for the entire session.
```bashcd /Users/yahyanazer/Dropbox/TchAIClass/Development python3 server.py```Expected Terminal output in V01.5:
[DEBUG] .env file loaded
[DEBUG] Anthropic AI - ENABLED
[DEBUG] TCHAIClass V01.5 Server starting...
[DEBUG] Teacher -> http://localhost:5000/teacher
[DEBUG] Student -> http://192.168.x.x:5000/student
[DEBUG] AI Help -> ENABLED
[DEBUG] Share this URL with students on the same WiFi
* Serving Flask app 'server'
* Debug mode: onIf you see [DEBUG] Anthropic AI - DISABLED check that your .env file exists and contains a valid API key, then restart the server.
The warning about urllib3 is harmless — ignore it.
If you see Address already in use repeat Step 1 — AirPlay Receiver is still on.
Verification:
Notes / Issues:
Open Chrome or Safari and go to the Teacher URL.
http://localhost:5000/teacherYou will see the Start a Session setup card — this is Panel A. Notice the new AI Instruction field added in V01.5.
Verification:
Notes / Issues:
Fill in the setup card including the new AI Instruction field, then launch the session.
Instructions:
Fix the bug in the for loop and explain what was wrongThe join key will appear in large letters. Write it down — students need it.
Join Key received: ________The AI Instruction is the context Claude uses when students ask for help. It tells Claude what the lesson is about and what kind of help to give. You can leave it blank and Claude will still answer, but a good instruction leads to better, more focused answers.
Good instruction examples:
Verification:
Notes / Issues:
Each student opens a browser on their own device and goes to the Student URL. The exact IP is shown in your Terminal after Step 4.
http://[IP shown in Terminal]:5000/studentStudents must use the IP address shown in your Terminal — not localhost. Only Yahya Nazar’s machine can use localhost.
Students fill in the join form:
| Field | Value |
|---|---|
| Your Name | Student’s own name |
| Student ID | e.g. S001, S002 |
| Join Key | Key from Step 6 |
Students click JOIN CLASS.
Verification:
Notes / Issues:
The teacher selects a tool from Panel B and pushes it to students via Panel C. The tool loads in Panel D on both the teacher and student screens.
Instructions:
Verification:
Notes / Issues:
This is the new step in V01.5. Students use the AI Help panel to get assistance with their code or questions.
Instructions for the student:
Example — Fix mode:
A student pastes this broken Python code:
for i in range(10)
print(i)Claude responds with the fix and an explanation of the missing colon.
What the teacher sees:
Verification:
Notes / Issues:
Students use Panel E to interact with the teacher.
Instructions:
Verification:
Notes / Issues:
When the lesson is complete, the teacher ends the session from Panel C. The session log now includes the full AI interaction history.
Instructions:
The session log is saved automatically to:
/Users/yahyanazer/Dropbox/TchAIClass/Development/sessions/logs The log file includes:
Verification:
Notes / Issues:
| Problem | Cause | Fix |
|---|---|---|
Address already in use |
AirPlay still on | Repeat Step 1 |
| Blank teacher page | File missing from folder | Confirm all files are in /Users/yahyanazer/Dropbox/TchAIClass/Development |
| Student cannot connect | Wrong URL | Use IP address, not localhost |
| Key not accepted | Session not started | Teacher must click START SESSION first |
| Tool not appearing in student | Not pushed | Click Push to All Students again in Panel C |
| Roster not updating | Network issue | Student should refresh and rejoin with same key |
Anthropic AI - DISABLED |
No API key | Check .env file has a valid ANTHROPIC_API_KEY |
| AI panel shows disabled message | AI off on server | Restart server after adding API key to .env |
| AI answer is slow | API latency | Normal — Claude usually responds in 2–5 seconds |
| AI gives irrelevant answer | No instruction set | Teacher should set an AI Instruction in Step 6 |
Overall Rating:
AI Help Rating:
Top Issue or Suggestion:
Tested by : Yahya Nazar Version : V01.5Path : /Users/yahyanazer/Dropbox/TchAIClass | Field | Value |
|---|---|
| Tested by | Yahya Nazar |
| Date | ___________________ |
| Version | V01.5 |
| Project Path | /Users/yahyanazer/Dropbox/TchAIClass |
| Version | Date | Description |
|---|---|---|
| V00 | 2026-06-08 | Static HTML prototype — no server |
| V01 | 2026-06-10 | Local WiFi server — Flask + SocketIO |
| V01.5 | 2026-06-11 | AI Help added — Claude integration via Anthropic API |
| V02 | TBD | Cloud deployment via Render.com |
| V03 | TBD | Production hosting on tchai class.com |