前言
隨著社會高度資訊化和數位化的不斷發展，不少中小企業也在這股資訊化潮流中紛紛轉為使用資訊化系統作為日常的管理平臺，一個好的系統能夠在減少管理成本的同時為企業高效賦能。
通常來講，企業的系統主要從3 種途徑獲取，一種是根據企業自身情況應徵開發人員進行自行研發；另一種是從訂製系統的廠商購買；最後一種是從大廠購買SaaS 系統，而大部分中小企業普遍面臨兩種情況，從訂製系統的廠商購買系統年費太高，從大廠購買SaaS 系統則不符合企業定制化的需求。面對這些情況，自行研發系統就變成了中小企業的首選。對於程式設計師來講，開發管理系統也佔據了目前應徵市場中較大的職位比重。
一個完整的系統開發流程包括功能需求設計、資料庫設計、後端功能實現、前端頁面設計與開發等多個階段，可謂處處皆是細節。筆者的Web 生涯從寫需求的程式設計師到擔任專案經理，到如今成為統籌企業內部系統開發的專案總監，歷經了多個中大型的複雜企業管理系統專案的開發，所以筆者想透過本書將一個完整的系統開發流程以簡單、通俗的形式分享給讀者們。
本書以目前流行的Express.js 框架、MySQL 資料庫和Vue.js 框架為核心，以真實開發專案的流程為主線，從頂層設計的角度介紹系統細節，結合在實際開發中普遍存在的功能需求問題進行程式實戰。讀者可以透過閱讀本書，了解在實際開發中應注意的細節，學習常用的開發工具和掌握多種不同的技術堆疊，知曉前後端之間的資料是如何流動的。筆者希望透過本書，能夠為已經在前、後端領域工作的讀者早日成為全端工程師提供幫助，也希望本書能夠為即將入職開發職位的讀者提供一份清晰、完整的開發指南。
本書主要內容
第1 章主要介紹資料庫技術的發展歷程、資料具備的複雜化和多樣化特性及如何處理資料。
第2 章主要講解不同的資料模型和後關聯式階段資料庫的基本要求，介紹MySQL 等多種主流的資料庫管理系統、SQL 語言基本語法，最後使用不同的方式建立資料庫。
第3 章首先介紹功能模組的設計過程，然後介紹如何根據功能需求設計資料庫的欄位，最後實現從0 設計使用者模組資料表。
第4 章主要介紹Node.js 的底層機制、常用的3 種套件管理器工具、Express.js 框架的路由和處理常式、測試工具Postman，並介紹註冊和登入功能應注意的細節，最後使用Express.js 框架實現註冊和登入功能。
第5 章從使用者管理模組的功能需求出發，逐步實現修改使用者基礎資訊的需求，並介紹使用Multer 中介軟體實現上傳圖片的方法，最後介紹表格分頁元件的邏輯並進行實現。
第6 章從產品管理模組的功能需求出發，講解如何設計產品的欄位，並對產品從入庫到出庫流程應有的功能進行實現。
第7 章主要介紹系統在不同場景下的埋點操作，設計和實現不同模組的埋點介面。
第8 章主要介紹使用Postman、Apifox 和Swagger 三種不同的方式實現介面文件。
第9 章主要介紹程式倉庫和Git 的安裝，使用視覺化工具Sourcetree 將後端程式上傳至程式倉庫。
第10 章主要介紹HTML、CSS 和JavaScript 的基礎語法，並介紹jQuery、Bootstrap 和Sass 框架，最後討論前端模組化、元件化、專案化性質和MVC、MVVM 兩種前端架構。
第11 章主要介紹Vue.js 框架的漸進式、宣告式程式、組件化、響應式等多種特點，並實現建立Vue 專案，最後分析專案的框架。
第12 章首先介紹Vue.js 的路由模組並結合路由建立Vue.js 組件；其次介紹UI 元件庫Element Plus，並使用其建立表單；最後介紹TypeScript 的常用語法並進行實踐。
第13 章主要講解頁面在版面配置、樣式和顏色方面應注意的要點，最後使用卡片元件完成登入和註冊頁面。
第14 章從前後端資料互動技術發展的角度介紹AJAX、ES6 的Promise 和async await、Axios 的內容及基礎語法，使用Axios 在前端二次封裝登入和註冊功能介面，並在前端頁面完成介面的呼叫，實現登入和註冊功能。
第15 章介紹如何建構系統的基本版面配置，使用UI 元件封裝通用元件麵包屑。在完成個人模組功能的同時介紹Vue.js 全家桶生態中的狀態管理器Pinia，實現父子元件之間的資料聯動。最後實現使用者模組的頁面和功能需求，並使用hooks 對模組的程式進行最佳化。
第16 章主要介紹如何實現產品模組從入庫、審核到出庫的完整流程，還介紹開放原始碼的視覺化圖表函數庫ECharts，並從企業許可權的角度透過動態路由表等方法實現不同部門之間和部門內部的功能劃分。
第17 章主要介紹伺服器的參數、購買伺服器的流程、購買域名、域名備案和解析、SSL 證書等內容，還介紹寶塔面板的安裝與環境配置。
第18 章主要介紹在寶塔面板實現專案上線伺服器的過程。
閱讀建議
本書是一本兼顧前後端開發的技術教學，完全模擬了企業實際開發專案的環境，詳細闡述了功能需求的設計過程、業務實現過程，以及在實際開發時可能會遇到的情況。適合高等院校電腦專業的學生、老師、即將入職或已在職的前後端工程師、企業專案經理等人士閱讀；即使是沒有使用過Node.js、MySQL、Vue.js 等技術堆疊的讀者，本書也能夠作為一本快速上手的開發教學；對前後端資料互動感興趣的讀者可透過本書了解完整的前後端開發流程。
有前端開發基礎的讀者，可透過閱讀第1~9 章學習和了解後端開發內容，並可透過閱讀第10~16 章鞏固和補充前端知識；具有後端開發基礎的讀者，可直接閱讀第10~16 章了解和學習前端開發過程，並可透過閱讀第1~9 章補充專案開發流程和資料庫設計知識；建議完全沒有實際開發經驗的讀者從頭開始按照順序詳細閱讀每章節的內容。
在學習本書時，書中的所有程式均可透過手寫的形式進行測試，書中提供了完整的測試流程，方便讀者在手寫介面時對照回應結果。由於時間倉促，書中可能會出現一些疏漏，如果讀者發現任何錯誤，請及時回饋給筆者。
繁體中文出版說明
本書原作者為中國大陸人士，為維持全書完整性，書中部分範例畫面維持簡體中文介面，在文中不再特別指出說明，請讀者閱讀時參考前後文，特此聲明。
致謝
本書的誕生，要感謝很多與之直接或間接相關的人，下面的致謝不分先後。
首先感謝清華大學出版社趙佳霓編輯的信任，使我在自己擅長的領域有機會來完成本書。在寫作的過程中，趙佳霓編輯全程熱心的指導給予了我極大的鼓勵。再次向趙佳霓編輯由衷地表示感謝！
其次感謝在開發路上一直保持技術交流的朋友——周向陽。他為本書在程式層面提供了寶貴的意見，同時還細心地幫助檢查敘述並修改錯誤。
感謝我的好友李晏清，在我寫書最辛苦的期間一直支援著我。沒有你，我可能不會寫出這樣一本書。
最後感謝我的家人，在我寫作期間給予的理解和支援，使我能全身心地投入到寫作工作中。
?
王鴻盛
