三国经典网

今天跟大家伙儿唠唠我做“血族少女”官网的那些事儿，纯属个人实践，大家随便看看。

一开始接到这个活儿，有点懵。啥是“血族少女”？ 后来一查，，大概明白了，心里有了点底。既然要做官网，那咱就得先缕缕思路。

• 第一步： 定需求。得搞清楚这个官网是给谁看的，想达到啥目的。是想展示“血族少女”的漫画？小说？还是游戏？或者周边产品？ 还有面向用户群体是谁？ 搞清楚这些才能开始做。
• 第二步： 确定风格。 “血族少女”嘛那风格肯定得有点暗黑，有点神秘，还得带点少女感。
• 第三步： 技术选型。 前端用啥框架？后端用啥语言？数据库用哪个？服务器买哪家的？这些都得提前定

小编温馨提醒：本站只提供游戏介绍，下载游戏推荐89游戏，89游戏提供真人恋爱/绅士游戏/3A单机游戏大全，点我立即前往》》》绅士游戏下载专区

我这回选的是 * 做前端，简单易上手。后端用的 * + Express，数据库用的 MongoDB。服务器就随便买了阿里云的 ECS。

开始干活

1. 前端页面搭建： 先把页面框架搭起来，用了 Vue CLI， 方便快捷。然后就是各种组件的编写， 首页、漫画/小说列表页、详情页、周边商城页等等。

2. 页面美化： 找了一些暗黑系的素材， 比如背景图片、字体等等。然后就是 CSS 各种调， 尽量让页面看起来有“血族少女”的味道。

3. 后端接口编写： 用 * + Express 搭建了一个简单的 API 服务器。 主要就是提供漫画/小说的数据接口。MongoDB 存数据， 通过 mongoose 连接。

4. 前后端联调： 前后端接口对接， 各种测试。 遇到不少坑， 比如跨域问题， 数据格式不匹配等等。 各种 Google， 各种 Stack Overflow， 总算是把问题解决了。

5. 部署上线： 把代码部署到阿里云 ECS 上， 用 Nginx 做反向代理。申请了域名， 做了 DNS 解析。 网站就上线了。

遇到的坑

• 图片加载优化： 漫画/小说图片太多，加载速度很慢。 用了图片压缩， CDN 加速等方式来优化。
• 响应式布局： 网站要在各种设备上都能正常显示。 用了 CSS 的 media query 来做响应式布局。
• SEO 优化： 为了让网站更容易被搜索引擎收录。 用了 meta 标签， 做了 sitemap， 提交给搜索引擎。

这回实践还是学到不少东西的。 从需求分析到技术选型， 再到开发部署， 整个流程都走了一遍。 虽然还有很多不足之处， 但也算是一个不错的开始。 以后继续努力， 争取做出更好的作品。