❤️ 🍰 🌹 🎬 🚴♀️ 🏋️♀️ 💻 🚀 💜
這裡記錄了我的學習和開發筆記，歡迎交流 (*´∀`)~♥
© 2025. All rights reserved.
這是我在 2024 年最想聊的一些事。
December 28, 2024 年度回顧 前端測試指南：策略與實踐 Frontend Testing Guide Strategies and Practices WebConf Taiwan 投資 加密貨幣 職涯 閱讀 旅遊 Netflix 影集 電影 生活 JavaScript Patterns 讀書會 The Art of Unit Testing front end testing sharing team work visual testing visual regression testing 團隊合作 學不動了 職涯 讀書會 軟技能 甜點 · 留言
如何撰寫具彈性的測試程式 | 2024 WebConf Taiwan
December 27, 2024 front end testing visual testing WebConf Taiwan AI ChatGPT Chromatic Claude Cypress Frontend Testing Guide Strategies and Practices Integration Test Jest Percy React Testing Library sharing Unit Test visual regression testing 單元測試 整合測試 自動化測試 視覺測試 · 留言
這篇文章會分享 Google 制定的 Web Vitals 效能指標與使用者體驗的關係與實際應用、如何在專案中利用模擬與實地的方式測量與監控，以及如何優化專案以提升效能與使用者體驗。
August 24, 2024 載入效能 效能調校 Web Vitals 效能監控 Lighthouse Core Web Vitals Loading Performance Chrome DevTools RAIL Real User Monitoring Sentry Datadog Synthetic Monitoring active monitoring lighthouse-cli passive monitoring sharing 前端效能 系列文 加載效能 · 留言
在前端領域，快節奏且不斷革新的開發環境下，如何能在迅速產出的同時保持高品質的程式碼成為一大挑戰，因此「測試」變得十分重要。選擇何種測試方式、如何撰寫和執行測試成為開發者必須深思的議題。缺乏測試的程式碼難以確保品質，而解決這個問題的關鍵在於建立適當的測試策略。因此想藉由這本書來分享我在前端測試領域所積累的實務經驗，希望能對大家有所啟發和幫助。
June 6, 2024 front end testing Frontend Testing Guide Strategies and Practices 前端測試指南：策略與實踐 單元測試 團隊合作 整合測試 端對端測試 自動化測試 視覺測試 AI ChatGPT Cypress DevOps End-to-End Testing GitHub Copilot Integration Test Jest Memori Mixtini Percy pre-commit pre-push React Testing Library sharing TDD team work Unit Test visual regression testing visual testing · 留言
「單元測試的藝術」讀書會 - 隔離框架 (The Art of Unit Testing, 3e - Isolation Frameworks) 閱讀筆記。
May 1, 2024 The Art of Unit Testing Unit Test front end testing Jest TypeScript substitute.js 單元測試 自動化測試 閱讀筆記 讀書會 sharing · 留言
「單元測試的藝術」讀書會 - 利用模擬物件進行互動測試 (The Art of Unit Testing, 3e - Interaction Testing Using Mock Objects) 閱讀筆記。
April 26, 2024 The Art of Unit Testing Unit Test front end testing Jest 單元測試 自動化測試 閱讀筆記 讀書會 sharing · 留言
在實作單元測試時，為了有效測試特定情境和條件，必須利用 stub 對給定的函式或模組進行隔絕依賴，目的是為了讓測試更加穩定，避免造成不穩定的測試結果。本文將會討論 stub 的目的、使用情境，以及如何透過不同的注入技術來隔絕依賴。
April 18, 2024 The Art of Unit Testing Unit Test front end testing Jest 單元測試 自動化測試 閱讀筆記 讀書會 sharing · 留言
「單元測試的藝術」讀書會 - 你好，單元測試 (The Art of Unit Testing, 3e - A First Unit Test) 閱讀筆記。
April 10, 2024 The Art of Unit Testing Unit Test front end testing Jest React Testing Library 單元測試 自動化測試 閱讀筆記 讀書會 sharing · 留言
「單元測試的藝術」讀書會 - 單元測試的基本概念 (The Art of Unit Testing, 3e - The Basics of Unit Testing) 閱讀筆記。
March 28, 2024 The Art of Unit Testing Unit Test Integration Test TDD front end testing Jest React Testing Library 單元測試 整合測試 自動化測試 閱讀筆記 讀書會 sharing · 留言
JavaScript Patterns 讀書會 - MV* Patterns 逐字稿。
March 5, 2024 javascript patterns Design Pattern Unit Test front end testing JavaScript Patterns 讀書會 Learning JavaScript Design Patterns javascript 單元測試 設計模式 sharing 閱讀筆記 · 留言
從零打造前端效能監控系統 | WebConf Taiwan 2023 逐字稿
August 12, 2023 Sentry Cypress Web Vitals Memori Loading Performance Rendering Performance Core Web Vitals 效能監控 Real User Monitoring GitHub Actions CI/CD Chrome DevTools End-to-End Testing Google Analytics Lighthouse Synthetic Monitoring active monitoring cypress.io passive monitoring 加載效能 效能調校 端對端測試 自動化測試 轉譯效能 sharing WebConf Taiwan 前端效能 系列文 · 留言
要選 Redux 還是 context API + useReducer 來做狀態管理呢？context API + useReducer 能完全取代 Redux 嗎？
May 25, 2023 react hooks react.js redux Web Vitals Loading Performance Rendering Performance front-end architecture Core Web Vitals 加載效能 效能調校 sharing · 留言
「Visual Testing」MOPCON 2022 逐字稿，歡迎搭配投影片與範例一同服用。
October 15, 2022 visual testing Storybook Percy MOPCON Mixtini Cypress Chromatic 自動化測試 打造高速網站，從網站指標開始！全方位提升使用者體驗與流量的關鍵 視覺測試 visual regression testing Unit Test Jest Integration Test GitHub Actions GitHub End-to-End Testing cypress.io CI/CD 端對端測試 整合測試 單元測試 趨勢科技 Trend Micro pull request sharing · 留言
MOPCON 逐字稿
October 24, 2021 MOPCON Web Vitals 打造高速網站，從網站指標開始！全方位提升使用者體驗與流量的關鍵 Core Web Vitals SEO 搜尋引擎優化 效能調校 Firebase Performance Firebase Image Optimization Lighthouse Loading Performance lighthouse-cli sharing 加載效能 圖片最佳化 趨勢科技 Trend Micro Real User Monitoring Synthetic Monitoring Mixtini 前端效能 系列文 · 留言
Tipping Point Front-End Case Study and Practice: CSS
June 24, 2021 styled-system styled-components Tonic Styled UI CSS Modules CSS in JS BEM css Modern Web Loading Performance Responsive Web Design 響應式網頁 加載效能 趨勢科技 Trend Micro sharing · 留言
參加 91 Unit Testing 單元測試實戰操練營的簡單筆記。
March 29, 2021 單元測試 自動化測試 Jest Unit Test front end testing 趨勢科技 Trend Micro sharing · 留言
本文說明 Lighthouse 以使用者為出發點來探討效能的指標。
September 7, 2020 Lighthouse RAIL Web Vitals 效能調校 Core Web Vitals Loading Performance 加載效能 sharing Synthetic Monitoring active monitoring Real User Monitoring passive monitoring 趨勢科技 Trend Micro 前端效能 系列文 · 留言
本文主要由此投影片「Start your app the better way with Styled System」之講稿改寫。本文會從 CSS 歷史開始談起，接著會來看過去我們在使用元件庫上遇到的問題，以及怎麼使用 Styled System 來解決這些問題。
February 25, 2020 styled-system styled-components CSS Modules CSS in JS BEM css End-to-End Testing 端對端測試 Media Query Modern Web Loading Performance Responsive Web Design react.js webpack 自動化測試 響應式網頁 加載效能 sharing · 留言
利用 Styled System 建立一個更好的 UI 元件庫！
November 30, 2019 styled-system styled-components CSS Modules CSS in JS OOCSS BEM SMACSS css Bootstrap Critical Rendering Path End-to-End Testing 端對端測試 Loading Performance Media Query Modern Web Rendering Performance Responsive Web Design react.js webpack 加載效能 效能調校 自動化測試 轉譯效能 關鍵轉譯路徑 響應式網頁 sharing 趨勢科技 Trend Micro · 留言
本文會先從為何要做表單狀態管理說起，接著看目前市面上有哪些好的表單函式庫和條列挑選原則，並探討三個表單函式庫 Redux Form、React Final Form、Formik & Yup，最後做比較和總結。
April 30, 2019 react.js form react.js redux virtual dom sharing · 留言
本篇文章主要是將去年底今年初參加「2018 iT 邦幫忙鐵人賽」與後續在 VueJS 台灣 meetup 201803@五倍紅寶石所分享的文件做收納整理。
March 26, 2018 Nightwatch 自動化測試 End-to-End Testing 端對端測試 Selenium Selenium WebDriver 鐵人賽 2018鐵人賽 sharing Nightwatch101 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言
這篇文章將我到目前為止的 SEO 相關操作整理為搜尋引擎優化指南 (SEO Guideline)，它是一套針對搜尋引擎優化網站的執行準則，每個崗位執行特定的工作即可讓網站有一定的效果，並且這樣的優化過程是可以被評估、回饋與持續改進的；而系統化的實行也有助於將有限資源做最大利用，以得到最好的效果，例如：提高點閱率、排名等。
May 17, 2014 SEO sitemap RSS structured data social meta tags rich snippets 資訊架構 標籤系統 關鍵字經營 複合式摘要 結構化資料 social plugin sharing 搜尋引擎優化 SEO101 · 留言