这个“反叛的使徒官方网站”，我折腾了好几天，主要就是想给自己那堆乱七八糟的项目找个正经的家。不是为了多高级，就是想有个地方能把东西一放，告诉大家，我这玩意儿是存在的。我的原则就是：能用土办法解决的，绝不搞那些花里胡哨的专业玩意儿。
起步：避开那些烦人的大框架
我最讨厌那些大而全的前端框架，学起来费劲，跑起来又慢。一开始有人劝我用什么React或者Vue，我直接摇头。搞这么个静态展示页，杀鸡焉用牛刀？我需要的是稳定，不是性能竞赛。
我决定走最简单的路子，找了一个能自动生成静态页面的小工具。原理很简单，就是把我的内容用Markdown写它咔咔一顿操作，就能给我吐出干净的HTML和CSS。这样维护起来也省心，内容改动了，只需要改文本文件就行，不用再动那些复杂的代码逻辑。我这人就是这样，能简单绝不复杂。
设计：必须搞出“反叛”那股脏劲
“反叛的使徒”这个名字，就注定了它不能是那种干干净净，白底蓝字的模样。它必须看起来有点叛逆、有点脏，有点那种末日废土的蒸汽朋克那味儿。为了这个视觉效果，我光是找背景纹理和合适的字体就耗了一整天。
我试了至少十几种配色方案。纯黑太压抑，纯白太无聊。我拍板决定，主色调要用深灰配上那种血红色的强调色，边角和背景要加上点老旧的噪点和腐蚀的感觉。我找了一堆老的终端机字体来用，让整个页面看起来像是二十年前的电脑屏幕。这个过程真是磨人，我不断调整CSS里的阴影和透明度，就为了追求那种“破旧不堪但依然坚韧”的感觉。
内容结构倒是理得很快，主要就是分了几个板块，逻辑一定要清晰，不能让看的人在里面迷路：
- 核心使命：简单粗暴地介绍我们这个“使徒”是干啥的。
- 实践记录：我自己写点碎碎念，记录我每天搞定了什么功能。
- 数据接口：放上最新的成果包或者测试入口，方便大家抓取。
- 联系方式：留了个邮箱，方便有人来骂我或者提意见。
实现：被响应式设计坑惨了
开始动手写内容和布局的时候，麻烦就来了。那个静态生成工具毕竟是死的，我想要加点动态效果，比如鼠标放上去按钮要变个色，或者页面滚动的时候背景要有点视差。工具不认，直接就报错。没办法，我只能硬着头皮，自己手写了一堆纯JavaScript来处理这些交互的小细节。我一个主要搞后端的，写这种前端代码真是要了我的老命，查了好久W3C的文档才搞明白一些属性。
最要命的是部署上线那一刻。我把所有文件都扔到我的小服务器上，一开始我以为完事了。结果用手机一看，布局全乱套了，文字跑到了图片上面，菜单挤成了一坨。我靠，响应式设计这个坑真是避不开。我赶紧又回去翻我的CSS文件，发现我之前为了方便，用的都是固定的像素单位。
接下来就是痛苦的修正过程。我把所有的宽度、高度、边距都从固定的像素改成了百分比和VH/VW这种相对单位。然后不断地在手机、平板和电脑上来回测试，看在不同分辨率下会不会变形。这个过程，我喝了三杯咖啡，一直搞到了凌晨四点多，才算把页面在主流设备上都拉平整了。
终于，我刷新了一下，发现一切都对劲了。虽然有些小细节，比如某个输入框的边框在火狐浏览器上看起来有点怪，但我实在懒得管了。我直接把浏览器缓存清干净，然后把网站地址分享给我的那帮测试群的朋友，告诉他们：“成了，这个反叛的使徒终于有家了！” 干完这活，我感觉整个人都虚脱了。但是看着这个充满自己风格的页面，心里还是挺踏实的。
实践证明，搞网站不一定非要上高大上的技术，有时候，简单粗暴的土办法，反而更适合我们这种只想着把东西搞出来的人。