哎呀!早知道就不會破版的CSS設計技巧:前端工程師防止佈局意外的必學密技 (電子書)

電子書哎呀!早知道就不會破版的CSS設計技巧:前端工程師防止佈局意外的必學密技 (電子書)

出版日期:
2023/07/04
88
490431
此商品享ShopBack 0.5%回饋;不適用於誠品分潤計劃、美安等現金回饋機制
事前防範勝過事後Debug!
以八大核心主題培養「防患未然」的匠人心態!
有效對抗莫非定律,洞察無法一眼看見的潛在性危險!


♚蒐集常見案例:本書範例均為常見的實務案例
♚視覺化程式碼:透過視覺化來掌握情境及重點
♚立即解決方案:迅速理解情況,立即使用於實戰
♚清楚情境編排:不必從頭閱讀,只需看

內容簡介

事前防範勝過事後Debug!
以八大核心主題培養「防患未然」的匠人心態!
有效對抗莫非定律,洞察無法一眼看見的潛在性危險!


♚蒐集常見案例:本書範例均為常見的實務案例
♚視覺化程式碼:透過視覺化來掌握情境及重點
♚立即解決方案:迅速理解情況,立即使用於實戰
♚清楚情境編排:不必從頭閱讀,只需看想要的主題


【內容簡介】

本書內容改編自第14屆iThome鐵人賽Modern Web組的冠軍系列文章《防禦性CSS-建立「防患未然」的匠人心態》。本書用淺顯易懂的程式碼及貼近生活的實際情境,來探討如何培養「防患未然」的思維。由於有些畫面佈局過於單純和簡單,因此會容易忽略其潛在的破版危險,這些令人容易忽略的潛在性危險,很有可能在你最不希望它出現的時候意外出現了,小則影響畫面上的美觀,大則影響產品在客戶眼中的專業形象,進而造成商業上的損失。

本書將這些常見的案例分成八個主題,逐一探討每一個問題會發生的情境,以及提供解決這些問題的具體方法和技巧,希望在這些案例分析的過程當中,以容易上手的程式碼,帶領讀者慢慢培養「防患未然」的思考習慣,即使是一行簡單的CSS,也能夠充分展現專業的程式設計態度。



【目標讀者】

♚想讓自己的網頁避免不預期錯誤的前端開發者。
♚希望快速累積切版經驗的前端開發者。
♚希望讓自己的網頁能看起來更專業的開發者。
♚希望自己對於CSS不再懼怕的新手。



【好評推薦】

「這本專門探討防禦性程式設計的書中舉了許多案例,並一一說明應該事先考慮到什麼樣的狀況,以及應該怎麼利用CSS的彈性去防止頁面的跑版。書中的許多案例都是我自己以前在工作上曾經碰過的狀況,所以我能保證書中的內容絕對實用。這本書對沒有這麼多經驗的新手工程師來說特別有幫助,因為能夠及早學習到各種防禦性程式設計的技巧,並且運用在工作上。我誠心推薦這本防禦性程式設計的書籍,若是看完並且將此知識應用在工作上,絕對能提升樣式的可靠性。」

──技術部落格Huli's blog站長,Huli



「對於初學者來說,這本書不僅說明CSS的語法,更重要的是它引導讀者理解資深工程師的思考方式和解決問題的策略。對於有經驗的開發者來說,本書能夠幫助讀者回顧並整理已經學習過的知識,在溫故中學習新知。無論你是CSS的初學者還是資深工程師,我相信這本書都能夠帶給你不同的收穫。」

──PJCHENder網頁開發咩腳版主、《從Hooks開始,讓你的網頁React起來》作者,陳柏融



「這是一本讀起來很舒服、沒有壓力的專業書籍,我想只有在業界經歷過無數風雨的人,才能以如此幽默、淺顯易懂的方式,用實際案例帶讀者了解避免破版的CSS設計技巧。」

──全端工程師、暢銷書作家、ChatGPT、科普AI講師及全台第一本ChatGPT應用專書作者,林鼎淵



「魔鬼藏在細節裡,特別在開發網站時又更是如此,如果開發者能先預見到許多情境,就能更好地掌控自己的產品,提升作品的質感,節省修改程式的時間。在本書中,作者將分享自己在開發中習得的各種經驗及知識無私分享給讀者,幫助讀者在開發時能儘可能考慮到各個面向,防止各種佈局意外。對於希望在網站前端開發或網站版面設計上提升自己的人,我強烈推薦這本著作給你。」

──搞定學院學習社群創辦人、知名外商Hewlett-Packard資深工程師,Jimmy Chu



「這本書對工程師有益,對設計師和產品經理也大有幫助。在思考產品功能設計和開發時,它提供了寶貴的原理參考,成為不可或缺的指南之一。」

──Product Manager,Anderson Tu



「使用者體驗、商業策略、工程開發可行性在產品設計中都是基本要素;這本書讓我在執行設計思考可行性評估時幫助很多,是身為設計師的我在日常工作中的必備工具書。」

──UIUX Designer,Jerry Wu



「本書詳細討論了前端實戰中撰寫CSS時需要考慮的各種面向。作者將自己多年的經驗融入其中,展示了一位資深前端工程師在面對UI Mockup時思考的各種情境和細節處理。透過閱讀這本書,讀者不僅能學習到實戰技巧,還能培養在撰寫CSS時思考各種edge case的心態,這是我認為最有趣的部分之一。」

──前端工程師,Joy Hung



「作者用詼諧有趣且淺顯易懂的方式,講解防禦性的前端設計思維,讓對於前端比較不熟悉的後端工程師也能看得懂,並且能從中獲得一些不一樣的思考方式。」

──Teamt5 Backend Engineer,Jack



「這本書以淺顯易懂的方式介紹了一些CSS設計觀念,非常適合那些希望提升前端切版技能並避免常見設計缺陷的讀者。」

──Rakuten Fullstack Engineer,Lance
展開看更多

產品目錄

|CHAPTER 01| 防禦性程式設計簡介
|CHAPTER 02| 不失禮貌的安全距離
|CHAPTER 03| 又是那令人在意的長短問題
|CHAPTER 04| 放置圖片的正確姿勢
|CHAPTER 05| 陰魂不散的滾動條
|CHAPTER 06| 盒子模型的帽子戲法
|CHAPTER 07| Flexbox的彈性與不彈性
|CHAPTER 08| Grid迷宮般的內心戲
|CHAPTER 09| 元件的態度決定高度
|CHAPTER 10| 讓人敬畏三分的CSS

作者介紹

陳泰銘(Taiming)

自2017年開始從事前端工程師工作,擁有B2C以及B2B系統開發經驗。曾於大學期間修習師資培育學程,因此對於教學及教育充滿熱忱,擅長將複雜、艱澀的技術觀念轉化為親民的白話文並分享。

2019年發起「ShareBack不藏私分享會」社群,擔任活動企劃籌備以及講師,希望建立一個不藏私、彼此教學相長的平台,讓不論本科系、非本科系的參與者從中獲得知識以及樂趣。

【iThome鐵人賽獲獎】
♚2019 Modern Web組優選:《以經典小遊戲為主題之ReactJS應用練習》
♚2021 Modern Web組佳作:《30 天擁有一套自己手刻的React UI元件庫》
♚2022 Modern Web組冠軍:《防禦性CSS-建立「防患未然」的匠人心態》

規格

誠品貨碼 / 2682750216009
ISBN13 / 9786263335172
ISBN10 /
EAN貨碼 / 9786263335912
頁數 / 232
語言 / 1:中文/繁體
級別 / N:無
檔案格式 / PDF(47MB)
檔案匯出格式 / PDF 提供 Adobe DRM
TTS朗讀 / EPUB不提供TTS朗讀

退貨說明

退貨須知:

  1. 依照消費者保護法的規定,您享有商品貨到次日起七天猶豫期(含例假日)的權益(請注意!猶豫期非試用期),辦理退貨之商品必須是全新狀態(不得有刮傷、破損、受潮)且需完整(包含全部商品、配件、原廠內外包裝、贈品及所有附隨文件或資料的完整性等)。
  2. 請您以送貨廠商使用之包裝紙箱將退貨商品包裝妥當,若原紙箱已遺失,請另使用其他紙箱包覆於商品原廠包裝之外,切勿直接於原廠包裝上黏貼紙張或書寫文字。若原廠包裝損毀將可能被認定為已逾越檢查商品之必要程度,本公司得依毀損程度扣除回復原狀必要費用(整新費)後退費;請您先確認商品正確、外觀可接受,再行拆封,以免影響您的權利;若為產品瑕疵,本公司接受退貨。

依「通訊交易解除權合理例外情事適用準則」,下列商品不適用七日猶豫期,除產品本身有瑕疵外,不接受退貨:

  1. 易於腐敗、保存期限較短或解約時即將逾期。(如:生鮮蔬果、乳製品、冷凍冷藏食材、蛋糕)
  2. 依消費者要求所為之客製化給付。(如:客製印章、鋼筆刻字)
  3. 報紙、期刊或雜誌。
  4. 經消費者拆封之影音商品或電腦軟體。
  5. 非以有形媒介提供之數位內容或一經提供即為完成之線上服務,經消費者事先同意始提供。(如:電子書)
  6. 已拆封之個人衛生用品。(如:內衣褲、襪類、褲襪、刮鬍刀、除毛刀等貼身用品)
  7. 國際航空客運服務。

若您退貨時有下列情形,可能被認定已逾越檢查商品之必要程度而須負擔為回復原狀必要費用(整新費),或影響您的退貨權利,請您在拆封前決定是否要退貨:

  1. 以數位或電磁紀錄形式儲存或著作權相關之商品(包含但不限於CD、VCD、DVD、電腦軟體等) 包裝已拆封者(除運送用之包裝以外)。
  2. 耗材(包含但不限於墨水匣、碳粉匣、紙張、筆類墨水、清潔劑補充包等)之商品包裝已拆封者(除運送用之包裝以外)。
  3. 衣飾鞋類/寢具/織品(包含但不限於衣褲、鞋子、襪子、泳裝、床單、被套、填充玩具)或之商品缺件(含購買商品、附件、內外包裝、贈品等)或經剪標或下水或商品有不可回復之髒污或磨損痕跡。
  4. 食品、美容/保養用品、內衣褲等消耗性或個人衛生用品、商品銷售頁面上特別載明之商品已拆封者(除運送用之包裝外一切包裝、包括但不限於瓶蓋、封口、封膜等接觸商品內容之包裝部分)或已非全新狀態(外觀有刮傷、破損、受潮等)與包裝不完整(缺少商品、附件、原廠外盒、保護袋、配件紙箱、保麗龍、隨貨文件、贈品等)。
  5. 家電、3C、畫作、電子閱讀器等商品,除商品本身有瑕疵外,退回之商品已拆封(除運送用之包裝外一切包裝、包括但不限於封膜等接觸商品內容之包裝部分、移除封條、拆除吊牌、拆除貼膠或標籤等情形)或已非全新狀態(外觀有刮傷、破損、受潮等)與包裝不完整(缺少商品、附件、原廠外盒、保護袋、配件紙箱、保麗龍、隨貨文件、贈品等)。
  6. 退貨程序請參閱【客服專區→常見問題→誠品線上退貨退款】之說明。
付款/配送