原创 Angular 16+ 基礎教程 – 開篇和目錄

前言 前陣子我開始寫 Angular 複習與進階系列，寫着寫着，發現寫不下去。 思來想去，感覺原因是主題定的不好。複習與進階，意味着看的人就要有基礎， 但是這個基礎到底要多少又說不清楚，更糟糕的是這兩年 Angular 團隊重組後盡然開始做

2023-09-25 14:01:56

原创 JavaScript Library – Svelte

前言 上一回我介紹了 Alpine.js。作爲我開發企業網站 draft 版本的 render engine。 用了一陣子後，我覺得它真的非常不好用。所以打算換一個。 前端有好幾個 framework / library / compile

2023-09-22 13:59:25

原创 C# 12

前言 C# 12 是 .NET 8 版本推出的，目前還在 RC 階段。預計 2023 年 11 月份就會正式推出了。 想提早玩玩的話可以使用用 Visual Studio Preview。   參考 Docs – What's new in

2023-09-19 14:02:07

原创 VS Code – Keyboard Shortcuts & Extensions

前言 記入一些自己常用到的 Keyboard Shortcuts 和 Extensions。   Keyboard Shortcuts undo redo 鼠標座標：shift + left/right 它可以控制鼠標座標回到上一次的位置

2023-09-11 13:59:10

原创 TypeScript – Decorator Metadata

前言 在 TypeScript – Decorator 裝飾器 裏，我有提到 TypeScript 只實現了 decorate 的特性，把 metadata 的特性獨立了出來。 本來我以爲還需要等待很長的時間他們纔會實現，沒想到 v5.2

2023-08-29 13:59:15 1

原创 TypeScript – Using Disposable

前言 TypeScript v5.2 多了一個新功能叫 Disposable。 Dispose 的作用是讓 "對象" 離開 "作用域" 後做出一些 "釋放資源" 的操作。 很多地方都可以看到 Dispose 概念。比如 Web Compon

2023-08-28 14:09:50 1

原创 CSS – Houdini

介紹 簡單說這個 Houdini 是一系列 CSS 底層 API，它可以讓我們擴展 CSS，做出一些 Polyfill。 舉一個例子，讓大家有個畫面。 我們可以通過 CSS + JS + Canvas 語法來自創 CSS 語法，遊覽器解析

2023-08-21 14:08:05 1

原创 JavaScript – Alpine.js

前言 Alpine 是高山的意思。Alpine.js 是一個輕量級的 JS Framework。 我爲什麼會去用它呢？ 是這樣的，我在做企業網站開發的時候會有 2 個階段。 第一個 draft 階段，只寫 HTML、CSS、JS。不會涉及

2023-08-17 14:02:25 1

原创 工具 – VS Code Extensions

前言 分享我用着的 Extensions。   Angular Language Service 不用介紹，用 Angular 的必裝。   Better Comments 讓註釋有多點顏色 more colorful。好看最重要。   C

2023-08-03 14:05:02 1

原创 工具 – Cypress

介紹 Cypress 是一款 e2e 測試工具。每當我們寫好一個組件或者一個頁面之後，我們會想對整體做一個測試。 在不使用工具的情況下，我們會開啓 browser，然後做一系列點擊、滾動、填 form 等等交互，然後觀察看看是否全部運行正常

2023-08-02 14:02:06

原创 工具 – Vitest 與單元測試

前言 Vitest 是一款配搭 Vite 的前端單元測試工具，可以用於取代 Jasmine 和 Jest。 我先聊一下測試，每當添加新代碼或修改舊代碼後，我們多少都得測試一下，以確保功能正確才能交付。 這種測試通常只是寫幾個簡單的調用，換換

2023-08-02 14:02:06

原创 工具 – Prettier、ESLint、Stylelint、

前言 以前在 Webpack 學習筆記 有稍微介紹過它們。這篇是單獨整理版。   參考 一文徹底讀懂ESLint 你的ESLint真的需要Prettier嗎？ 搞懂eslint和prettier等的關係   簡單介紹 ESLint 是 JS

2023-07-21 14:02:05

原创 Angular – 前後端發展史 の Angular 到底在解決什麼問題?

前言 上一篇我有提到 Angular 適合用於哪些項目，但講的太含糊，什麼大中小項目的...這篇我將更具體的去講解，Angular 可以解決什麼樣的開發問題。   Web 技術發展史 の Web 1.0 時代 Web 技術指的是 HTML、

2023-07-16 14:07:21

原创 Vite Get Started

前言 一直想 try Vite, 但一直沒有機會. 今天突然 Live Server IP Address 手機連不上...也不知道是 Bug 還是怎麼回事兒. 總之 IIS IP Address 沒有問題. 那多半是 Live Serve

2023-06-30 14:02:15

原创 C# and TypeScript – Enum Flags

前言 以前就有提過 Enum Flags, 但平日不常用. 最近翻 Angular 源碼, 發現它很多地方用到, 而且沒有封裝語義代碼. 一堆符號真的看不慣啊... 於是又去複習了一遍, 熟悉熟悉. 順便寫一篇做記入唄. 這篇 C# 和 T

2023-06-26 13:59:22