今天跟大家唠唠我这几天折腾的“绿洲网”,就是个仿照之前挺火的那个“绿洲”APP,自己瞎鼓捣着玩儿。
就是想搞个能自己发点儿东西,然后朋友们也能看看的小地方。毕竟现在社交平台感觉都太大了,啥信息都有,乱糟糟的。就想弄个简单点的,清净点的。
所以第一步,先确定了要实现的功能。核心的嘛就是发状态,能带图片,能评论点赞。然后,得有个地方能看到大家发的东西,按时间顺序排列。 搜索功能也得安排上,方便找点感兴趣的内容。
选技术的时候也纠结了一下。想着快速搞出来,就用了比较熟悉的 * 做前端,后端用的是 * + Express,数据库选了 MongoDB,图省事。
搭环境就花了半天,各种依赖装起来,配置文件改来改去。总算把项目跑起来了,页面一片空白,心里还是有点小激动的。
接下来就是写代码了。先把发状态的页面搞定。一个简单的文本框,一个上传图片的按钮。图片上传这块,用了个现成的库,叫 `multer`,挺方便的,配置一下就能把图片保存到服务器上。
然后就是把状态保存到数据库里。这块逻辑比较简单,就是把文本内容、图片链接、发布时间啥的存进去。
显示状态列表的页面,就是从数据库里把数据取出来,然后按时间倒序排列,一条一条显示出来。这里用了 * 的 `v-for` 指令,循环渲染数据。
评论点赞这块,也花了点时间。评论功能,就是在状态下面加个评论框,提交评论后,把评论内容、用户ID、状态ID 存到数据库里。显示评论的时候,也是从数据库里取出来,显示在状态下面。点赞功能,就是在状态旁边加个点赞按钮,点一下,状态的点赞数就加一。
搜索功能,就是根据关键词在数据库里搜索状态内容,然后把搜索结果显示出来。这块用了 MongoDB 的 `$text` 索引,可以实现简单的全文搜索。
整个过程磕磕绊绊,遇到不少坑。比如图片上传路径配置不对,导致图片显示不出来。还有数据库连接不上,各种报错。不过一点一点解决,总算是把基本功能都实现了。
现在“绿洲网”已经能用了,虽然界面丑了点,功能也简单了点,但是自己用用还是挺开心的。之后打算再完善一下,加个用户系统,能关注好友,还能发私信啥的。慢慢来,反正就是自己瞎玩儿。