重疊的抽象幾何線條符號

故事化直白的解釋 Monorepo 是什麼

隨著前端的複雜程度增加,Monorepo 這個詞彙也時常出現在眼前,可惜的是相關介紹資源非常不足,趁著近期較為閒暇的時間來統整紀錄一下我對 Monorepo 的理解。受到不同好文章與影片的的啟發,我想寫一篇最直白的 Monorepo 解釋,希望能夠幫助更多人理解 Monorepo 的概念。

介面符號

透過元件化以建構可擴展的使用者介面

近期在大改造現有產品的設計系統,預期會與來自不同領域的人合作,因此這篇文章是寫給對網頁無任何前置知識的人的,主要介紹「介面元件化」這個概念。元件是一塊拼圖、一個積木、一個齒輪……,就是一個可以被重複使用並且可被組合成更大物件的概念。

打勾對話框符號

如何開會?開會前、開會中、開會後應當注意的事項!

開會是一門學問,也是身為團隊領袖必備的軟技能之一,架構差勁的會議會不只影響個人更甚至會整體團隊的生產力,特別是在遠端工作盛行的時代溝通技巧更尤為重要,架構差勁的會議會不只影響個人更甚至會整體團隊的生產力,本篇文章探討開會前中後有哪些細節是可以注意的。

選色器符號

紀錄如何從頭打造數位產品 - 顏色篇

近期公司購買了設計相關的課程,期望透過研究改良目前的設計來提升與開發合作的效率,恰好我之前的工作領域也與設計相關,而且我很早就想跨領域多寫與網頁相關的文章!因此打算特地開一系列文章記錄課程筆記以及我自己補充的想法與資源。

方框內有數字四的符號

新工作 4 個月以來接觸 E2E 測試與 BDD 的心得

在加入新工作的數個月內我撰寫了接近百支大大小小功能的 E2E 測試,打算透過邊撰寫這篇文章邊閱讀文件穩固自己的知識,同時也方便團隊成員能夠快速上手我從零開始建立的 E2E Cypress 測試專案,並且最終期望能夠嘗試實驗導入 BDD 流程到團隊開發流程當中。

不高興表情符號

為什麼 CSS 這麼難學這麼詭異?

開發者們對 CSS 有不同的意見,有的人說它很簡單、有的人說它難以駕馭,這些都是事實。我時常聽到苦惱的後端或是與其打交道多年的自己脫口而出:「CSS 真的好詭異阿!」,這篇文章來總結為什麼 CSS 是一個讓人又愛又恨的存在,它為什麼這麼難學這麼詭異?

機器人符號

將 AI 應用到你的 Coding 工作流當中 - GitHub Copilot

開發者的工作性質造就我們注定要站在最前線與 AI 並肩作戰,而 GitHub Copilot 這些年的陪伴顯著的提升了我的開發生產力與更有效率的學習開發技巧,是少數我覺得真正值得付費的服務之一,不管你是新手還是老鳥 Copilot 都有對應的定位幫助你加速開發。

非常長的文件符號

三步驟了解並實踐無限滾動加載 feat.Vue / Intersection Observer API

近期工作剛好接觸很多介面開發的部分,其中一個需求實作「無限滾動加載功能」,當使用者滾動到頁面底部時會自動加載更多的資料,不用點擊按鈕就能瀏覽更多的資料,就像是自動版的加載按鈕。近期工作剛好接觸很多相關的介面功能開發,讓我們用 Vue Composition API 來實作。

笑臉符號

樂觀 UI (Optimistic User Interface) 是什麼?有哪些實踐細節是你應該注意的?

不要让使用者等待!越多的等待时间,就越容易让使用者流失,因此让应用程式的回馈即时,是很基础重要的原则。 Optimistic UI 强调即时、乐观的使用者介面回馈。在用户触发操作后,系统即时假定成功,迅速更新介面,提升使用者体验。这种方法有效缩短用户等待时间,创造更流畅、令人满意的互动体验。

圖片縮放符號

製作響應式網頁需要多少尺寸版本?三個論點說服你越少越好。

我既設計網頁也開發網頁,並且在過去幾年經驗中總結發現設計與開發配合上容易遇到的問題像是:我需要繪製多少種尺寸的網頁?我需要替網頁設置多少個斷點?這篇文章我分享自己身為設計者與開發者的經歷以及你為何應該使用越少的斷點來製作響應式網頁越好。

層級符號

一個簡單聰明的方法讓你永遠不用煩惱管理 Z-index 的問題

賦予網頁元素相對的關係而非絕對的數值,讓我們強烈聯繫元素之間的差異,而非取決於某個魔法數字可以避免很多折騰。最近看到一篇文章,作者提到用 CSS Variable 來賦予相對而非絕對數值的 `z-index` 值,真是優雅簡潔的方法!完美的發揮了 CSS 變數的優勢,促使我寫下這篇文章。

節點連接符號

如何優雅的於 Vue 正確的處理資料載入

索取並顯示資料對前端工程師來說是家常便飯的事,但隨著背後延伸的狀態越來越多,就會讓整個專案極度混亂,因此想要藉由這篇文章點出現有問題並提出一些可行的方案,紀錄尋找更高效解法的過程。在索取資料時連帶的有許多狀態需要被管理和調整,文章透過 Vue 來探討如何更優雅的處理這些狀態。

文件與放大鏡符號

如何替陳舊代碼導入 HTML 原生客戶端驗證的故事

本文描述近期在維護既有代碼時的故事,目前的專案中有各式各樣前人尚未統一的驗證方式,例如:有些是使用 HTML 原生客戶端驗證、伺服器端驗證、第三方套件、自造的驗證方法,如何統一規範驗證方式是一大問題,同時也要思考:「要如何避免創造更多的陳舊代碼?」

Astro Logo 符號

Astro 系列文第三十日:系列回顧與反省

本系列 Astro 文章終於完結了,必須說連續 30 天到了後段有點寫不太出來任何東西,秉持著有寫任何東西無論如何都比沒寫強的精神完成了這次的挑戰!本系列文章是當完兵出來沒多久馬上開始寫的,因此是在最後一天開賽而且還只有不到 10 篇的屯稿的狀態下進行的,加上日後工作也忙碌起來,能夠完賽算是很幸運。