准备阶段：脑子一热就开干

那天就是突然想捣鼓个新网站，以前都是用现成模板瞎改。这回非得自己从零搞，顺便记下来踩坑过程。

• 找纸笔乱画：先想清楚这破网站到底要干纯粹发点个人技术吐槽？还是想塞点照片视频？我蹲沙发上画了半小时鬼画符，憋出个能看的主页框框和几个栏目名字。
• 偷摸研究别人家：打开一堆常逛的网站，这回不看内容，专门盯着人家按钮放哪、颜色怎么搭、手指头怎么动最舒服。手机刷了几十个，眼睛都花了。

设计阶段：用软件瞎戳

掏出个画画软件（名字忘了，反正图标是个X），开始摆积木。

• 主页瞎搞：先画个大横幅背景图，挑个刺眼的蓝色。上面硬塞了个logo图片，丑得自己都想笑。
• 瞎戳按钮：首页那几个框框，每个点进去长啥样都得画出来。特别是写博客那个页面，研究怎么摆字和插图不打架，弄到半夜一点。
• 手机版抓狂：电脑版刚摸顺，发现手机屏幕太小！按钮挤成一团！又得把每个页面重新拉伸搓扁，搞成竖条条，拇指能戳到的才留，戳不到的砍掉！

开干代码：被浏览器暴揍

设计图打印出来贴墙上，抄起键盘就敲。

• 砌砖头：按照设计图的框框位置，先写
  和

  这些积木块，堆出个大概模样。
• 抹水泥：开始上CSS，调宽度高度、改颜色字体。左边浏览器开着设计图，右边开着代码编辑器。明明按设计图的尺寸写的，浏览器显示出来就是歪的！折腾一下午，发现是盒子模型搞鬼，骂骂咧咧加上 box-sizing。
• 手机噩梦：电脑显示刚顺眼，掏出手机一看，全乱了！文字叠在一起！赶紧补 @media 调整，按手机宽度重新定间距字号。测了iOS和安卓三台机器，每台都有幺蛾子，又塞了一堆针对的补丁代码。
• 动起来试试：想给按钮加点悬停变色特效，写个 hover 死活没反应，发现类名多打了个空格... 加了点页面滚动的淡入效果，代码一加，低配手机卡成PPT。

塞东西：差点掀桌子

终于有个空壳子了，该往里填内容。

• 自建存数据仓库：博客文章总不能全写死在代码里？研究了半天用个简单的本地数据库存文章和图片链接。建表的时候手抖，标题字段长度设短了，测试发长文直接截断，只好回炉重改。
• 后台挖坑：为了能方便发文章，硬着头皮写了个极简后台。登录框、写文章框、存草稿按钮。光一个富文本编辑器插件就折腾两天，不是排版乱了就是图片传不上去。
• 链接找不着北：点开博客列表，咋点进不去详情页？查了半天发现路由写错了，/blog/:id 写成 /blogs/:id，就因为多了个s，整晚白干。

挂出去：门牌号都搞错

本地跑顺溜了，得放网上给大家看。

• 租服务器：随便找了个按小时计费的云主机，装系统选了个最快的选项，一路下一步到底。
• 传文件像龟爬：把代码和数据库打包上传。网络抽风，600MB的东西传了快一小时，咖啡都凉透了。
• 找不着家门：配置服务器把域名指过去。以为等几分钟就结果等了俩钟头网站还打不开。发现DNS解析的域名拼错了一个字母，把"blg"写成了"big"！

这一圈折腾下来，什么敏捷流程都是扯淡，根本就是东拼西凑踩坑日记。前端瞎写，后端瞎搞，数据库瞎存，部署全靠运气。下次要是谁说一周就能搞定专业流程，我直接把这篇记录甩他脸上！对，昨天前同事还微信问我怎么搞，我说你看我博客，他回：“你博客网址？”，我又赶紧把刚写的部署好那条分享给他，结果分享完服务器又挂了... 洗洗睡。