前语

咱们好，我是「周三不Coding」。

今日给咱们介绍一下我两个多月前做的一个微服务容器化项目 —— Kill Bug 编程学习 & 问答 & 接单网站！界面参照 “” 规划而成～

开发这个项目大约耗费了大约一周左右的时刻，根本功用已经开发结束啦，现在共享给咱们～

项目库房地址：github.com/ltyzzzxxx/k…

接下来，我会从如下几个维度为咱们介绍项目！

  • 项目展现
  • 项目初衷
  • 项目需求剖析
  • 项目技能栈
  • 项目架构

项目展现

Kill Bug 项目的核心内容、界面样式、规划风格都是参照 “” 进行规划，所以咱们看起来会很熟悉哈哈哈哈～

界面首页如下图所示：

耗时一周，我做了一个仿

  • 首页顶部是固定导航栏，用于选择「首页」、「问题页」、「赏格页」。

    详细什么是「赏格」，留到「项目初衷」部分与咱们详细共享

    顶部右侧为「发布按钮」与「用户头像」

  • 页面主体左边为分类（标签）选择栏

  • 页面主体中心为 Feed 流

  • 页面主体右侧为广告位

当点击「发布按钮」后，会跳转到对应的修改页面，如下图所示：

耗时一周，我做了一个仿

  • 顶部有两个按钮，用于选择「问题」或「赏格」。依据类型不同，对应显示的内容也不同

  • 修改器选用 Markdown 格式，左边为原始 Markdown 文本，右侧为预览文本

    详细修改的是什么内容，也留到「项目初衷」部分与咱们详细共享

当点击「用户头像」后，能够跳转到对应的「个人中心」界面，如下图所示：

耗时一周，我做了一个仿

  • 界面包括了「个人信息」、「个人成就」、「个人余额」、「个人问题或赏格列表」
  • 用户能够在此界面充值帐户余额

当点击任一问题或赏格时，能够跳转到对应的概况页面，如下图所示：

耗时一周，我做了一个仿

  • 界面中心为主体内容部分，包括标题、用户根底信息、标签、Markdown 内容等
  • 界面左边为点赞、谈论按钮，点击谈论按钮会下滑到底部谈论区
  • 界面左边为个人信息、Markdown 目录

底部谈论区暂不展现，咱们感兴趣能够到项目库房查看概况～

当点击 Message 按钮时，也便是向该用户发送音讯，能够进入到对应的谈天页面，如下图所示：

耗时一周，我做了一个仿

  • 界面顶部为谈天选择框，用于选择谈天类型，一种为普通谈天，另一种为赏格1对1私聊
  • 界面主体左边为谈天人列表，中心为谈天内容，左边为「协同修改」框

感兴趣的小伙伴请接着往下读，开端介绍项目的核心内容啦～

项目初衷

耗时一周，我做了一个仿

专业问答渠道的短缺

在日常开发的过程中，我发现自己常常需求去 Stack Overflow 中寻找一些处理计划，原因是国内很难找到一个专业的问答渠道，大部分的问题处理计划都是在一些博客网站如 CSDN、博客园或的文章中，质量良莠不齐，并且许多是转载翻译自 Stack Overflow。

为什么咱们不能做一款国产的 Stack Overflow 呢？营造一种「我为人人，人人为我」的问答气氛，戾气少一些，咱们互帮互助，一起处理问题。

假如国内有这样一个渠道，我信任各大编程网站上的劣质文章、转载文章、灌水文章一定会少许多！

信任咱们许多人都恨透了 CSDN 满天飞的广告和毫无养分的文章内容

这便是我想做 Kill Bug 项目的最大原因，尽管目前还只是 Toy Project 阶段，但我想咱们可不能够齐心协力一同共建一个渠道呢？

按需编程辅导服务的需求

国内现在编程训练组织众多，B 站等各大网站上也有数不清的教育资源，这也意味着咱们现在入门编程十分简单。

可是，有没有或许入门简单，可是自学仍是会糟蹋许多没必要糟蹋的时刻呢？

我觉得编程小白在入门的时分，很简单走弯路、踩坑。我其时转码自学编程时，就踩了许多坑。

其间最让我印象深刻的是，有一次我将 pom.xml 中 packaging 标签写成了 pom 而不是 jar，导致其时一直报错，一直找不到问题所在。最终，我花了 50 元子，在某宝找人帮我处理了。

咱们先别忙着笑话我，其时我还没有学习 Maven、Spring 等，只学了 Java，直接上手 SpringBoot，并且没有视频教程，纯探索

在初学编程时，踩坑是常常发生的事。经过踩坑，咱们能够加深印象。可是有些坑，却很影响咱们学习编程的热心和进展。

尤其是热心，其时那个 Bug 差点让我溃散，我现在还明晰记得自己熬到清晨三点多还没有处理那个 Bug 时的精神状态

于是，我就想有没有这样一个渠道，为广阔程序员供给1对1服务，也便是「赏格接单」功用。由渠道作为担保交易人，发单的人提出需求，接单的人处理需求。这儿的需求更倾向于短期需求，用于处理编程 Bug，这也便是项目名字由来 —— Kill Bug。

基于上述两个初衷，我便有了做这个项目的开端动力！

顺便解释一下，咱们能够看到项目是英文页面，其实是因为这是我几个月前的国外课程项目～（原来这才是最大动力 ）

项目需求剖析

带咱们了解完「项目初衷」后，咱们接着进入「需求规划」篇章！

在这一部分，我主要从用户需求动身，结构三个用户故事～

  • 作为一个程序员，我常常遇到 Bug，但各大编程网站质量良莠不齐，我想要一个能够快速处理我问题的中文编程问答网站，类似于 StackOverFlow。
  • 作为一个编程小白，我的自学能力还凑合，没有到需求报班的程度。可是我常常踩坑，并且身边没有认识的大佬帮我，因而糟蹋了大量的时刻。我需求找到一个大佬能够在我需求时协助我1对1处理问题，有偿也 ok！
  • 作为一个乐于协助他人的开发者，我有时不是不想帮，可是问题需求太含糊，没有任何细节，真实力不从心。我需求问题的详细信息！

从这三个用户故事，咱们能够将需求划分为两大模块：「问题模块」&「赏格模块」

耗时一周，我做了一个仿

  • 关于问题模块而言，用户的核心需求为：发布问题、答复问题、对答复内容质量进行评分

    • 更细节的需求为：用户在发布问题时，需求恪守问题标准，尽或许完善补充问题的细节。

  • 关于赏格模块而言，用户的核心需求为：发布赏格、接单人资质认证、接单、1对1私聊

    • 更细节的需求为

      • 在发布赏格时，需求给出详细的细节，并指定赏格金额（控制最小值和最大值）

      • 接单人需求在渠道进行认证，保证能力符合要求

      • 接单时，发布方和接单方需求做双向选择，以便在正式开端处理问题时达到开始的一致，避免后续分歧

      • 接单后，双方进入渠道供给的1对1私聊界面，并协同修改，进步功率。‘

        将1对1谈天放到渠道，也可保障双方的权益，防止暗里联系被骗

项目技能栈

详细如何启动项目，请参阅项目 README 文档～

前端技能栈

本人前端菜坤，并且写的时分比较急，请咱们看的时分忍一下，后续会逐步完善前端～

Technology Feature
React 根本 Web 结构
Next.js SSR 结构
Ant Design UI 组件库
Mobx 大局状态管理库
Axios HTTP 恳求库
Router 路由组件
Mock HTTP 恳求 mock
Quill Editor 富文本修改器
Socket 即时通信 / 协同修改
Js-Cookie Cookie 管理工具

后端技能栈

后端主要选用 SpringCloud 微服务架构，并结合 Docker 完成容器编列与快速部署。

假如咱们关于后端完成计划感兴趣的话，能够看看项目源码，我后续也会依据详细的功用，共享一些完成计划～

Technology Feature
Spring Boot 后端主体结构
Spring Cloud 微服务结构
Sentinel 流量控制组件
Dubbo 分布式 RPC 结构
MySQL 表数据存储
Redis 缓存数据库
Sa-Token 轻量级登录鉴权结构
Mybatis ORM 结构
Redisson 封装 Redis 操作
Websocket 通信技能
Hutool Java 工具库
Alibaba Cloud OSS 目标存储

项目架构

耗时一周，我做了一个仿

  1. 前端向后端发送恳求，恳求抵达 Gateway 网关。网关主要担任恳求断语、恳求转发、负载均衡、流量控制以及安全防控等，除此之外，网关还需求进行相应的授权与鉴权。

  2. 恳求经过网关转发到各个微服务模块，各个微服务之间或许存在相互调用，经过 RPC 结构 Dubbo 完成长途调用。

  3. 注册中心主要用于服务发现与服务注册

  4. 数据层主要选用 MySQL 与 Redis

    关于 Kafka 和 ElasticSearch，别离用于异步音讯与查找服务，会在后续版本逐步引入完善～

总结

这篇文章除了向咱们展现网站界面、项目技能之外，还为咱们详细共享了我做项目的初衷，并剖析了网站用户需求。

希望咱们看完之后也能有所思考，站在产品的视点，看看能不能就这个项目，挖掘出来更多有意思、有用的功用！或许也能够自己做一个更新的产品，处理咱们日常生活（不仅仅局限于编程范畴）中的需求！

假如咱们关于项目详细细节感兴趣的话，请看看 项目源码 呀，假如能够帮忙点个 Star 就更好啦～

假如文章内容关于你学习有协助的话，费事帮忙点个赞、收藏一下！下期再见！