微头条项目

昨天抽时间把刚学完spring的项目练手的项目根据文档又重新写了一遍,个人感觉这个项目真的很基础有助于新手入门(在这里感谢一下尚硅谷的资源)
在这里分享给大家 微头条项目

案例介绍

用户功能

  • 注册功能
  • 登录功能
  • jwt实现

头条新闻

  • 新闻的分页浏览
  • 通过标题关键字搜索新闻
  • 查看新闻详情
  • 新文明的修改和删除

技术栈介绍

前端技术栈

  • ES6作为基础JS语法

  • nodejs用于运行环境

  • npm用于项目依赖管理工具

  • vite用于项目的构建架工具

  • Vue3用于项目数据的渲染框架

  • Axios用于前后端数据的交互

  • Router用于页面的跳转

  • Pinia用于存储用户的数据

  • LocalStorage作为用户校验token的存储手段

  • Element-Plus提供组件

    后端技术栈

  • JAVA作为开发语言,版本为JDK17

  • Tomcat作为服务容器,版本为10.1.7

  • Mysql8用于项目存储数据

  • SpringMVC用于控制层实现前后端数据交互

  • MyBatis-Plus用于实现数据的CURD

  • Druid用于提供数据源的连接池

  • SpringBoot作为项目基础架构

  • MD5用于用户密码的加密

  • Jwt用于token的生成和校验

  • Jackson用于转换JSON

注意事项

具体的代码可见文章首页的链接,下面我说一下大家在敲代码时可能会出现的问题:

数据库连接池的配置

大家要注意在pom.xml中把版本更换成1.2.20否则会报错

1
2
3
4
5
6
<!-- druid启动器的依赖  -->
      <dependency>
          <groupId>com.alibaba</groupId>
          <artifactId>druid-spring-boot-3-starter</artifactId>
          <version>1.2.20</version>
      </dependency>

还有就是在application.yml中注意url: jdbc:mysql:///sm_db,时sm_db不是sm_db1

1
2
3
4
5
6
7
8
spring:
  datasource:
    type: com.alibaba.druid.pool.DruidDataSource
    druid:
      url: jdbc:mysql:///sm_db
      username: root
      password: 123456
      driver-class-name: com.mysql.cj.jdbc.Driver

路径问题

在PortalController中注意若你选择的路径为findNewPage如下代码:

1
2
3
4
5
@PostMapping("findNewPage")
public Result findNewPage(@RequestBody PortalVo portalVo){
    Result result = headlineService.findNewPage(portalVo);
    return result;
}

则需要在前端项目中api/index下将findNewsPage改为findNewPage

1
2
3
export const getfindNewsPageInfo = (info) => {
  return request.post("portal/findNewPage",info);
};

以下是我写的这个项目

微头条项目