前言

人工智能技術的快速發展，掀起了人們學習編程的浪潮，因為只有通過學習編程，人類才不會被機器取代，并且有可能成為赫拉利眼中的“神人”，成為統治機器的領導者。過去，編程好像只是一些聰明人的跑馬場，普通人只能在場外轉悠。然而，網絡打破了入場的柵欄，借助網絡，世界各地的人們頻繁且高效地進行思想交流。于是，一個空前的創新時代出現了。近年來，只要幾個月就會冒出一門新的編程語言，仿佛人人都能發明一門語言，我們是如此的幸運，趕上了這么好的時代。如果你也想成為一名發明家，那么，請從學習編程開始。

眾所周知，學習編程的第一步要學習一門語言，那么該如何選擇呢？是基礎的C語言，還是高級的Java語言？如果你也有上面的疑惑，請參考一下每年的十大最流行編程語言排行榜。2020年排在第一位是JavaScript，可見它是最受歡迎的語言，原因是JavaScript不僅用途廣泛、使用簡單，并且具有良好的可移植性；它的應用常見于Web開發，比如網站和App，還可以用于開發游戲。最重要的是，當今是移動互聯網的時代，Web開發技術已經成為剛需。如果你想學習Web開發，請從本書開始。

什么是Web全棧開發

Web全棧開發的概念是扎克伯格在2014年第一次提出的，但到目前為止，人們尚未對Web全棧開發給出一致的定義。普遍比較認可的一種觀點是，一個Web應用產品（比如網站、App）從技術方面來看，可以分為前端和后端，而全棧就是涵蓋了前后端兩種技術棧的總稱。具體來說，這些技術棧包括前端開發（HTML、CSS和JavaScript）、服務器部署、數據庫（比如MySQL和MongoDB）、后端開發（PHP或Nodejs）、性能優化技術（比如緩存）等。如果要全面掌握這些技術至少需要五年，然而這不是本書的意圖。本書只是希望從前/后端編程技術出發，帶你初步領略一下Web全棧世界。本書的寫作目的有以下三個：

第一，對初學者友好，通過揭示Web應用的工作原理和Web開發需要的編程技術，結合大量實例，幫助你輕松打開Web開發世界的大門；

第二，詳細地描述搭建完整Web應用的全部流程，便于你快速了解前端工程師需要做什么，后端工程師更看重什么，以及前端工程師與后端工程師之間如何配合；

第三，清晰地展示Web開發崗位的職業晉升路線，先成為一名前端工程師，再轉為后端工程師，逐步升級到全棧工程師，最終成為系統架構師。

編程語言只是工具

市面上大多數Web開發書籍都是以編程語言的語法介紹和使用為主線，包括羅列HTML的標記，展示CSS的樣式屬性和選擇器的用法，講解JavaScript的基本語法等。很多讀者表示，這些語言學完后，還是不會做Web開發，也記不住這么多的語法。原因在于，這類“手冊式”的書，只是為你提供了一個個獨立的知識點，而具體應用時，則需要對這些知識點進行多種組合和不斷實踐。但是，關于如何去組合和實踐，卻沒有告訴你。

本書想告訴你的是，編程語言只是工具，是幫助你建設一個Web應用的手段而已。所以，你應該有個具體的挑戰目標，想要搭建一個什么樣的網站或App，然后對應著各個頁面的功能，去學習所需的技術就好，沒有必要把每一門編程語言的所有語法都學一遍再動手；實話告訴你，很多CSS的樣式屬性你可能未來十年也用不到。實際上，學習Web開發技術，樹立一個明確的目標才是最重要的，而編程語言只是實現目標的手段，千萬不要本末倒置。有了目標之后，就要不斷嘗試與實踐，這才是打開Web開發世界大門的正確方式。

主張帶著任務主動學習

有效的學習一定是主動的，只有當你為了解決問題而去有意識地學習，才會真正有效果。如果你以前只是一味地跟著作者的思路走，那么大概率是，你以為看完了全書好像什么都會了，實際上，一周過后，你會發現，全書跟你一點關系都沒有。因此，本書提倡以任務為主的學習，通過給出若干個任務（示例），讓你思考并選擇合適的技術去完成任務。要知道，所有技術只是為你建造Web大樓提供水泥和鋼筋而已，其設計和實施才是核心，而這兩項重要任務的決定權完全在你。

全書內容框架

全書從總體上來看，可以分為4個部分。

第一部分是準備工作。第1章，主要介紹Web的發展歷史和規律，重點揭示Web的工作原理。第2章，安裝必要的開發工具，為正式的開發做準備。

第二部分是詳細闡述前端開發技術。第3～5章，圍繞前端的基礎技術展開，包括HTML、CSS和JavaScript這三大核心技術，能夠實現交互式網頁的基本搭建。第6～9章，深入地介紹對象的使用，并重點介紹框架的用法和對于快速開發的意義。

第三部分是關于后端開發技術的介紹。第10～13章，重點介紹服務器端的開發技術，包括PHP腳本的用法，MySQL數據庫技術能做什么，以及PHP和MySQL之間的合作。

第四部分（第14章）是一個綜合項目。目標是通過一個綜合項目實戰，展示如何將前端技術和后端技術相結合，實現一個強交互性的全棧。

本書適合哪些讀者

本書可以作為想要成為具有競爭力的全棧工程師的入門書籍。其中，前端技術包括HTML、CSS、JavaScript，以及CSS的框架Bootstrap和JavaScript的jQuery；后端技術主要是PHP和MySQL。或許你已經聽說過這些技術，但好奇為什么沒有提到當下流行的框架，Vue.js和AngularJS，以及后端的代表Node.js，原因是它們并不適合初學者（連全棧是什么都不懂的小白），它們更適用已經練就了基本功并且已經具備實戰經驗的開發人員，它們是用來提高效率的，而不是領你入門的。如果你現在只是一個程序員小白，恭喜你，你選對了書。因為學完本書，我保證你將對Web全棧開發有一種“原來如此簡單”的感覺，因為我不只是手把手教你做Web開發，而是將其中暗藏的玄機（技巧和原理）告訴你，讓你不至于為了一個坑而陷進去很久出不來。但同時，我要鄭重聲明，本書不是手冊式教程，所以不會列出Web開發需要的所有語法和用法，而是會挑選出重點且具有啟發意義的內容，幫助你盡快上路，從而找到進入Web世界的鑰匙。

本書配套資源

對于執著于源代碼的讀者，我自然不敢怠慢，只要你從正版途徑購買了本書，書中所有的源代碼會隨書附贈；除此之外，為了幫助讀者理清圖書脈絡，也為了便于將本書用作培訓教學用書的老師方便講課，我抽取了全書的框架內容制作了PPT課件。以上內容作為本書的配套資源贈送給讀者，讀者可以通過封底的二維碼和下載鏈接提取使用。

為了保證讀者獲取配套資源的順暢度，還有以下備用鏈接，以作不時之需。

鏈接：https://pan.baidu.com/s/1HlP4suKFAVjQ5cu-Xcu-8A

提取碼：4m63

感謝與交流

受我自身能力所限，書中難免會有對技術解讀的不當和偏頗之處，如果你在閱讀本書的過程中發現了類似的錯誤與不恰當的表述，誠摯地歡迎你在github上寫下你的意見和建議（https://github.com/cathydongxueyan/Web-full-stack-develop），我會對你表示極大的感激，并將盡最大努力將其完善。

董雪燕

2020年12月