ABOUT ITKIA

关于我们

我们是三个想把前端学好、也想让别人更容易学好的人。

从零开始
边读边写
HTML · CSS · JavaScript

一路改过来的故事

故事从一个发现开始：现在很多前端教学仍然停留在 ES6，而不是最新的规格。

HTML、CSS、JavaScript 这三门语言这些年都在变，学的人却常常还在用旧的写法练习。

所以我们想做一个网站：边读边写，写完立刻看到结果，把讲解、练习、预览和进度放在同一个地方。它既给完全零基础的人一条循序渐进的路，也给已经学过基础、想补上新规格的人一个可以动手的地方。下面，就是它从 7 月底到 10 月下旬，一步步长成现在这个样子的经过。

从零开始
20267月底
01搭好地基与定下颜色
2026 年 7 月底
两个语言版本，不想把每一页写两遍；测验的对错，也不能只靠明暗区分。
我们用 Astro 搭起静态多页面网站，只在代码编辑器等需要互动的地方点亮 React 岛屿；页面结构只写一次，中英双语全部放进字典并由脚本自动对账。起初想让全站只用一个色系，后来意识到测验反馈需要真正的红与绿，三门科目也要一眼分清，于是定下了深紫品牌色搭配三科专属色与语义色的 OKLCH 色板。
20268月上
02舍弃网格，迎来星空与数据库考验
2026 年 8 月 1 日至 6 日
做出来的网格像技术图表，而刚接上的数据库又迎来了平台规则变化。
最早的背景是几何网格线，放进浏览器里既像工程图又几乎看不见。8 月 2 日我们果断删掉所有几何图案，换成统一的夜空与琉璃面板。紧接着接上 Supabase，恰逢平台收紧默认数据权限导致写入报错；我们在修补权限与行级安全策略（RLS）的拉锯中，学会了用触发器与最小权限原则守住管理员防线。
20268–9月
03跨页被清空的秒数，与闪黑的后台屏幕
2026 年 8 月中旬至 9 月下旬
多页面网站每换一页都会清空内存，而长表格的毛玻璃差点让电脑吃力。
做完登录、个人中心抽屉与管理后台后，我们查出两个棘手问题：因为多页面网站换页会重置内存，不满一分钟的学习时长永远攒不起来，我们改用浏览器本地暂存零头才实现跨页累加；同时后台长表格加上毛玻璃模糊后在快速打字时频频闪黑，我们全面转向不会加重渲染负担的半透明色阶，并加上了管理员防自踢保护。
20269月底
04三科专属天幕，与一次自我推翻
2026 年 9 月 26 日至 28 日
把课程锁死只会让人卡关，我们推翻了最早的「顺序解锁」设计。
HTML、CSS、JavaScript 的章节页换上了各自的版式与专属星空，进度也改以真实总课数为分母。隔天我们审视最早的设计：原本要求学完上一课才能解锁下一课，但学习者往往会先通览目录、挑需要的章节看，上锁只会带来挫败感。于是我们改成「所有课程永久开放阅读，标记读完后解锁当课测验」。
202610月上
05安全大收紧、防伪造判分与铜银金奖章
2026 年 10 月 1 日至 9 日
前端算出的分数能被伪造，真正的公平与激励必须由服务端把关。
进入十月，我们将 25 个零散脚本整合成严密的数据库基线，堵上发帖自带置顶、伪造签到日期、给自己作品打分等漏洞，并上线了左列表右详情的论坛审核台与九接口并发的数据总览。接着我们把测验改成服务端判分，彻底杜绝前端改分；同时放弃了星座连线式的星图，用纯 SVG 打造了 9 大系列、铜银金原位升级的 27 枚成就奖章。
202610月中
06从首页到课程页的宇宙重塑
2026 年 10 月 10 日至 13 日
拿掉循环动画，让十一幕星空长卷与静态画布安稳地托住每一次阅读。
这一周，我们决定让页面安静下来：四个核心页面迎来了彻底蜕变。我们拿掉了循环动画，为科目页换上阴阳星球与每课一格的斜切进度条；课程页告别星空图层，改用读取设计令牌颜色的静态画布、粘性目录与悬浮操作条；首页重写为 11 个区块的星空长卷；登录与注册则合进一张高度锁定的星云玻璃卡，切换标签时页面再也不会上下跳动。
202610月中
07云端练习场、星图测验与编辑器工作台
2026 年 10 月 14 日至 15 日
为了不让学习者在空白页中迷失，我们把三个交互工具打磨成了工作台。
我们发现，新手面对空白页最容易不知所措，于是练习场改成从完整骨架开始，还支持单多文件无缝往返、真实设备尺寸缩放与 ZIP 导出；测验页也化作圆形星图徽章，答对点亮星辰、答错星体裂开。为了更好地编写课程，管理端的编辑器升级为第三代工作台，不仅支持中英逐行对照，还能自动检查并一键补全 HTML 结构，为沙盒配上「试一试」任务。
202610月下
08守住登录大门，写下 30 课现代前端标准
2026 年 10 月 19 日至 20 日
既然因为教程停留在旧规格而出发，我们的每一课就都要教现代的写法。
为了抵御密码爆破，我们原本还想做两步验证和邮件验证码，但前者放弃，后者因内置邮件每小时只能发 2 封而取消，最终我们把检查与占位合进同一个数据库函数，只保留了锁定与 IP 限流。紧接着，我们用双语脚本产出了三科共 30 节课、150 道测验题，涵盖 HTML 原生交互元素与 ES2026 新特性；所有「ITKia 现在怎么写」的提示都严格核对自本站真实源码。
202610月下
09十二星座、全页个人中心与最后的拼图
2026 年 10 月 21 日至 24 日
在踩过外键歧义与八小时时差之后，所有细节终于严丝合缝。
开发接近尾声时，为了给论坛增加「采纳答案」，我们随手加了一条外键，结果引发嵌套歧义导致整个论坛和个人中心崩溃，这让我们深刻认识到数据库关系的牵一发而动全身。我们改用触发器化解危机，顺势将全库时间列迁移为带时区格式根除时差，并上线了全页个人中心。随着 12 张重新制作的星座剪影全部就位，经过全站注释与代码逐项对账的 ITKia，终于长成了今天的模样。