我怎么把《女骑士蕾蒂西亚官网》这东西给弄出来的?
最近我手头几个大项目都收尾了,闲得发慌。上次跟老李在群里聊天,他还在那里吹嘘现在的建站部署有多复杂,动不动就要上容器,要搞什么云原生。我就不信那个邪,觉得现在人把事情想得太复杂了。
我跟老李打了个赌,我说我就用最土的办法,一个晚上,就能把那个《女骑士蕾蒂西亚》的非官方“官网”给你搭出来,而且速度保证飞快,打开不用等。
第一步:确定目标和技术栈,就是瞎搞。
目标很明确,就是静态网站。不需要数据库,不需要用户登录,就放点介绍和图片,让人能看看。技术栈?我压根没用什么框架,就打算用最原始的HTML和CSS,再加一点点JS来处理图片轮播。图个快,图个简单。
- 扒素材:我花了最长的时间在这上面。那会儿我到处翻,找了一堆高质量的官方设定图和原画集。这些图分散在各种小论坛和图站里,我得一个个把它们“请”下来。这个过程比写代码还累。
- 切图和压缩:图片太大肯定不行,影响打开速度。我用我那个老掉牙的图像软件,把几张主视觉图裁了一下,然后统一做了压缩,保证在不牺牲太多质量的前提下,体积降到最低。
第二步:开始堆代码,越快越
我直接在本机开了一个文件夹,开始敲代码。我这个人写东西比较糙,不像那些科班出身的,结构啥的先放一边,先把要显示的内容全丢进去再说。
我先搭了一个三段式的布局:顶部是Logo和导航条,中间是核心内容的展示区,底部是简单的版权声明。
我没有追求什么花哨的设计,整个页面就用了黑、白、红这三种颜色,突出主题的骑士感。中间的主展示区,我用一个简单的CSS Flexbox给他拉开了,把角色的立绘和背景故事文字并排摆着。因为内容不多,代码写起来那叫一个飞快,两个小时不到,主体结构就搭完了。
第三步:部署上线,遇到了点小麻烦。
我本地测试跑得好好的,速度嗖嗖的,但是要部署到公网上去,还得搞个服务器。
我手上有一个吃灰很久的廉价云主机,配置低得可怜,但跑个静态站绰绰有余。我直接把打包好的文件用SFTP传了上去。接着就是配置Nginx。
这玩意儿每次都要搞我一下。
我第一次配置Nginx的时候,端口老是冲突。我当时心想,我这机器上明明只跑了一个服务,怎么就冲突了?我折腾了快半个小时,才想起来,我之前随手装的那个监控服务偷偷占了80端口。我赶紧把它停掉,然后重新修改了Nginx的配置文件,把我的静态文件目录指了过去。
第四步:的测试和收尾。
配置完Nginx,我赶紧用手机和电脑分别访问了一下,速度确实快得吓人,几乎是秒开。老李当时看到我把链接丢群里的时候,他还不信,点进去一看,确实起来了。
他问我用了什么高端技术,我说屁的高端技术,就是纯静态,服务器都没用多少资源。那些说建站多复杂的人,就是自己把事情想复杂了。对于这种只展示内容的官网,越简单,就越稳定,速度就越快。
这回实践又让我明白了一个道理:很多时候,工具不是万能的,解决问题的思路和速度才是最重要的。我就是用最“土”的办法,把这个官网给搞定了。