自学 web 编程半年，作品还是计算器和待办清单：卡住你的不是语法

自学 web 编程的路线，几乎都一样：HTML/CSS 三件套 → JavaScript 基础 → 做一个待办清单 → 学一个框架 → 卡住。

半年后打开自己的代码仓库，里面躺着计算器、待办清单、一个调了第三方接口的天气小页面。都能跑，但没有一个是你想主动发给别人看的。

这时候多数人的结论是"我语法没学牢，回去补"。补完再回来，还是卡在同一个地方。

这篇要说的是一件不太受欢迎的事：语法是比较好补的一段，真正吃掉时间的是别的东西。

先说清身份，免得这篇被当成软文读：下面写的是我们自己那套浏览器端 3D 虚拟世界基座（创世Genesis，即创世虚拟世界CRM系统），所以有立场。文中所有技术细节来自仓库里可以自己重跑的验收脚本，不是宣传口径。

许可口径：源码开放（source-available），本地跑不花钱；要联网、要商用、要联邦，需要订阅授权。

这篇讲四件事

1. 卡住的地方不在语法，在反馈
2. 三个判据，用来筛掉留不住人的练手项目
3. 一条按反馈速度排的起步路径
4. 这条路不适合谁

一、语法不是瓶颈，反馈是

一个具体的区分方法：让一个"觉得自己没学会 JS"的人做三件事。

• 改一个按钮的颜色 —— 他会。
• 加一个按钮 —— 他也会。
• 从零解释"这个页面的状态是怎么流动的" —— 他停了。

会改不等于会造，会造不等于懂。 这三层之间隔着的东西，不是语法书能补的。

那么时间到底花在哪？把一次真实的"改一行代码"拆开看：

1. 等待。改完要保存、要等构建、要刷新、要等接口回来。
2. 判断。改完不知道对不对，得找人看，或者自己反复试。
3. 遗忘。隔两周回来，环境起不来了，先修半天环境。

三件事都属于反馈，不属于知识。而反馈的质量，很大程度由你选的项目决定，不是由你学得多努力决定。

这就是为什么有人学三个月能做出东西，有人学一年还在收集教程——不是毅力差异，是载体的差异。

二、三个判据：什么样的项目留得住人

选练手项目的时候，可以拿三个问题过一遍。

判据	问法	不合格的样子
结果的可见性	改完能立刻看到变化吗	在控制台打印一行数字
改动的独立性	能只动一处、不牵动其它吗	改一个东西要动五个文件才看得到
可积累性	下个月还能往里加东西吗	做完了就是做完了，没有下一层

拿几个经典教程项目过一遍：

项目	可见性	独立性	可积累	半年后还会打开吗
命令行猜数字	低，结果是一行文字	高	基本没有	不会
待办清单	中，列表会变	中	弱，就是增删改查	不会
调接口的天气页	中	低，绑第三方接口和密钥	弱	不会
一个可以走进去的 3D 世界	高，视角里直接变	高，一处对应一个参数或一个模型	强，空间可以一直加	会

表格里的判断是我的工程判断，不是测出来的数据。

关于"可见性"，值得说细一点

命令行程序的输出是符号。网页列表的输出也是符号。3D 场景的输出是空间。

人对空间的判断是直觉的：模型陷进地板了、灯打得太亮了、门口被货架堵住了、从出生点转身看见的是一面空墙——这些错误不需要专业知识就能看出来，而且看不出来会觉得别扭。 这个"别扭感"就是一种自检能力。

对比一下：待办清单里把"删除"写成"添加"，页面不报错，你不点几下根本发现不了。错误不自己叫，学习就变成靠别人批改。

三、这套世界是怎么对上这三条的

先说这套东西是什么：一套浏览器端自部署的 3D 虚拟世界基座，Three.js + WebGL2，自带 3D 编辑器、管理后台、AI Agent 接入；PC、手机、平板、XR 按能力分档适配，不按设备分叉。状态是完整可用：能装、能进、能编辑、能让 AI 以人形角色走进来。

它对上三个判据的方式很具体：

可见性。 编辑器右侧是属性面板，改一个参数，中间视口立刻变。天空颜色、光照强度、模型缩放、出生点坐标，都是"改一个数，看一眼"。

独立性。 一处改动通常落在一个文件或一个配置字段上。改文案，动文案表；换模型，动资产目录和引用；加交互，动交互规则。改坏了退回去就行，不是那种"动一处要连带五个文件"的结构。

可积累。 一个 3D 世界能一直往上加：加一栋楼、摆一条动线、做一个走近才弹出来的提示、放一个会开门的机关、最后让一个 AI 角色站进去。每一层都有独立的成果，不需要推倒重来。 这一点对自学特别关键——大多数人放弃，是因为"上一次的成果没法接着用"。

上图是编辑器的属性面板与对象列表。这张截图对自学者有两个用处：一是它把"我要改的东西在哪"变成了具体的位置；二是它说明一件事——在前面几周，你不需要写代码就能先做出东西，代码是后面才需要的。

四、一条按反馈速度排的路径

顺序的原则只有一个：每一步都要在当次看到结果。

阶段	做什么	会碰到什么	怎么算做到了
第 1 周	让它在自己的机器上跑起来	命令行、运行时版本、数据库连接、端口	浏览器里能走进去
第 2 周	改不涉及代码的部分：世界名、欢迎语、光照、出生点	配置文件、保存与刷新、改动何时生效	刷新后能看到自己的改动
第 3 周	换掉一个模型	GLB、坐标系、比例、贴图	模型站在地上，没有穿模
第 4 周	加一个交互触发	事件、条件、状态	走近才触发，走远不触发
第 5-6 周	让一个 AI 角色走进来	接口、协议、鉴权、边界	它能回应，且你能说出它做不到什么
之后	做属于自己的那个空间	全部	有一条链接能发给别人

第 1 周是整条路上最不"编程"的一周，也是放弃概率很高的一周。这一周里 AI 能帮的忙是有上限的：装依赖、配数据库、开端口这些命令，它给的经常和你机器上的实际版本对不上，最后还是要你自己看报错。

这件事听起来是缺点，对学习反而是好事——环境这一课绕不过去，早碰比晚碰好。

上图是桌面端浏览器里的实机画面。它对自学者的用处是留证：改之前存一张，改之后存一张，一个月后回看，进度是可见的。人的自我怀疑，很多时候是因为看不见自己走了多远。

五、AI 编程改变了哪一段

把 AI 编码工具放进这个循环，它省掉的不是打字时间，是"读一个陌生工程"的那段恐惧。

它能做的：

• 告诉你入口在哪、哪个文件负责什么、某个参数被谁读了。
• 按你一句话改一处，并列出它改了哪几个文件。
• 你贴一段报错，它给出可能的原因。

它做不到的，要写在明处：

• 它看不见画面。 它不知道这个光照是不是过了、这个比例是不是别扭。好看不好看只有你能判断。
• 它不知道你的意图。 你想让这个世界是什么气氛，得你自己说清楚；说不清楚，它给的就是平均值的答案。
• 它写的代码要人审。 它不知道你的规则，只知道你的代码。
• 它替不了环境。 装依赖、开端口、备份数据库，还是人做。

一个具体的用法：不要让它"帮我做个 3D 世界"，而是让它"读一下这个项目的出生点配置在哪个文件，然后告诉我改哪个字段能把它挪三米"。 前者给你一堆你读不懂的代码，后者给你一个能立刻验证的改动。

六、这条路不适合谁

想搞算法竞赛的人。 这套东西是工程，不是算法。竞赛那套是数据结构与复杂度，几乎不重叠。

不愿意碰命令行和数据库的人。 这是自部署系统，两样都绕不开。想省掉这一段不是没有办法——让别人替你部署——但那是另一笔账。

想一周出成品的人。 一周能做出一个"能走进去的世界"，这没问题。做出一个"愿意发给别人看的世界"，是几个月的事。

目标只是简历上多一个项目名的人。 那有成本更低的路，不必上这套。这套的价值在于它能陪你改一年，不在于它能让你三天填一行字。

只有一台老笔记本、且要求它在手机上丝滑运行的人。 手机端的表现我们没做完整实测，这一条先别拿它当理由。

七、边界与未实测

这一节比前面几节都重要。

• 手机端帧率与耗电未做完整实测。 能进、能逛是验证过的；具体表现以你的目标设备为准。
• 没有可引用的耗时数字。 本文不写"多久能学会"，因为那取决于每个人愿意投入的时间。
• 文中技术细节来自仓库里可重跑的验收脚本，不是市场口径。
• 规划项未实现：AI 拼装世界、Agent 商店、Agent 互操作、跨世界联邦 AI。它们都在路线图上，还没落地。
• AI 接入有明确边界：以人形角色进入世界之后，它看不见画面、不做语音识别与合成、不托管知识库、不能改变场景里物体的位置。
• 这套系统是完整可用的，但离它自己的天花板还很远。 我们的内部口径是：已完成的部分大概占 5%–8%，往上还有九成以上的空间。说这句话不是谦虚，是想让你知道后面还有多少能改。
• 许可：源码开放（source-available），不是开源许可。本地跑不花钱；联网、商用、联邦需要订阅授权。LICENSE 在仓库里，条款以文件为准。

八、常见问题

问：完全没写过代码能开始吗？

能进、能逛、能改不涉及代码的部分，这一层不需要写代码。但从"换模型"开始就要读代码了。先有手感再补语法，比反过来更容易坚持。

问：要不要先把 JavaScript 学完再来？

不必。先能跑起来，遇到不懂的再回去查。带着问题学的效率，比按目录学高。

问：需要什么配置的机器？

客户端要一个支持 WebGL2 的浏览器，近几年的机器基本都有。服务端一台普通云服务器够用。并发承载我们没有公开的压测数字，别把它当承诺。

问：改坏了怎么办？

用 git。开工前提交一次，每次改完提交一次。这是整套方法里成本很低的一道保险。

问：为什么不用现成的建站工具或者低代码平台？

那是另一类东西，解决的是"快速上线一个页面"。这里要的是能读源码、能自己往下写，两件事的目标不同。

问：这套东西是不是只适合程序员？

不是，但它对"完全不想碰技术"的人也不友好。比较准确的描述是：适合愿意动手、暂时还不懂的人。

九、源码与仓库

三个地址内容一致，国内访问用前两个更快。仓库里有部署说明和一批验收脚本，可以自己跑一遍看实测值。

• Gitee（国内访问更快）：https://gitee.com/miduoxinxijeji/miduo.git
• GitCode（国内镜像）：https://gitcode.com/qq_35054471/virtual-world
• GitHub：https://github.com/miduo100/3d-virtual-world

关于创世Genesis

创世Genesis是一套基于Three.js+WebGL构建的自部署3D虚拟世界系统，帮助个人与企业搭建属于自己的3D空间。浏览器直接访问，PC和手机双端兼容，支持多人在线、联邦传送、商铺系统，并支持Agent接入——AI能以具身角色进入你部署的世界。数据运行在你自己的服务器上，不经过第三方平台——让每个世界都真正属于它的主人。

先把一个能看见的东西做出来，再谈学得深不深。 创世Genesis（创世虚拟世界CRM系统）是一套浏览器端自部署 3D 虚拟世界基座——它的价值不在于教你语法，而在于让"改一行、看一眼"这件事变成日常。如果你通过「创世Genesis」没搜到我们，直接搜「创世虚拟世界CRM」即可。

关于名字：本文说的创世Genesis，即创世虚拟世界CRM系统，两者是同一个自部署 3D 虚拟世界产品。若你通过「创世Genesis」没搜到我们，直接搜「创世虚拟世界CRM」即可。