一句话
10 月 19 日晚上,我在主帖里看着第 2 层、第 3 层、第 4 层……一个一个 Builder 冒出来回帖。到 10 月 21 日中午,这栋楼已经盖到了 394 层。
1024 是个数字,但这栋楼是真的。
所以我做了一件小事:把这 390 多层真实回帖,变成了一座可以逐层点开看的塔 —— 每一块砖都是一个 Builder,点开就能读到 TA 说了什么、住在第几层。
在线直接玩:https://hux0vPwM.html2.link
(本地下载 / 截图 / 制作过程见下文)
为什么想做这个
盖楼这个玩法很热闹,但热闹有个副作用:回帖一多,内容就被刷走了。等你想去看第 88 层那位老兄写了什么,大概率已经翻不到了。
我想给这栋楼补一个"索引"——把散落在几十页里的回帖,变成一栋可以一层层往上爬的塔。爬的过程中你会发现:
- 有人的砖是学生,有的是职场开发者,有的是独立开发者,还有不少跨界创作者;
- 233 位 Builder 认真填了"现在的我"这个身份标签,剩下的人也在下面聊得很热闹;
- 最高的一层,永远是刚刚盖上去的那一块。
这不是表情包合集,也不是随机生成的数据 —— 每一块砖都能点回论坛原帖去核对。
作品介绍
纯前端单文件网页(原生 HTML + CSS + JavaScript,零依赖、零后端):
1. 逐层可点的砖塔
382 块砖按塔形排布,底层最宽、越往上越收,像一座真正的塔。颜色代表身份标签(学生 / 职场开发者 / 独立开发者 / 跨界创作者 / 其他),鼠标悬停放大,点击从右侧抽屉滑出这一层的内容 + 楼层号 + 跳回论坛原帖的链接。砖块入场时逐块落下。
2. 盖楼进度仪表盘
已盖到第几层、距离 1024 层还差多少、快照时间、身份分布条形图、最新的几层实时列表,全部在侧栏。
3. 搜名字 / 按身份筛选
想知道社区里有没有同乡?输入昵称直接高亮匹配;点图例只看某一类 Builder。
4. 给我留一块砖 + 认证证书![]()
填上昵称和身份,你的那块砖会砌到塔顶(本地保存,不上传任何数据)。同时用 Canvas 现画一张「1024 Builder 认证证书」:昵称、楼层号、刻在砖上的那句话、日期、1024 层塔徽,都可以下载成 PNG,拿去主帖盖楼时一起发出来 —— 让社区看见你的砖。
5. 提前点亮 1024 ![]()
一个纯 Canvas 的粒子烟花,1024 层还没到,先自己放一放。
截图
首页 · 主视觉
塔身 · 每一块砖都是一个 Builder
点击任意一块砖 · 抽屉里是这个 Builder 的楼层
给我留一块砖 · Canvas 现画的认证证书
手机端也能玩
Demo 链接
在线体验(推荐,手机也能开):https://hux0vPwM.html2.link
下载即用:
1024-Builder之塔.zip(单文件网页 + 数据文件 + 使用说明,解压后双击 index.html即可打开,无需联网、无需安装)
主帖:🎉【多重惊喜福利】 TRAE 社区 1024 狂欢周璀璨开启|致敬真正的 AI Engineer
砖块数据是我写这篇时的真实抓取结果(2026-10-21 12:15 的快照,382 块砖,对应主帖第 2~394 楼)。
而且它不是死的 —— 我给这座塔配了一条自动流水线:每 10 分钟从主帖重新抓一次真实回帖、重新生成页面、再原址更新到同一个链接上(URL 不变,不会失效)。所以你现在点开,看到的楼层比我截图时又高了几层。塔不会因此白屏,接口失败时它会安静地回落到上一次的数据。
TRAE 在创作中发挥的作用
这个作品从"我想把楼砌起来"到"能给人玩",全程在 TRAE 里完成,最有用的四件事:
1. 先抓真数据,再谈界面
我先把主帖 380 多条真实回帖按 20 条一批抓下来(楼层号、昵称、时间、正文),再从每条回复的「现在的我:xxx」里正则解析出身份标签——233 位 Builder 的身份就是这么自动认出来的。这一步如果手工做,一个上午都做不完。
2. 把"塔形"这件事一次说清楚
我把需求描述成"底层最宽、逐层收分、每层 4/6/8/10/12 块循环",TRAE 直接给出分组算法和逐块落位的入场动画。我只补了一条:砖块颜色由身份标签决定,悬停放大、点击开抽屉。
3. Canvas 证书这种"一次性逻辑",改起来零摩擦
证书要现画:渐变底、霓虹双边框、塔徽、昵称、楼层号、一句话换行、PNG 导出。首版文字溢出、塔徽偏位,都是一句话就改完——调间距、加塔徽、加编号,全是对话式迭代,前后不到两小时。
4. 调试靠得住
砖塔 380 多个 DOM 节点 + 入场动画 + 抽屉 + 烟花,一开始担心掉帧。结果它直接给的是 transform/opacity 动画 + 定时错峰入场;我复核了移动端首屏和点击区域,才放心发出来。
最真实的感受:这次我几乎没写代码,但每一行代码我都能解释它在干什么。 TRAE 承担的是"从想法到可展示结果"的最后一公里,而这正是我作为 Builder 最在意的那段路。
一起把塔盖到 1024 层
这栋塔是社区共建的,所以也想听听大家的:
你在主帖里是第几层?报个楼层号,我下次更新数据时给你标一格特别的砖 ![]()
你觉得独立开发者和职场开发者盖出来的楼,最不一样的地方是什么?
想不想给自己的砖刻一句话?在作品页填一下,证书上就会印着它。
也欢迎直接回帖告诉我:塔里还缺什么?楼层太密看不清?想让 TA 的一句话而不是楼层号做砖面?我继续改 ![]()
写在最后
这栋楼写这篇时已经 394 层,离 1024 还有 630 层。
我不敢说它能盖满,但至少从今天起,社区里这些认真写过字的人,被留在了塔上。
祝每一位 Builder:所写皆为代码,所建皆成现实。 ![]()
本作品为社区爱好者自制,与 TRAE 官方抽奖、奖品无关;数据均来自公开论坛回帖。




