•CSS 選取器是如何運作的？
•要怎麼提升網站效能？
•瀏覽器間的差異是怎麼形成的？
•為什麼要用框架？
•HTTPS 為什麼比較安全？
•瀏覽網頁時，過程中到底發生了什麼？

本書內容改編自第11屆iT邦幫忙鐵人賽，Modern Web組佳作網路系列文章——《前端三十
- 成為更好的前端工程師》，內容著重在現代前端開發者所必備的網站開發知識通識。

書中精選三十道網站開發常見問題，由最基礎的前端三兄弟：HTML、CSS、JavaScript 出發，逐一探討瀏覽器渲染原理、JavaScript 特性、演算法、網路基礎、前後端分離、效能優化、SEO 實踐等網站開發相關主題，與讀者您一起踏上前端進階之路。

❖三大特色❖
從陌生到熟悉：
•什麼是閉包？前端框架？SPA？SSR？SEO？陪你從頭認識那些以往似懂非懂的專有名詞，重新檢視整理自己的知識儲備。

從疑惑到解答：
•由類似面試提問的標題名稱展開各別章節，並在內文逐步引導至關鍵知識點，帶你逐一擊破三十道難題。

從入門到進階：
•HTML、CSS、JavaScript、Frontend、Backend、Web，循序擴大範疇的六大主題，相互串接、彼此關聯，讓你掌握網站開發關鍵知識，踏上前端進階之路。

作者簡介

朱信穎 Gary Chu

•網站開發者，過去曾先後任職於奧丁丁集團、一零四資訊科技、米亞科技；擅長前端開發，擁有多年業界實戰經驗。

•喜歡學習，更喜歡分享所學；連續兩年分別以主題《JavaScript音樂漫遊 - 30天探索Web Audio》及《前端三十 - 成為更好的前端工程師》獲得iT邦幫忙鐵人賽Modern Web組佳作，並於2019年加入ALPHA Camp擔任業界實戰專案導師及網站開發課程教案作者。

•希望自己在工作的同時，能為世界推動一點改變，為社會帶來些許額外的價值。

•相信一切安排都是最好的路。

聯絡資訊
•Email: ma.gary729@gmail.com
•LinkedIn: www.linkedin.com/in/gary-chu/
•Blog: medium.com/schaoss-blog

作者序
Chapter 01 你最近學會了什麼新東西？
Chapter 02 [HTML]script tag 加上 async & defer 的功能及差異？
Chapter 03 [CSS]Reflow 及 Repaint 是什麼？
Chapter 04 [CSS]z-index 與 Stacking Context 的關係是什麼？
Chapter 05 [CSS]元素選取器是如何運作的？
Chapter 06 [JS]請你在旁邊的白板寫個快速排序演算法
Chapter 07 [JS]瀏覽器 DOM 元素的事件代理是指什麼？
Chapter 08 [JS]請寫出間隔一秒印出1, 2, 3, 4, 5 的程式碼
Chapter 09 [JS]什麼是閉包？
Chapter 10 [JS]一般函式與箭頭函式的差異？
Chapter 11 [JS]如何處理網頁中的非同步？
Chapter 12 [JS]為什麼 typeof new Array() === 'object' ？
Chapter 13 [JS]為什麼判斷相等時不能用雙等號？
Chapter 14 [JS]深拷貝是什麼？如何實現？
Chapter 15 [JS]什麼是原型鏈？
Chapter 16 [FE]為何會有瀏覽器差異？怎麼處理？
Chapter 17 [FE]為什麼現在的前端都在用「框架」？
Chapter 18 [FE]為什麼網站要做成 SPA？ SSR 的優點是什麼？
Chapter 19 [FE]如何實現網站 SEO？
Chapter 20 [FE]如何提升網站效能？
Chapter 21 [FE]用過 Webpack 之類的打包工具嗎？為什麼需要？
Chapter 22 [FE]為什麼跨域請求會產生錯誤？如何處理？
Chapter 23 [FE]網頁的快取機制是怎麼運作的？
Chapter 24 [BE]請說明一下 npm 的套件管理機制
Chapter 25 [BE]Node.js 與 JavaScript 的關係是什麼？
Chapter 26 [BE]API 設計拿資料要透過 POST，會有什麼問題嗎？
Chapter 27 [WEB]Cookie & Session 是什麼？
Chapter 28 [WEB]HTTP 和 HTTPS 的差別是什麼？
Chapter 29 [WEB]網站常見的資安問題有哪些？
Chapter 30 [WEB]從輸入網址列到渲染畫面，過程經歷了什麼事情？
附錄A