add posts

README.md

@@ -135,10 +135,21 @@ git reset --hard origin/main
         echo "Generated files in public directory:"
         ls -la public
 ```
-5. 将 public/ 目录下的静态网页部署到 GitHub Pages
+5. 将 public/ 目录下的静态网页部署到 GitHub Pages。原理是通过SSH，把public/ 目录下的文件复制到`gh-pages` 分支，然后再利用Github Pages 自带的workflow `pages build and deployment` 进行deploy。
+```
+    - name: Setup SSH
+      uses: webfactory/[email protected]
+      with:
+        ssh-private-key: ${{ secrets.ACTIONS_DEPLOY_KEY }}
 
-一些重点注意事项罗列如下
-- 在repo里`Settings` -> `Pages` -> `Build and deployment` -> `source` 选择 `Deploy from a branch`，默认 branch 名为 `gh-pages`.
+    - name: Deploy to GitHub Pages
+      run: |
+        git config --global init.defaultBranch main
+        git config --global user.name "github-actions[bot]"
+        git config --global user.email "github-actions[bot]@users.noreply.github.com"
+        npx hexo deploy
+```
+这一步中还需要在repo里`Settings` -> `Pages` -> `Build and deployment` -> `source` 选择 `Deploy from a branch`，默认 branch 名为 `gh-pages`. 在这种情况下，Github Actions 会自动添加一个workflow `pages build and deployment`。这个flow的作用是把`gh-pages` branch里的文件deploy到Github Pages，也就是这个Blog的[链接](https://galaxy-dot.github.io/)。
 
 
 ### TODO：project 类 Github Action 设置，等以后用到了再写。

source/_posts/algo-recursion.md

@@ -0,0 +1,52 @@
+---
+title: Algo - Recursion
+date: 2022-02-26
+categories: algorithms
+tags:
+  - algorithms
+  - recursion
+---
+
+在学习`quick sort`的过程中，发现`recursion`这个概念掌握得不牢固，因此又重新学习了一遍，记录如下。<!-- more -->
+
+## 概念
+
+> Recursion is when a function calls itself until someone stops it. If no one stops it then it'll recurse (call itself) forever.
+
+函数本身调用自身，直到在调用的过程中遇到一个停止调用自身的条件。一般这个停止条件会是一个 if 语句：if 条件是停止调用自身的条件，return 一个固定值。
+
+## 解题套路
+
+一般为 2 步：
+
+- 第一步：写停止调用函数自身条件。
+
+  - 思路：可以直接得到 hard code 结果的那条循环条件是一个比较好的退出条件。
+    例子 1：求和。退出条件是当 argument 值为 1 时，返回值 argument 本身。
+    例子 2：打印从 n 到 0 的所有整数。退出条件是 argument 值为 0 时，返回值是 argument 本身。
+    例子 3: fibonacci 数列。退出条件是当 argument 小于/等于 1 时，返回值时 argument 本身。
+  - 语法：一般是一条有返回值的 if 语句。
+  - 技巧：
+    - 如果是针对 array 进行递归的话，一般用 array 长度作为退出条件。
+    - 如果是针对 number 进行递归的话，一般是最小数字。
+    - 如果是针对 object 进行递归的话，一般用 `typeof obj[key] === 'object'`作为退出条件。
+
+- 第二步：写 function 自身调用。
+  - 思路：argument + function 自身。
+  - 语法：简单的话，一般是一条 return 语句；复杂的话，有一些 if 条件+return 语句。
+
+## 应用
+
+一般可以用 for 或者 while 循环写的逻辑，基本上都可以用 recursion 改写。
+
+- Factorial
+- Fibonacci Numbers
+
+## 练习
+
+参考[这个 repo](https://github.com/wendyli-repos/Algorithm)里的 recursion 相关的练习。
+
+## Refs
+
+1. [A Quick Intro to Recursion in Javascript](https://www.freecodecamp.org/news/quick-intro-to-recursion/)
+2. [Recursion and stack](https://javascript.info/recursion)

source/_posts/chrome-dev-tools.md

@@ -0,0 +1,77 @@
+---
+title: Chrome Dev Tools
+date: 2022-08-13
+categories: productivity
+tags:
+  - chrome dev tools
+---
+
+Some notes on Chrome Dev Tools. <!-- more -->
+
+## CSS
+
+`computed attributes` can check all css rules applied to one element and is overwritten, and the highest specificity.
+
+## Add Break Point to HTML
+
+Right click on an html element -> break on ->
+
+```
+subtree
+attribute
+node removal
+```
+
+## Event Listeners
+
+Check any JS/React event listeners to an element.
+
+## Workspace
+
+Connect local files to `source` tab, make sure files added have `green dot` to persist changes between page reloads.
+
+Click `sources`, open `Filesystem`, click `Add folder to workplace`, choose the folder where to save local changes, allow Chrome access. Make change to the css and it will reflect the changes after page refresh.
+
+## Debug
+
+Several different types of breakpoints.
+
+- Breakpoints
+- XHR/fetch Breakpoints, break on only some specific network calls
+- Scope
+  - Local, where breakpoint lives
+  - Global
+- Callback 回调
+- Blackbox script 不显示某些 callback
+- Watch: watch some variables, variables value will be updated.
+
+## Network Performance
+
+1. Click `shift` when hover over networks calls, will highlight `red` or `green` on which triggers and which being triggered
+2. Waterfall
+
+## Performance API
+
+[Performance](https://developer.mozilla.org/en-US/docs/Web/API/Performance)
+
+- performance.start()
+- performance.end()
+- page jank
+- Rail rule: Response, Animation, Idle and Load
+- Use Webworker to run heavy calculations
+
+## Chrome Task Manager
+
+Right click `More tools`, right click and choose `JavaScript Memory`
+
+## Extra selection to console
+
+Right click `three dots`, choose `Rendering`, click `Paint flashing`, `Frame Rendering Stats`
+
+## node
+
+`node --inspect cmd cmd1`
+
+## Refs
+
+1. [Chrome Dev Tools Doc](https://developer.chrome.com/docs/devtools/)