如果你閱讀過我們的《ThinkPHP5.0入門實例教程》,那么可直接跳過本節,因為我還是那我,風格也還是那個風格。如果你第一次和我們接觸,想更多的了解我們,那請繼續閱讀。
*****
光陰荏苒,日月如梭。距離寫上一部《ThinkPHP5.0入門實例教程》的時間已3年有余。2016時自己還是個30歲出頭的小伙,現在卻已然成為快邁入40歲的大叔。幸運的是,我還在編程與教學的第一線奮戰著,用自己做為demo來展示著35歲以后一個軟件開發工程師的狀態。很榮幸,我沒有得頸椎病,也依然是那個一個月不理就會影響市容的滿頭黑發。
剛剛看了2019年9月全國程序員工資統計,其實我對按語言來排行說明工資水平的統計方法是有質疑的,因為你的收入多少絕對不是取決于你用什么語言,而是取決于你的技術水平。但對其展示出的崗位需求還是感興趣的:

如上圖示:JAVA+PHP+JAVASCRIPT的招聘百分比總計為51.07%,這嚴重的證明了現在正在學習本門課程的你是有多么的明智。因為如果你掌握了本部教程,那么在100個招聘崗位中,我們有近半數的選擇空間。
> 我們本課程中使用了TypeScript來代替JavaScript,借助于Webpack,我們可以使TypeScript完美的與JavaScript共同起舞。
# 適用人群
* 擁有使用前后臺不分離的框架(如ThinkPHP)開發小型系統的能力。
* 對面向對象有一定的了解,了解一般的控制語句。
* 有HTML基礎,可以使用HTML+CSS完成個人主頁的開發。
* 有安裝數據庫系統的能力,可以使用數據庫管理軟件完成數據庫、數據表的建立。
* 掌握一般的SQL語句,比如:`select * from student`。
欲速則不達,如果你還處于計算機小白階段,我們強烈的推薦你先學習一些基礎的知識。多年的教學經驗來看,這些基礎的知識是早晚都要學習且躲不過的。
[商業網站開發入門(免費)](https://mengyunzhi.github.io/WebCourse2017/)
[ThinkPHP5入門實例教程(核心章節免費)](http://www.hmoore.net/yunzhiclub/thinkphp5guide)
本教程在編寫的過程中,假設你已經對上述兩個教程進行了深入的學習。擁有了使用HTML+CSS完成了個人站點開發的能力,擁有使用ThinkPHP完成小型系統開發的能力。
## 正文
學習完本教程:
你將了解到一般的中小型應該是如何在前后臺分離的思想下進行開發的;將能夠使用Spring Boot開發一般的后臺應用程序;會對Spring Boot中的兩個核心IOC以及AOP有個基本的認識;會更新充分的理解面向對象的思想并將其應用到自己實際的系統開發中;將能夠使用Angular開發一般的WEB應用;了解觀察者模式并能夠熟練的將其應用的其它場合;了解前后臺分離的WEB應用是如何解決跨域問題的,為自己走向全棧工程邁開堅實重要的一步。
本教程由開發『教務管理系統』實例入手,逐步展示了一個系統從無到有的過程。在教程中,我們將Spring Boot以及Angular的知識點一步步地帶入,同時結合對官方文檔的學習。我們希望最后大家帶走基礎知識的同時,將我們長期以來積累的學習方法也一并帶走。如果你恰是河北工業大學的一員,熱愛編程并愿意投入自己寶貴的時間與我們共同學習,那么請選擇校內選修課程《商業網站開發入門》,我們期待在最近的5月份與你相逢。
## 技術簡介
本文主要使用Spring Boot進行后臺的開發,使用Angular進行前臺的開發。它們都是偉大并值得讓我們敬佩的框架。在此,向框架的作者們表示感謝。
### Spring Boot
### Angular
# 寫在前面
本教程中的對很多問題的解釋基于當前我們自身的水平以及我們揣測的讀者的水平。在軟件開發過程中,很自然的會遇到一些問題,在解決問題的過程中,我們傾向于找到一個自己可以認同并適用于解決當前問題的理論來支撐自己解決問題的方法。這個方法是否真的正確其實并不重要,只要在當前給我們足夠支撐就夠了。所以在教程中,有些東西我們會用`自動`來解釋。問:為什么會是這樣? 答: 自動。在筆者的教學與開發經驗中,我認為這不失為一種特別有效的教學與學習方法。
有人說老師既然有些東西你明明知道講的不對或是講的不恰當,為什么不深入的講一下呢?一方面是由于在`適用的就是最好的`這個理論的驅動下,有些事情我也沒有搞清楚更深層次的原理;另一方面則還是在`適用的就是最好的`這個理論的驅動,我認為大家也沒有必要非要在當前階段搞清楚。這和平常我們學習一下,一定要清楚自己當前的學習目標。
比如:我們高中學習的經典物理中的牛頓的三定律,其中第二條是加速度定律,它在高中階段為我們解決了很多的物理問題現實問題。但是如果是這樣:這個我們一直某個物體上施加力F,那么就會有一直有加速度a,速度v必然會越來越大,上限應該是正無窮。這與在大學期間老師講的一切物體的最大速度都不可能超載光速就相違背了。當我們發現f=ma在某些時候不適用的時候,我們進步了,得出了更適用的結論:牛二定律只有在速度不太大,質量不太小的時候是適用的。
> 適用的就是最好的,證真初步認識、證偽提升認識。人類的科學史也是證真、證偽中逐步發展向前的。
- 序言
- 第一章:Hello World
- 第一節:Angular準備工作
- 1 Node.js
- 2 npm
- 3 WebStorm
- 第二節:Hello Angular
- 第三節:Spring Boot準備工作
- 1 JDK
- 2 MAVEN
- 3 IDEA
- 第四節:Hello Spring Boot
- 1 Spring Initializr
- 2 Hello Spring Boot!
- 3 maven國內源配置
- 4 package與import
- 第五節:Hello Spring Boot + Angular
- 1 依賴注入【前】
- 2 HttpClient獲取數據【前】
- 3 數據綁定【前】
- 4 回調函數【選學】
- 第二章 教師管理
- 第一節 數據庫初始化
- 第二節 CRUD之R查數據
- 1 原型初始化【前】
- 2 連接數據庫【后】
- 3 使用JDBC讀取數據【后】
- 4 前后臺對接
- 5 ng-if【前】
- 6 日期管道【前】
- 第三節 CRUD之C增數據
- 1 新建組件并映射路由【前】
- 2 模板驅動表單【前】
- 3 httpClient post請求【前】
- 4 保存數據【后】
- 5 組件間調用【前】
- 第四節 CRUD之U改數據
- 1 路由參數【前】
- 2 請求映射【后】
- 3 前后臺對接【前】
- 4 更新數據【前】
- 5 更新某個教師【后】
- 6 路由器鏈接【前】
- 7 觀察者模式【前】
- 第五節 CRUD之D刪數據
- 1 綁定到用戶輸入事件【前】
- 2 刪除某個教師【后】
- 第六節 代碼重構
- 1 文件夾化【前】
- 2 優化交互體驗【前】
- 3 相對與絕對地址【前】
- 第三章 班級管理
- 第一節 JPA初始化數據表
- 第二節 班級列表
- 1 新建模塊【前】
- 2 初識單元測試【前】
- 3 初始化原型【前】
- 4 面向對象【前】
- 5 測試HTTP請求【前】
- 6 測試INPUT【前】
- 7 測試BUTTON【前】
- 8 @RequestParam【后】
- 9 Repository【后】
- 10 前后臺對接【前】
- 第三節 新增班級
- 1 初始化【前】
- 2 響應式表單【前】
- 3 測試POST請求【前】
- 4 JPA插入數據【后】
- 5 單元測試【后】
- 6 惰性加載【前】
- 7 對接【前】
- 第四節 編輯班級
- 1 FormGroup【前】
- 2 x、[x]、{{x}}與(x)【前】
- 3 模擬路由服務【前】
- 4 測試間諜spy【前】
- 5 使用JPA更新數據【后】
- 6 分層開發【后】
- 7 前后臺對接
- 8 深入imports【前】
- 9 深入exports【前】
- 第五節 選擇教師組件
- 1 初始化【前】
- 2 動態數據綁定【前】
- 3 初識泛型
- 4 @Output()【前】
- 5 @Input()【前】
- 6 再識單元測試【前】
- 7 其它問題
- 第六節 刪除班級
- 1 TDD【前】
- 2 TDD【后】
- 3 前后臺對接
- 第四章 學生管理
- 第一節 引入Bootstrap【前】
- 第二節 NAV導航組件【前】
- 1 初始化
- 2 Bootstrap格式化
- 3 RouterLinkActive
- 第三節 footer組件【前】
- 第四節 歡迎界面【前】
- 第五節 新增學生
- 1 初始化【前】
- 2 選擇班級組件【前】
- 3 復用選擇組件【前】
- 4 完善功能【前】
- 5 MVC【前】
- 6 非NULL校驗【后】
- 7 唯一性校驗【后】
- 8 @PrePersist【后】
- 9 CM層開發【后】
- 10 集成測試
- 第六節 學生列表
- 1 分頁【后】
- 2 HashMap與LinkedHashMap
- 3 初識綜合查詢【后】
- 4 綜合查詢進階【后】
- 5 小試綜合查詢【后】
- 6 初始化【前】
- 7 M層【前】
- 8 單元測試與分頁【前】
- 9 單選與多選【前】
- 10 集成測試
- 第七節 編輯學生
- 1 初始化【前】
- 2 嵌套組件測試【前】
- 3 功能開發【前】
- 4 JsonPath【后】
- 5 spyOn【后】
- 6 集成測試
- 7 @Input 異步傳值【前】
- 8 值傳遞與引入傳遞
- 9 @PreUpdate【后】
- 10 表單驗證【前】
- 第八節 刪除學生
- 1 CSS選擇器【前】
- 2 confirm【前】
- 3 功能開發與測試【后】
- 4 集成測試
- 5 定制提示框【前】
- 6 引入圖標庫【前】
- 第九節 集成測試
- 第五章 登錄與注銷
- 第一節:普通登錄
- 1 原型【前】
- 2 功能設計【前】
- 3 功能設計【后】
- 4 應用登錄組件【前】
- 5 注銷【前】
- 6 保留登錄狀態【前】
- 第二節:你是誰
- 1 過濾器【后】
- 2 令牌機制【后】
- 3 裝飾器模式【后】
- 4 攔截器【前】
- 5 RxJS操作符【前】
- 6 用戶登錄與注銷【后】
- 7 個人中心【前】
- 8 攔截器【后】
- 9 集成測試
- 10 單例模式
- 第六章 課程管理
- 第一節 新增課程
- 1 初始化【前】
- 2 嵌套組件測試【前】
- 3 async管道【前】
- 4 優雅的測試【前】
- 5 功能開發【前】
- 6 實體監聽器【后】
- 7 @ManyToMany【后】
- 8 集成測試【前】
- 9 異步驗證器【前】
- 10 詳解CORS【前】
- 第二節 課程列表
- 第三節 果斷
- 1 初始化【前】
- 2 分頁組件【前】
- 2 分頁組件【前】
- 3 綜合查詢【前】
- 4 綜合查詢【后】
- 4 綜合查詢【后】
- 第節 班級列表
- 第節 教師列表
- 第節 編輯課程
- TODO返回機制【前】
- 4 彈出框組件【前】
- 5 多路由出口【前】
- 第節 刪除課程
- 第七章 權限管理
- 第一節 AOP
- 總結
- 開發規范
- 備用