初始化后端項目：
File->New->Project->Spring Initializr身隐，指定JDK為JDK 8
設(shè)置Group：com.springbootvue速缨，Artifact：back伸辟，Java Version：8
相關(guān)依賴邑贴，選擇：web->Spring Web
選擇數(shù)據(jù)庫和mybatis相關(guān)依賴：SQL->Spring Data JDBC采够、MyBatis Framework 截汪、Mysql Driver
指定項目目錄：
創(chuàng)建完成完成后盏浇，項目結(jié)構(gòu)如下：
找到項目啟動文件璃谨，啟動項目匠璧，結(jié)果如下：
啟動結(jié)束后桐款，發(fā)現(xiàn)有報錯，根據(jù)提示顯示 夷恍，是database沒有配置
先在本地創(chuàng)建mysql數(shù)據(jù)庫：db_spring_vue魔眨，注意字符集和排序規(guī)則
再在application.properties文件加上如下內(nèi)容：
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.username=root
spring.datasource.password=qqq123
spring.datasource.url=jdbc:mysql://127.0.0.1:3306/db_spring_vue?characterEncoding=utf-8&serverTimezone=GMT&useSSL=false
再次啟動,啟動成功。
接下來酿雪，我們初始化前端Vue項目遏暴，前端項目開發(fā)當(dāng)下比較流行的有Vs code/ Webstorm/ Sublime?Text這幾個編輯器，
這里因為我們開發(fā)的前端內(nèi)容比較少指黎，就直接用Intellij Idea來開發(fā)了
初始化前端項目：
前端項目開始前朋凉，需要在Intellij?Idea安裝vue.js的插件，F(xiàn)ile->Settings->Plugins袋励，安裝完成后侥啤，需要重啟一下Intellij Idea
重啟Intellij?Idea后当叭，在創(chuàng)建項目時，會多一個vue的選項盖灸，F(xiàn)ile->New->Project->Java Script->Vue.js
指定前端項目目錄蚁鳖，我們跟后端項目放在同一個目錄下面
前端項目創(chuàng)建完如下：
創(chuàng)建完前端項目后，我們選擇打開springbootvue目錄赁炎，讓前醉箕、后端項目在同一個項目文件下可以編輯
打開E:/workspace/springbootvue后，效果如下：
展開springback目錄后徙垫，我們發(fā)現(xiàn)pom.xml跟原來的有點不一樣了讥裤，沒有maven項目的標(biāo)識了
正常應(yīng)該是這樣的：
我們打開pom.xml，右鍵選擇Add as Maven Project即可姻报。
切換到命令行Terminal模式己英，輸入如下命令：npm i -g cnpm --registry=https://registry.npm.taobao.org
等待下載完成以后，繼續(xù)安裝vue的腳手架工具吴旋，在Terminal內(nèi)輸入以下命令：
npm i -g vue-cli
測試是否安裝成功：
vue -V 注意损肛，這里的V是大寫
腳手架安裝完成后，初始化包結(jié)構(gòu),繼續(xù)輸入命令：
vue init webpack vuefront
過程中荣瑟，會詢問yes or no 治拿，不管它，一路按回車全部默認(rèn)笆焰，有興趣的可以關(guān)注一起提示的內(nèi)容
初始化完如下：
最后劫谅，啟動前端項目，輸入如下命令：
cd vuefront
npm run dev
完成后嚷掠，會提示在8080端口訪問
打開瀏覽器輸入：http://localhost:8080,出現(xiàn)以下畫面捏检，前端Vue項目初始化就算搭建完成了 。
優(yōu)化編碼Intellij Idea設(shè)置：
前后端項目的初始化都已經(jīng)完成叠国，并且都啟動成功了未檩，后續(xù)將開發(fā)一個登錄接口，把數(shù)據(jù)庫粟焊、前端冤狡、后端串聯(lián)起來。
再加上注冊接口和展示注冊的用戶接口项棠，后續(xù)會開發(fā)數(shù)據(jù)的增刪改查悲雳，以及上傳用戶頭像，導(dǎo)出用戶數(shù)據(jù)等香追。
在開發(fā)接口之前合瓢，我們對Intellij Idea進(jìn)行一些方便編碼的設(shè)置 。
自動導(dǎo)包設(shè)置：
我們在引用某一方法時透典，需要先導(dǎo)入方法所在的包晴楔，下面這個設(shè)置顿苇，可以讓Intellij Idea自動導(dǎo)入，
File->Settings->Editor->General->Auto Import
安裝配置Lombok插件
Java當(dāng)中要使用某個對象,必須還要寫一些getter和setter方法,可能還要寫一個構(gòu)造器税弃、equals方法纪岁、或者h(yuǎn)ash方法.這些方法很冗長而且沒有技術(shù)含量,我們叫它樣板式代碼.
lombok的主要作用是通過一些注解，消除樣板式代碼则果。
安裝Lombok插件：
點擊File-- Settings設(shè)置界面幔翰，開啟 AnnocationProcessors：
