cyberedu
CyberEdu — Cybersecurity Learning Platform
An interactive cybersecurity learning website — from absolute beginner to advanced practitioner.
52 chapters · 28 CTF challenges · Bilingual EN/ZH · AI Tutor
🚀 Live Demo · 中文 · Changelog · Report Bug
✨ Features
| Category | Details |
|---|---|
| 📚 Content | 52 chapters across 7 modules · 4 difficulty tiers (Beginner → Expert) |
| 🌐 Bilingual | Full EN/ZH translation · one-click UI language switch |
| 🤖 AI Tutor | Built-in chat assistant · streaming SSE · supports DeepSeek, OpenAI, Qwen, Claude, Ollama |
| 💻 Code Editor | CodeMirror 5 · Python / JS / C / Bash syntax highlighting |
| 🚩 CTF Arena | 16 challenges · Crypto, Web, Misc, Reverse, Forensics, PWN |
| ⌨️ Practice | 10 coding challenges with expected output validation |
| 🔍 Search | Ctrl+K global search · token-based fuzzy matching |
| 📱 Responsive | Full mobile support · sidebar overlay · compact navigation |
| 🌙 Themes | Dark / Light mode · persisted to localStorage |
| 📊 Progress | Auto-tracked learning progress · JSON export/import backup |
📚 7 Core Modules
Programming · Cryptography · Networking · Web Security · Pentesting · Malware Analysis · CTF
🏗️ Project Structure
cyberedu/
├── cyberedu.html # Main page (entry point)
├── content.js # Content data (bilingual: modules/chapters/exercises/CTF)
├── script.js # Interactive logic
├── style.css # Stylesheet (Neo-Brutalist Terminal design)
├── i18n.js # EN/ZH localization (~140 translation pairs)
├── server.js # Local Node.js server (AI chat proxy)
├── favicon.svg # Site icon
├── docs/ # Documentation assets (screenshots, OG images)
├── versions/ # Historical version archives + CHANGELOG
├── .github/ # Issue & feature request templates
└── CONTRIBUTING.md # Contribution guidelines
🚀 Getting Started
Quick Start (no server needed)
Just open cyberedu.html directly in your browser. Code highlighting, theme switching, progress tracking, and search — all work without a server.
With AI Tutor (local server)
Requires Node.js v16+:
node server.js
# Then open http://localhost:8000
Click the green floating button (bottom-right) to open the AI chat panel. Click ⚙ to configure:
| Field | Example |
|---|---|
| API Type | OpenAI Compatible or Anthropic |
| API Base URL | https://api.deepseek.com |
| API Key | sk-... |
| Model | deepseek-chat, deepseek-reasoner, claude-sonnet-4-20250514 |
Optional: adjust temperature, max tokens, and thinking/reasoning mode.
💡 On Windows, double-click
restart_server.batto restart the server.
🤖 Supported AI Models
| Provider | API Base URL | Model Examples |
|---|---|---|
| OpenAI Compatible | ||
| DeepSeek | https://api.deepseek.com |
deepseek-chat, deepseek-reasoner |
| OpenAI | https://api.openai.com/v1 |
gpt-4o, gpt-4o-mini |
| Qwen (Tongyi) | https://dashscope.aliyuncs.com/compatible-mode/v1 |
qwen-plus, qwen-max |
| Ollama (local) | http://localhost:11434 |
llama3, qwen2 |
| Groq | https://api.groq.com/openai/v1 |
llama-3.1-70b |
| Anthropic | ||
| Claude | https://api.anthropic.com |
claude-sonnet-4-20250514, claude-haiku-3-5 |
🛠️ Tech Stack
| Layer | Technology |
|---|---|
| Frontend | HTML5 / CSS3 / Vanilla JavaScript (zero dependencies client-side) |
| Code Highlighting | Prism.js v1.29.0 |
| Code Editor | CodeMirror 5 with Python/JS/C/Bash modes |
| Local Server | Node.js built-in http module (zero dependencies) |
| AI Streaming | SSE (Server-Sent Events) |
| Fonts | JetBrains Mono + Noto Sans SC + Space Mono |
📋 What’s New
v2.4 (2026-06-22)
- 📚 Content rewrite — All 52 chapters rewritten with scenario-driven teaching, 203 interactive quiz checkpoints, reading time indicators
- 🐛 Bug fixes — Sidebar collapse animation crash, sidebar overlap with statusbar, toolbox calculation errors (URL/Hex/Binary)
- 📝 Docs overhaul — README badges, feature showcase images, enhanced SEO meta tags
- 🖼️ Image cleanup — Removed AI-generated watermarks from documentation screenshots
🤝 Contributing
Contributions are welcome! Please read CONTRIBUTING.md before submitting pull requests.
💬 Feedback
Found a bug or have a suggestion? Open an issue →
📄 License
MIT — Free for personal and commercial use.
If you find CyberEdu helpful, consider giving it a ⭐!