springboot-vue-后台管理系统-前端部分
上一级页面：springboot-vue-后台管理系统
本系列关注前端部分,根据学习路线图达到学习Vue.js的目的
developer路线图developer-roadmap/translations/chinese at master · kamranahmedse/developer-roadmap
前言
前端我使用尚硅谷提供的模板文件，自己引入vue-js，对其做一些改造，
- 一方面是练手vue-js，我的vue.js刚刚学完基础部分，改造这个难度刚刚好，能够拿来练手。可以当作Vue.js的Demo项目来做
- 另外一方面是考虑到前后端分离的大环境，只有后端程序员还在用
Thymeleaf。所以用vue.js来做前端是有必要性的
基础知识
需要先学习vue的基础知识，见vue-js-学习索引
基础语法+代码编写量+练手
在本节我们复习了大部分vue的基础语法，有了一定的代码编写量，最终以一个封装好的Vue分页组件作为结尾。
springboot-vue-后台管理系统-前端部分-p1-基础语法-代码编写量-练手
接下来的工作-ui库技术选型
剩下的部分就是将前面小节学习到的内容用在接下来的开发过程中，是从业务层面考虑问题，而不是技术层面。
- 偏向业务，实际开发的，可以尝试antdesign、element-plus、vant
- 想要体验单人开发的爽快感觉，可以使用quasar、Vuetify
- 在擅长场景中：PC端用ant design，elmentui。移动端用vant。多端用vuetify，quasar。全套用uniapp。(PC中后台用iview)
综上，本文接下来使用element-plus
ui库
从本节开始，会使用element-plus这个ui库。
springboot-vue-后台管理系统-前端部分-p2-ui库
用到的技术栈
vuex 和 pinia
vuex和pinia的功能类似，只需要安装其中一个即可。
vuex 和 pinia 是同团队成员编写，但是 pinia 写法上更加人性化，也更简单
Pinia 是 Vue.js 团队成员专门为 Vue 开发的一个全新的状态管理库，并且已经被纳入官方 github
官方推荐的是 Pinia。本项目也使用pinia
pinia快速上手
关于pinia快速上手，见vue-js-pinia-快速上手
vue router
关于vue router快速上手，见vue-js-vue-router-快速上手