进度追踪
学习进度自动记录
可视化学习路径，清晰看到每一次成长。
学习数据已同步
VALUE
ITKia 是一个互动式的前端学习平台
连接讲解、实践、预览与反馈，帮助你真正理解并写出代码。
- 01
看懂
关键示例与即时测验，确认理解
- 02
写出
跟做练习，边写边预览
- 03
完成
完成挑战，获得持续反馈
WHY ITKia
为什么选择 ITKia？
让学习更高效、更有趣、更有成就感
实时代码沙盒
边学边写即时预览
真实代码环境，修改即预览，立即看到效果。
即时渲染
游戏式教学
小任务驱动持续反馈
任务、成就与徽章激励你持续学习。
成就解锁
双语学习
中英双语自由切换
内容双语对照，自由切换语言，学习无障碍。
语言偏好已保存
OLD vs NEW
传统学习 VS 互动学习
学习方式的进化，让编程学习更高效、更有趣、更有成就感
OLD WAY
传统学习
- ① 看教程
- ② 切到编辑器
- ③ 来回切换
- 教程与编码分离，无法边看边写
- 需要自己安装、配置编码环境
- 视频、网页与编辑器之间来回切换
ITKia WAY
互动学习方式
- ① 读教程
- ② 同屏写代码
- ③ 实时预览
- 教程 + 在线编码同屏，边看边写
- 无需安装，打开浏览器即可编码
- 实时预览，进度自动记录
CORE TECHNOLOGIES
核心技术
现代化技术构建真实学习环境，让学习体验稳定、可靠。
Astro
静态多页面应用
基于 Astro 构建静态 MPA 站点，提供极致加载速度。
React
孤岛架构
采用 Islands 架构，按需激活组件，提升交互体验。
Supabase
关系型数据库
强大的后端数据库与存储服务，安全、可靠、可扩展。
Monaco
代码编辑器
内置 Monaco 编辑器，提供专业的代码编辑体验。
i18n
多语言支持
内置多语言支持，中英文自由切换。
Prism
代码高亮
论坛作品展示使用 Prism，让代码清晰易读
FAQ
常见问题
- 需要安装编辑器或配置环境吗？
- 不需要。打开浏览器就能在线编码，教程和编辑器在同一个页面。
- 完全零基础可以学吗？
- 可以。从 HTML 基础开始，按学习路径循序渐进。
- 写的代码能马上看到结果吗？
- 可以。编辑器旁边有实时预览，改动立刻生效。
- 学习进度会保存吗？
- 会。课程进度和测验成绩都会记录下来。
适合谁学习
零基础新手
从没写过代码也能开始
在校学生
配合课堂，补充练习
自学转行者
系统路线，少走弯路
想补基础的开发者
查漏补缺，巩固核心
CAPABILITIES
你可以在 ITKia 做什么
丰富的学习与实践体验，助你高效成长，成就更多可能
学习与进度
系统化学习路径，清晰追踪成长
- 学习路径从基础到进阶的清晰路线
- 进度追踪可视化学习进度
- 双语学习中英双语自由切换
实践与实验
动手实践，验证想法，掌握真知
- 互动沙盒边学边写即时预览
- 自由练习安全的练习与实验环境
- 响应式设计适配桌面与移动端
评估与解锁
多维度评估，解锁成就，持续提升
- 随堂测验检验知识掌握情况
- 学完再测完成一节课才能挑战测验
- 流畅体验专注学习，减少干扰
协作与社区
连接同伴，交流分享，共同成长
- 讨论论坛分享经验，提出问题
- 角色权限学生与管理员各司其职
- 后台管理内容维护，打造高质量环境
LEARNING PATH
学习路径
从入门到精通，循序渐进，构建你的前端能力闭环
学习知识入门练习巩固进阶探索更深精通起点：零基础目标：独立做项目
STAGE 1 · Learn
学习知识
理解核心概念与原理，构建知识体系
输出 → 知识笔记
STAGE 2 · Practice
练习巩固
动手实践所学内容，加深理解与记忆
输出 → 代码作品
STAGE 3 · Explore
探索更深
深入探索前沿领域，解决实际问题
输出 → 个人项目
学习不是一蹴而就的旅程。保持好奇，持续迭代，你将在 ITKia 的陪伴下不断成长，收获属于自己的成果。
CONSTELLATION QUIZ
星座测验：答对一颗，亮一颗
每次随机 5 题，连成一个星座。答对的星点亮并连线，答错的星会裂成两半、暗下去，并附上解析。
- 最高分永久保留，可无限重考
- 完成一节课后才会解锁测验
- 满分测验解锁铜、银、金成就
