---
# System prepended metadata

title: Tech Note
tags: [Note]

---

[TOC]

# 書單(book list)
- [JS Ninja](/@Zpqb2gUPSaaBcC-2GsVnOg/HJaonNpLc/%2FCf1KEpqISHqS1qrYo8FmMQ%2F)

# 網頁渲染機制(Web rendering)
- [SSR、SSG、CSR](/7gepJcWfSt6PCKK6pcHaaQ)

# JavaScript
- [Array](/ZRe5hSfmTz-XVha8Xg09Nw)
- [什麼是reference](/7MYn0-DOT7eze3b5rSpzxA)
- [在reduce使用{...prev}會有效能陷阱](https://jason-memo.dev/posts/spread-in-reduce-is-a-perf-antipattern/)

# React
[React as a UI Runtime](/tWSjTgYxSVSfOgUR2QpEyQ)
[React Clean Code](/g_c79w-WQy6J6qq3h5Y7-g)
[React的rerender](/qvpiMAFRTGqnk32OjJhBXQ)
[在使用React.memo/React.useMemo之前](/X8xS7mAZQUmQcjtAlEVb9g)
[React資料夾架構](/A7O2a5P-Sliazi-njgEpDQ)
[React\Redux的 Immutability](/d9UMZfzpRQm9STbPEBFcIw)
[待看1](https://overreacted.io/)
[待看2](https://daveceddia.com/archives/)

## - React hooks
[React的Hooks](/FboX6Zm8R5GUoRJjtseXug)
[useEffect](/fAVBJYB1Stuw4LcQG3jmeg)
[useCallback / useMemo note](/QN1IJIFyRcuNqaOdeuwKCg)
[如何避免每次render時導致useEffect重跑?](/0UE_raoqQligdCPOscapsA)
[自訂 React Hooks](/Qfu4xHLDQQ-3BHLeSF-x3g)
[React-window](/-hzrF_0bQEusPMRgGSsA9Q)

## - React test
[React-test-library](/PZ_HicHPS7a0lUt3oXxAaQ)

## - React styled-component
[深入styled-component](/IQco7gKaS1WxNvXqJpTYeA)

## - React Redux
[Redux\React-redux](/0rJuJSv-Sr6RmjtqvY9LTA)

## - React Data flow
[zustand](/zFh02TPwTY-BbY-s-lrvTg)
[swr](/PYyv_sedTw22VAAog87DuA)
[react-query](/8MYKpntgTLmR3PzsFJnzUQ)

## - Nextjs
- [使用](/VjyhSWleQQGIOLBApxSF3w)
- [搭配ESLint, Prettier](/TpqC92lJTbiR_Yb8meOBZA)
- [Authentication](/90l1udL1TvaPkPN--xyoKw)
- [搭配lodash (只載入所需)](/JEvZs9ZBTlyDjeoOKT5DOQ)
- [搭配CSS框架 (只載入所需)](/B0z1LKKlQG2-m_2viGTmGQ)
- [建立Backend](/to-bx1WOQ9Ch-laiKFdPaQ)
- [發佈deployment](/cv7MJskSSeWQhVC0AI_KiQ)
- [部署到Vercel](/DENbohooQBO94_3La2uLPA)
- [寄信 with Next](https://www.joshwcomeau.com/react/wonderful-emails-with-mjml-and-mdx/)

## - React Native
- [React Native](/EQO44jvrSUW-NbEd3IIJfA)

# UI
- [CSS](/ZyPUMFKsRQOuv3iwGnw9xA)
- [react-icons](/O8lB4_3mRvyEoqIbSd1Fwg) 
- [Tailwinds](/JLBw-FAJS2W_MS9wA3WV_w)

# GitLab
- [新增ssh key](/lOYR10Z_Q8igbrxROk6Krw)
- [GitLab 30天](/yufdHa7_R9iUj4zFtur0hQ)
- [GitLab CI/CD+ Docker + React + Node.js](/zVLBymsTToubimXQlWMfHQ)
- [Git 更改commit名稱跟email](/aTVOtGCTTxuM573xU0xHRw)

# Docker
- [Docker 是什麼？](/OtDC_jtTSI2qWhTS-m5RTQ)
- [Container vs VM](/X1TQlN2rTZe5FhUpEU1Psw)
- [Docker 介紹 + 安裝](/FVpSA9fgR4KRJEaI7tOPzw)
- [Container(容器) 使用](/t857nY1oR0mwsXHR9uJKZA)
- [Image(鏡像) 使用](/kGzKSnCZQwascdgiUowZvQ)
- [Dockerfile 使用](/T96UnHhDTRWab40fmZeQnA)
- [Docker 的 存儲](/PRL_5rMCRGy8_qRx5thuIw)
- [Docker Network](/z2r2AZyIQmGRl6OhDJ2QIQ)
- [Docker Compose](/bolvMjZ_RPiWvfp5btXaOQ)
- [Docker Orchestration(Swarm\k8s\Aks)](/O0R3r2YvRBS_Mq8G476izw)
- [Docker 的多架構](/qOD9ANSIRBSdyVjCVRDbhg)
- [自動化部署Docker](/m3L6Z2H5T2u7ClGZVL6ZpA)
- [Container 安全](/bnUGyjDhQ0yQkAoIDBS4wQ)
- [Docker 快速刪除(Container Image Network)](/iLxTfWCqQiGje3-iT4QYkw)
- [Docker develop flow](/Rq1xUIwBSXqT6FXOiYzaZA)

# 軟體架構
- [企業集成方式比較](/b1A6ZQqgRxy3jpj1zzWoyQ)
- [什麼是微服務](/X4t4hUlmRpumtwGOd2upOA)

# 軟體開發和質量
- [代碼整潔之道Note](/nwP9gFh8RtiSE4QFnb8PsA)
- [如何Code review](/IA5z5tSeSlW8c9_xylboPw)
- [14個設計資料庫的技巧](/dOiaUDjlQl25iuv4CkJSbw)
- [關聯式SQL與NoSQL資料](/QES5mM7xQjirsNSbDambvQ)
- [敏捷開發測試常見的七個誤區](/PH0HiesgSPOlmPJtmrgitg)
- [測試金字塔](/GEEH2aYxTLeDxh9ZPqbfTQ)

# K8S
- [K8s介紹](/pDt9kHZrTb-833baqPvJ0A)
- [minikube](/TG2uNmaSRVmq6x99-AwGFA)

# DevOps
- [DevOps](/SJrxP8_iQ0GsaT-mi_cXhQ)
- [DevSpecOps](/rOLLvDIkQ_ufc5XRrpeKOg)
- [版本控制的最佳實踐](/B9svV518RGOyOP0J938Zvg)
- [什麼是CI/CD?](/y4UbUWD8RnCfj6U96LFV9g)

# 自動化部署
- [自動化部署](/PXYTGWk1SPmiQa0j_uP7cQ)

# Data Fabric
- [Data Fabric](/0Ojgm9QGTfaASWTHg1Qhfg)

# TypeScript
- [TypeScript 鐵人賽](/hFX4HeyLTLGC2TwyFI81Ew)
- [with React](/v8oPb5QrTSWYV-4ol59aPA)
- [Typescript Exercise](/jh-jzMsjTrC7qN-rmmTfoQ)
- [error type](/p5-AKUckQA2l5XlRjfTnnQ)

# 後端(Back-end)

- [Fire Base](/wXvDj_SgRqu9GdZsemKCqQ)
- [Mongo DB](/P41SJdU-Q7qujD6fWOf1ew)
- [SQL語法]()
- [輸出Excel](/Z4oo8webTce3X4kOJn20RQ)

# 前端(Front-end)
- [GSAP 動畫框架](/PQ94D9dzSDe9FohV_UCDbg)

# JWT
- [JWT是什麼](/olPStowkTVuWvqqHsb7Qqw)

# Side project

- [簡易信用卡 React with Typescript](/JHpAP7H3SzyNI8S2tLWWHQ)

# Others

- [Github Copilot](/UelflwqPQqGmVFXL_Dd78A)

# 計算機概論

- [Data Storage](/XlFK6wYOR_qLk4r0zob3oQ)
- [Data Manipulation](/31E1JX0TSIK70qWnM_J_Og)
- [operating systems](/R7dGLXo4QCeiFrciH3iCGw)
- [Networking and the Internet](/gaZFGlT0RLi43y59BRj6Sw)
- [Algorithms](/LzJegOEsRWe2lVHHPI6ggg)
- [Programming Languages](/p1AkNqReQgmtjzT3TzRq3A)
- [Data Structure](/Wz38bO3gQk2mU3VPiaDaaw)
- [Database Systems](/bha1um6pTSCGwxzyERAABA)

# Python

- [彭澎教材](https://www.youtube.com/watch?v=wqRlKVRUV_k&list=PL-g0fdC5RMboYEyt6QS2iLb_1m7QcgfHk)
- [介紹](/73P7Pd7JSAi_SqyfmoyUmA)
- [Web Crawler](/t8wDLAHNSCOeFb6g88yhbA)

# LeetCode
[演算法](/b8f1lO9eSvGcFveCAuin9w)
[133. Clone Graph](/p4aPHJKtT023FZGZ3JUTJw)
[647. Palindromic Substrings](/EyrN-g73TvqnqcE1cuc2GQ)
[11. Container With Most Water](/dpQeXAY2QVOKfLOAOONO0Q)
[139. Word Break](/D7B75F9YSHahnx5HibTZwg)
[141. Linked List Cycle](/IpIJPYmTTTylHVQZ3ZTZpA)
[268. Missing Number](/kS35poaNR0W8lMAGQ9TRwQ)
[143. Reorder List](/jyjz29rVT2eanFFsmWHnZQ)
###### tags: `Note`
