Update docs and sort content

src/content/note/tweet to image 输入推特链接生成对应的图片.md

@@ -22,13 +22,15 @@ rinId: 50
 category: 软件
 toAstro: true
 date_created: 2024-12-02T11:03:24+08:00
-date_modified: 2025-02-07T11:17:02+08:00
+date_modified: 2025-02-08T13:54:45+08:00
 ---
 
 # Tweet to Image 输入推特链接生成对应的图片
 
 [Perfect Twitter Screenshots - TweetPik](https://tweethunter.io/tweetpik)
 
+（不太好用）
+
 ![Pasted image 20240626165118](https://pictures.kazoottt.top/2024/06/20240626-107e2d31780d2e0e825f4f83caff1e21.png)
 
 [Free Tweet to Image Converter Online - PostWizz](https://postwizz.com/tweet-to-image-converter/)

src/content/note/使用 1password 的 secure notes 存储提示词.md

@@ -1,6 +1,6 @@
 ---
 date_created: 2025-02-05T13:21:09+08:00
-date_modified: 2025-02-07T11:17:02+08:00
+date_modified: 2025-02-08T13:58:33+08:00
 title: 使用 1password 的 secure notes 存储提示词
 date: 2025-02-05
 author: KazooTTT
@@ -37,3 +37,5 @@ toAstro: true
 1. 云端存储，只要登录了 1password，就可以查看之前存储的提示词。
 2. 跨平台使用，macos、pc、手机等都可以使用。
 3. 快捷键唤起搜索框，快速复制提示词。
+
+[[使用 copyQ 存储提示词 ]]

src/content/note/如何解决 Nginx 启动时未联网无法访问DNS而挂掉的问题.md

@@ -0,0 +1,75 @@
+---
+date_created: 2025-02-07T15:04:05+08:00
+date_modified: 2025-02-08T11:43:19+08:00
+title: 如何解决 Nginx 启动时未联网无法访问DNS而挂掉的问题
+date: 2025-02-08
+author: KazooTTT
+type: Post
+status: Published
+tags:
+  - nginx
+  - dns
+  - 计算机网络
+finished: true
+published: true
+category: 
+slug: nginx-startup-fix-configure-local-hosts-file
+description: 
+toAstro: true
+astroType:
+---
+
+假设我们在 Nginx 配置文件中设置了如下的反向代理配置：
+
+```nginx
+location / {
+    proxy_pass http://example.com;
+}
+```
+
+开机的时候，在没有网络连接的情况下，Nginx 启动时无法访问 DNS 服务器进行解析 `example.com`，导致 Nginx 启动失败。这种情况下，我们需要一种方法来确保 Nginx 启动时即使无法访问网络，依然可以顺利运行。
+
+## 解决方案：配置 `resolver`
+
+解决这个问题的一个有效方法就是在 Nginx 配置中添加 `resolver` 指定 DNS 服务器，告诉 Nginx 如何解析域名，即使在网络不可用时，Nginx 也能够正常启动。
+
+### `resolver` 指令的作用
+
+`resolver` 指令用于指定一个或多个 DNS 服务器，Nginx 将通过这些服务器解析域名。当 Nginx 需要解析代理服务器的域名时，它会使用配置中的 DNS 服务器，而不是依赖系统默认的 DNS 配置。
+
+### 如何配置
+
+假设我们要配置的反向代理目标是 `example.com` ,在 Nginx 配置文件中，我们可以添加如下内容：
+
+```nginx
+http {
+  resolver 223.5.5.5 223.6.6.6 valid=30s;
+
+  server {
+      listen 80;
+
+      location / {
+          set $backend "http://example.com";
+          proxy_pass $backend;
+      }
+  }
+}
+```
+
+> proxy_pass 后面接域名时候会 DNS 缓存，导致这个域名背后的机器负载不均衡，官方推荐的是使用变量解决 [^1]
+
+在上述配置中，`resolver 223.5.5.5 223.6.6.6 valid=30s;` 指定了一个 DNS 服务器
+
+这意味着 Nginx 在启动时会使用这个 DNS 服务器来解析 `example.com`，即使机器没有网络连接，它也能够通过指定的 DNS 服务器来解析域名。
+
+`valid=30s` 表示 DNS 解析结果的有效期为 30 秒。(具体来说就是 Nginx 会缓存 DNS 解析结果，30 秒内不再请求 DNS 服务器)
+
+## 参考
+
+[nginx中resolver参数配置解释 \|](https://www.rootop.org/pages/4307.html)
+
+[Module ngx\_http\_core\_module](https://nginx.org/en/docs/http/ngx_http_core_module.html#resolver)
+
+ [89 \| proxy模块中的proxy\_pass指令--极客时间](https://time.geekbang.org/course/detail/138-75140)
+
+[^1]: [89 \| proxy模块中的proxy\_pass指令--极客时间](https://time.geekbang.org/course/detail/138-75140)

src/content/note/记录一次滴滴打车维权.md

@@ -1,6 +1,6 @@
 ---
 date_created: 2025-02-03T17:06:38+08:00
-date_modified: 2025-02-07T11:17:03+08:00
+date_modified: 2025-02-08T10:24:57+08:00
 title: 记录一次滴滴打车维权
 date: 2025-02-03
 author: KazooTTT
@@ -44,6 +44,10 @@ banner: "https://pictures.kazoottt.top/2025/02/20250203-og-1738405499055.png"
 
 接到了滴滴客服的电话，跟我确认了一下情况，然后说会退款 18 元。
 
+## 2 月 8 日
+
+12328 打电话过来回复处理情况，给司机的处罚是罚款 200 元。
+
 # 总结
 
 1. 尽量不要选择打表的出租车，最终金额由司机手动输入，存在很大的操作空间。且后期维权困难。

src/content/post/Share My Incorrect Usage Cases of Zustand.md

@@ -17,7 +17,7 @@ slug: share-my-incorrect-usage-case-of-zustand-en
 description: Zustand is a state management library that is simple and easy to use. It allows you to access the state via a single selector or shallow comparison to prevent unnecessary re-renders of all components. When the state is updated, you can use `useShallow` to retrieve only the required data. Additionally, you should follow the principle of minimal granularity, only fetching the necessary data instead of using multiple stores to manage different states. Moreover, state that is unrelated to the UI does not need to be accessed via a selector. The correct approach is to directly access the store within the `handleSave` method.
 toAstro: true
 date_created: 2025-01-04T11:44:53+08:00
-date_modified: 2025-02-07T11:45:53+08:00
+date_modified: 2025-02-07T18:00:15+08:00
 astroType: post
 ---
 
@@ -115,11 +115,11 @@ const CurrentCamera: React.FC = () => {
 In the official documentation [Flux-inspired practice - Zustand](https://zustand.docs.pmnd.rs/guides/flux-inspired-practice), it is mentioned that you should use a single store, not multiple stores for different states.
 
 > **Recommended patterns**
->
+> 
 > **Single store**
->
+> 
 > Your application's global state should be located in a single Zustand store.
->
+> 
 > If you have a large application, Zustand supports splitting the store into slices.
 
 ## Mistake 4: Accessing UI-unrelated state via selectors

src/content/post/how to generate the path like router config in vite + react + react-router project.md

@@ -17,7 +17,7 @@ description:
 toAstro: true
 astroType: "post"
 date_created: 2025-01-14T17:31:35+08:00
-date_modified: 2025-02-07T11:25:34+08:00
+date_modified: 2025-02-08T11:47:21+08:00
 ---
 
 when i use react-router and vite, i want to config my router in the router.config.ts file and also generate some config for the target path dir. (like the nextjs router which is automatically generated based on the file structure)
@@ -176,4 +176,6 @@ function App() {
 
 this is a simple way to generate the path like router config for the target path dir in the vite + react + react-router project.
 
+if you want to see a demo, you can see the [demo repo](https://github.com/KazooTTT/vtkjs-react-demos).
+
 if you want to know more about the `vite-plugin-pages` plugin, you can see the [github repo](https://github.com/hannoeru/vite-plugin-pages).