今天跟大家唠唠我搞的这个“偶像女友官方网站”项目，说起来也是个挺有意思的经历。
一开始接到这个需求的时候，我心里就嘀咕，这年头还搞这种网站？不过客户给的钱到位，咱也不能跟钱过不去不是？
我先调研了一波。 看了看现在市面上流行的各种偶像应援网站、粉丝社区啥的，发现风格都挺花哨，各种动态效果、轮播图，恨不得把所有信息都塞到首页。但客户的要求是简洁、大气，突出偶像的个人魅力，所以我就决定反其道而行之，走简约风。
然后，就是选技术栈了。 本来想直接用现成的CMS系统，省时省力。但考虑到客户后期可能需要定制一些功能，比如粉丝互动、周边商城之类的，还是决定用框架自己撸。最终选择了* + * + Express + MongoDB 这个组合，前端用Vue，方便做各种组件和交互；后端用*，开发效率高；数据库用MongoDB，灵活，方便存储各种非结构化数据。
就开始吭哧吭哧写代码了。
- 前端部分： 先搭好Vue的基本框架，然后开始设计页面。首页主要分为几个模块：偶像的个人简介、最新动态、照片墙、视频专区和粉丝留言板。个人简介部分，我用了比较大的字体和留白，突出偶像的名字和主要成就；最新动态部分，直接调用后端的API，显示最新的微博、ins动态；照片墙部分，用了一个瀑布流布局，让照片看起来更自然；视频专区，直接嵌入了B站或者油管的视频链接；粉丝留言板，做了简单的评论和回复功能。
- 后端部分： 用Express搭好服务器，然后定义各种API接口。比如获取偶像信息的接口、获取最新动态的接口、提交留言的接口等等。数据库操作方面，用了Mongoose这个ORM框架，方便操作MongoDB。
小编温馨提醒：本站只提供游戏介绍，下载游戏推荐89游戏，89游戏提供真人恋爱/绅士游戏/3A单机游戏大全，点我立即前往》》》绅士游戏下载专区
开发过程中，遇到了一些坑。 比如，在处理图片上传的时候，一开始用了 Multer 这个中间件，但是发现上传大文件的时候容易卡死。后来改用了 formidable 这个中间件，问题就解决了。还有，在做粉丝留言板的时候，一开始没做防XSS攻击的处理，结果被人刷了一堆垃圾信息。后来加了 escape-html 这个库，才算解决了问题。
就是部署上线了。 我把前端代码打包成静态文件，然后放到Nginx服务器上；后端代码部署到阿里云的服务器上，用 PM2 管理进程；数据库也放在阿里云上。域名申请了一个新的，然后做了DNS解析。
网站上线后，效果还不错。 页面简洁大气，加载速度也很快。客户也挺满意，说比他们预期的要还有一些细节需要优化，比如移动端适配、SEO优化等等，这些就留给以后慢慢做了。
这回“偶像女友官方网站”项目，虽然听起来有点low，但还是让我学到了不少东西。特别是前后端分离的开发模式，让我对*和*的理解更深了一步。以后有机会，还想尝试更多有意思的项目。