diff --git a/404.html b/404.html index 38f4c35d..93b1f2fa 100644 --- a/404.html +++ b/404.html @@ -1 +1 @@ -404: This page could not be found

404

This page could not be found.

\ No newline at end of file +404: This page could not be found

404

This page could not be found.

\ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas.json b/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas.json deleted file mode 100644 index bea9697e..00000000 --- a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas.json +++ /dev/null @@ -1 +0,0 @@ -{"pageProps":{"posts":[{"slug":"blog-syntax","file":"public/content/ideas/blog-syntax.md","mediaDir":"content/ideas/blog-syntax","path":"/ideas/blog-syntax","meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts
prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":191,"created_at":"2024-04-14T18:58:06.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"using-chart-js","file":"public/content/ideas/using-chart-js.mdx","mediaDir":"content/ideas/using-chart-js","path":"/ideas/using-chart-js","meta":{"content":"\n# testing for using chart js\n\nUse Chart.js in React.\n\nIntroduce:\n\n- Chart.js: https://github.com/chartjs/Chart.js\n- react-chartjs-2: https://github.com/reactchartjs/react-chartjs-2\n- remark-mdx-chartjs: https://github.com/pangelani/remark-mdx-chartjs\n\n# Chart.js\n\nDocumentation:\n\nhttps://www.chartjs.org/docs/latest/\n\nWe should use the Tree-shaking feature for react-chartjs-2.\n\nA very helpful guide about Chart.js:\n\nhttps://www.chartjs.org/docs/latest/getting-started/usage.html\n\n# react-chartjs-2\n\nDocumentation:\n\nhttps://react-chartjs-2.js.org/\n\nwe could code like this:\n\n```jsx\n\n```\n\nand result:\n\n\n\nAnd it is tree-shakable.\n\nhttps://react-chartjs-2.js.org/docs/migration-to-v4/#tree-shaking\n\n# remark-mdx-chartjs\n\nhttps://github.com/pangelani/remark-mdx-chartjs\n\nWith this, could write chart in markdown.\n\n````md\n```chartjs\ntype: bar\ndata:\nlabels: [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\"]\ndatasets:\n - label: \"Dataset 1\"\n data: [0,2,6,1,7,13,2]\n backgroundColor: \"rgba(255, 99, 132, 0.5)\"\n\n - label: \"Dataset 2\"\n data: [4,2,11,8,6,1,4]\n backgroundColor: \"rgba(53, 162, 235, 0.5)\"\n```\n````\n\n```chartjs\ntype: bar\ndata:\nlabels: [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\"]\ndatasets:\n - label: \"Dataset 1\"\n data: [0,2,6,1,7,13,2]\n backgroundColor: \"rgba(255, 99, 132, 0.5)\"\n\n - label: \"Dataset 2\"\n data: [4,2,11,8,6,1,4]\n backgroundColor: \"rgba(53, 162, 235, 0.5)\"\n```\n\nBut it's not written in TypeScript, and raising a TS7016 error.\nSo raise an issue, and wait for the type definition.\n","title":"About Chart.js","abstract":"Use Chart.js in React.\nIntroduce:\n- Chart.js: https://github.com/chartjs/Chart.js","length":114,"created_at":"2023-02-12T16:56:33.000Z","updated_at":"2023-02-12T16:36:52.000Z","tags":[],"license":false}},{"slug":"blog-in-next","file":"public/content/ideas/blog-in-next.md","mediaDir":"content/ideas/blog-in-next","path":"/ideas/blog-in-next","meta":{"content":"\n# blog todo\n\n## 一期\n\n- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex\n - [x] rehype-slug\n - [x] https://github.com/unifiedjs/unified\n - [x] recma -> 修改 MDX , remark -> 修改 markdown ， rehype -> 修改 html\n - [x] https://www.haxibami.net/blog/posts/blog-renewal\n - [x] about img to next/Image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [x] introduction of remark https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html\n- [x] 下标语法行为 -> 修改默认不用 a 标签\n 使用 remark gfm 后自动解决\n- [x] 处理 picture 路径的问题\n- [x] 默认元素映射，处理代码高亮\n - [x] mermaid 渲染\n - [x] latex 渲染 弃用，思考 remark-rehype 优先\n - [x] latex 中文渲染\n - [x] vscode-memo 语法\n - [x] 站内多媒体相对链接\n - [x] latex 显示两次\n - [x] katex 需要特殊的 css ，加载后修复\n - [x] 没有闭合的左箭头自动转义\n 做不到， next-mdx-remote 调用 mdx-js ， createProcessor 中会在执行所有 remark 插件之前，先执行 remark-mdx ，无法通过插件修改 \n - https://github.com/mdx-js/mdx/tree/main/packages/remark-mdx\n - https://github.com/mdx-js/mdx/blob/main/packages/mdx/lib/core.js\n- [x] 简单的样式\n - [x] Article 页面\n - [x] 主页\n - [x] 主页封面： position: static 不会反应 z-index ，需要 position: 其他值\n - [x] about 页\n - 先不做\n - [x] 其他页的最小高度，处理 footer 不要太高\n - [x] Tag 页\n - [x] Idea 页\n - [x] refactor move meta together\n- [x] fix post list height\n- [x] fix post list page tag box\n- [x] SEO 简单\n - [x] site map https://github.com/iamvishnusankar/next-sitemap\n - [x] Header， title\n - [x] OG\n - [x] og:site_name vs og:title?\n - [x] og:url?\n - [x] footer\n - [x] icon hover 发光， bg 不要变色\n - [x] 增加 icon ， Pixiv\n- [x] 处理旧链接跳转 https://www.viget.com/articles/host-build-and-deploy-next-js-projects-on-github-pages/\n - [x] path prefix\n - [x] 环境变量？配置文件？\n - [x] 代码高亮换成静态后 mermaid 也要用 remark 处理\n - [x] mermaid 内样式 -> 修复 global applyed 的行高\n - [x] 为什么 haxibami 的样式不会变？为什么是 tspan 和 text ？待探究 -> 是 pie 和 sequence 默认的\n - [x] maybe rehype-raw ？ -> 不是 rehype-raw 的问题，而且如果用 rehype-raw 会让 mdx 渲染不了显示 Cannot compile `mdxJsxFlowElement` node\n - [x] https://github.com/mermaid-js/mermaid/issues/2688\n - [x] turning the htmlLables to false fixed this (maybe other types of charts should be tested as well)\n - [x] 去除 path 中的日期\n 1. get all slugs once\n 2. get post meta by slug\n - [x] 修复 image url 跳转\n - [x] link jump 301 -> 308\n - 不能直接在 config 里配置，不会自动静态生成\n - 在 getStaticProps 里处理:\n - param 中拿到 slug 以 string[] 出现， slash 无关\n - build 时出现 error：`redirect` can not be returned from getStaticProps during prerendering\n - https://nextjs.org/docs/messages/gsp-redirect-during-prerender\n - 放弃治疗\n- [x] git time versioning\n - [x] created at\n - [x] updated at\n- [x] 部署脚本\n - [x] ghpage\n - [x] gh page 环境 path 前缀设置，\n - [x] env file 使用\n - [x] s3 test + prod\n - reusable wrokflow (on workflow call) https://docs.github.com/en/actions/using-workflows/reusing-workflows\n - composite action (no details, not to use) https://docs.github.com/en/actions/creating-actions/creating-a-composite-action\n - use artifact between workflow https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts\n - an https://stackoverflow.com/questions/70003863/reusing-github-action-workflow-steps-inside-another-job\n - gh-pages 先用蠢办法， build 上传一次 artifact ，deploy 时在 gh-pages action 里再上传一次\n - [x] Github Action 复用\n - [x] test infra stack 更新使用 s3 web hosting\n - [x] 处理 url 结尾带 slash 问题\n - https://github.com/keaeriksson/hugo-s3-cloudfront \\<- 最终解决方案，用 pulumi 把这个重写一遍\n - maybe it's time to serverless https://github.com/serverless-nextjs/serverless-next.js\n - or just use vercel! \n\n - [x] 更新 prod （infra ， Deploy ）\n- [x] 修复 mermaid 渲染\n - [x] 方法1 remark 时处理，变静态 svg （简单）\n - [x] 方法2 highlight 推延到渲染时处理，用组件包裹 （希望优先）\n - [x] 组建渲染时快速刷新可能导致 syntax error\n - [x] 可能的处理闪动的信息： \n - https://github.com/ant-design/ant-design/issues/16037\n - https://stackoverflow.com/questions/72248724/components-flicker-during-server-side-render-for-nextjs-and-material-ui\n - https://www.stackfive.io/work/nextjs/how-to-fix-styled-components-page-flicker-in-next-js-12\n - https://stackoverflow.com/questions/65527040/using-prism-js-line-highlight-plugin-with-next-js-app-causes-text-content-did-n\n - https://css-tricks.com/syntax-highlighting-prism-on-a-next-js-site/#aa-highlighting-lines\n - https://www.felixmokross.dev/blog/code-samples-line-highlighting\n- [x] 修复：\n - [x] Home Page 下方链接点击问题\n - [x] 改进 trailing slash -> lambda 写错，要加 .html 不是 /index.html\n - [x] 排查 s3 旧文件未删除问题 rm 后加一句 ls debug\n - [x] tag box 增加 focus\n- [x] reuse https://docs.github.com/en/actions/using-workflows/reusing-workflows\n\n\n## 二期\n\n- [x] favicon\n- [x] Google Analytics\n - [ ] sitemap 检查\n- [ ] test workflow for dependabot\n- [x] SEO better, og:type=article read more: https://ogp.me/#types\n- [x] 文章按创建时间倒序\n- [x] 写 README 与项目简介\n- [ ] Rss etc https://github.com/jpmonette/feed\n- [x] 响应式适配\n\n- tips:\n - md syntax -> mdx(react component) : use mdx provider component rewriting (code block to mermaid component)\n - md syntax -> special html -> use rehype plugin rewriting (katex, highlight)\n - special md syntax -> use remark plugin rewriting (could not to mdx, should first to html and then mdx provider rewrite)\n\n\nplus:\n- [ ] https://conv.denshochan.com/markdown\n - [ ] 段落内の改行\n - [ ] 行頭の文字下げ\n - [ ] Twitter アカウント\n - [ ] ルビ\n - [ ] ものルビ風の熟語ルビ\n- [ ] https://www.haxibami.net/blog/posts/blog-renewal\n - [ ] link card\n - [ ] image to next image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [ ] precompile mermaid\n- [ ] svg 输入\n - [ ] 绘画工具： KRITA ， 免费，有 mac os 版 https://docs.krita.org/zh_CN/user_manual.html\n - [ ] KRITA 推荐使用 Inkscape 进行编辑\n- [ ] vscode 语法站内相对链接\n - [ ] mui/base could be very good\n - [ ] search lunr？ -> mini search https://www.webpro.nl/articles/how-to-add-search-to-your-static-site\n - [ ] 可以简单参考 3b1b 直接全局 hold 住，然后全文搜索\n - [ ] blog list pagition (could be later, use infinite scroll)\n- [ ] nextjs 13 app directory https://beta.nextjs.org/docs/getting-started\n- [ ] ja 等多语言支持\n- [ ] 基于 git 的差量 build\n- [ ] 组件 visual testing https://glebbahmutov.com/blog/open-source-visual-testing-of-components/\n- [x] gh-pages gls 不可能，不支持\n- [x] gh-pages public paths\n- [ ] search console?\n- [ ] 参考以下链接优化主页\n - [ ] https://meola.booth.pm/items\n - [ ] https://makoto-kaminaga.jimdofree.com/\n\n\n","title":"用 Next.js 重构 blog ，TODO list","abstract":"- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex","length":160,"created_at":"2023-02-12T07:35:21.000Z","updated_at":"2023-02-12T07:25:33.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"first-idea","file":"public/content/ideas/first-idea.md","mediaDir":"content/ideas/first-idea","path":"/ideas/first-idea","meta":{"content":"# First Idea\nhello! first idea here!","title":"","abstract":"hello! first idea here!","length":2,"created_at":"2023-02-04T20:34:05.000Z","updated_at":null,"tags":[],"license":false}},{"slug":"newest","file":"public/content/ideas/newest.mdx","mediaDir":"content/ideas/newest","path":"/ideas/newest","meta":{"content":"\n这里是第一行，\n然后这里是第二行。\n\n这里是一些内容。\n再来一行。\n第三行。\n\n\n\n| 名称空间 | 隔离内容 | 内核版本 |\n| :------------ | :---------------------------- | :------- |\n| Mount | 文件系统与路径等 | 2.4.19 |\n| UTS | 主机的 Hostname、Domain names | 2.6.19 |\n| IPC | 进程间通信管道 | 2.6.19 |\n| PID | 独立的进程编号空间 | 2.6.24 |\n| Network | 网卡、IP 地址、端口等网络资源 | 2.6.29 |\n| User | 进程独立的用户和用户组 | 3.8 |\n| Cgroup | CPU 时间片，内存分页等 | 4.6 |\n| Time \\<- New! | 进程独立的系统时间 | 5.6 |\n\n```mermaid\nsequenceDiagram\nAlice->>John: Hello John, how are you?\nloop Healthcheck\n John->>John: Fight against hypochondria\nend\nNote right of John: Rational thoughts!\nJohn-->>Alice: Great!\nJohn->>Bob: How about you?\nBob-->>John: Jolly good!\n```\n\n```mermaid\npie\n\"Dogs\" : 386\n\"Cats\" : 85\n\"Rats\" : 15\n```\n\n```mermaid\ngraph LR\n\nohmy-->coll\n\n```\n\nnew lines!\n","title":"Kubernetes 入门 （1）","abstract":"这里是第一行，\n然后这里是第二行。\n这里是一些内容。","length":49,"created_at":"2022-08-13T17:45:31.000Z","updated_at":"2022-08-20T14:02:18.000Z","tags":["Kubernetes","DevOps","Docker","Cloud Native","Cloud Computing"],"license":true}}],"allTags":[{"tag":"Kubernetes","slug":"kubernetes","path":"/tags/kubernetes","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"DevOps","slug":"devops","path":"/tags/devops","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Docker","slug":"docker","path":"/tags/docker","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Cloud Native","slug":"cloud-native","path":"/tags/cloud-native","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"VSCode","slug":"vscode","path":"/tags/vscode","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"Hexo","slug":"hexo","path":"/tags/hexo","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"JavaScript","slug":"javascript","path":"/tags/javascript","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"GitHub","slug":"github","path":"/tags/github","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"AWS","slug":"aws","path":"/tags/aws","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"CI/CD","slug":"ci-cd","path":"/tags/ci-cd","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"IaC","slug":"iac","path":"/tags/iac","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"数据结构","slug":"数据结构","path":"/tags/数据结构","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"},{"postSlug":"python-dict","postType":"article"}]},{"tag":"算法","slug":"算法","path":"/tags/算法","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"算法竞赛","slug":"算法竞赛","path":"/tags/算法竞赛","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"}]},{"tag":"设计模式","slug":"设计模式","path":"/tags/设计模式","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"笔记","slug":"笔记","path":"/tags/笔记","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"排序","slug":"排序","path":"/tags/排序","postSlugs":[{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"Python","slug":"python","path":"/tags/python","postSlugs":[{"postSlug":"python-dict","postType":"article"}]},{"tag":"C++","slug":"c++","path":"/tags/c++","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"}]},{"tag":"杂技","slug":"杂技","path":"/tags/杂技","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"hello-world","postType":"article"}]},{"tag":"杂谈","slug":"杂谈","path":"/tags/杂谈","postSlugs":[{"postSlug":"hello-world","postType":"article"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Cloud Computing","slug":"cloud-computing","path":"/tags/cloud-computing","postSlugs":[{"postSlug":"newest","postType":"idea"}]}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/blog.json b/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/blog.json deleted file mode 100644 index 01ea4351..00000000 --- a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/blog.json +++ /dev/null @@ -1 +0,0 @@ -{"pageProps":{"allTagInfos":[{"tag":"Kubernetes","slug":"kubernetes","path":"/tags/kubernetes","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"DevOps","slug":"devops","path":"/tags/devops","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Docker","slug":"docker","path":"/tags/docker","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Cloud Native","slug":"cloud-native","path":"/tags/cloud-native","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"VSCode","slug":"vscode","path":"/tags/vscode","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"Hexo","slug":"hexo","path":"/tags/hexo","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"JavaScript","slug":"javascript","path":"/tags/javascript","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"GitHub","slug":"github","path":"/tags/github","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"AWS","slug":"aws","path":"/tags/aws","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"CI/CD","slug":"ci-cd","path":"/tags/ci-cd","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"IaC","slug":"iac","path":"/tags/iac","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"数据结构","slug":"数据结构","path":"/tags/数据结构","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"},{"postSlug":"python-dict","postType":"article"}]},{"tag":"算法","slug":"算法","path":"/tags/算法","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"算法竞赛","slug":"算法竞赛","path":"/tags/算法竞赛","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"}]},{"tag":"设计模式","slug":"设计模式","path":"/tags/设计模式","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"笔记","slug":"笔记","path":"/tags/笔记","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"排序","slug":"排序","path":"/tags/排序","postSlugs":[{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"Python","slug":"python","path":"/tags/python","postSlugs":[{"postSlug":"python-dict","postType":"article"}]},{"tag":"C++","slug":"c++","path":"/tags/c++","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"}]},{"tag":"杂技","slug":"杂技","path":"/tags/杂技","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"hello-world","postType":"article"}]},{"tag":"杂谈","slug":"杂谈","path":"/tags/杂谈","postSlugs":[{"postSlug":"hello-world","postType":"article"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Cloud Computing","slug":"cloud-computing","path":"/tags/cloud-computing","postSlugs":[{"postSlug":"newest","postType":"idea"}]}],"selectedTagInfo":{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},"posts":[{"slug":"blog-syntax","file":"public/content/ideas/blog-syntax.md","mediaDir":"content/ideas/blog-syntax","path":"/ideas/blog-syntax","meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts
prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":191,"created_at":"2024-04-14T18:58:06.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"blog-in-next","file":"public/content/ideas/blog-in-next.md","mediaDir":"content/ideas/blog-in-next","path":"/ideas/blog-in-next","meta":{"content":"\n# blog todo\n\n## 一期\n\n- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex\n - [x] rehype-slug\n - [x] https://github.com/unifiedjs/unified\n - [x] recma -> 修改 MDX , remark -> 修改 markdown ， rehype -> 修改 html\n - [x] https://www.haxibami.net/blog/posts/blog-renewal\n - [x] about img to next/Image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [x] introduction of remark https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html\n- [x] 下标语法行为 -> 修改默认不用 a 标签\n 使用 remark gfm 后自动解决\n- [x] 处理 picture 路径的问题\n- [x] 默认元素映射，处理代码高亮\n - [x] mermaid 渲染\n - [x] latex 渲染 弃用，思考 remark-rehype 优先\n - [x] latex 中文渲染\n - [x] vscode-memo 语法\n - [x] 站内多媒体相对链接\n - [x] latex 显示两次\n - [x] katex 需要特殊的 css ，加载后修复\n - [x] 没有闭合的左箭头自动转义\n 做不到， next-mdx-remote 调用 mdx-js ， createProcessor 中会在执行所有 remark 插件之前，先执行 remark-mdx ，无法通过插件修改 \n - https://github.com/mdx-js/mdx/tree/main/packages/remark-mdx\n - https://github.com/mdx-js/mdx/blob/main/packages/mdx/lib/core.js\n- [x] 简单的样式\n - [x] Article 页面\n - [x] 主页\n - [x] 主页封面： position: static 不会反应 z-index ，需要 position: 其他值\n - [x] about 页\n - 先不做\n - [x] 其他页的最小高度，处理 footer 不要太高\n - [x] Tag 页\n - [x] Idea 页\n - [x] refactor move meta together\n- [x] fix post list height\n- [x] fix post list page tag box\n- [x] SEO 简单\n - [x] site map https://github.com/iamvishnusankar/next-sitemap\n - [x] Header， title\n - [x] OG\n - [x] og:site_name vs og:title?\n - [x] og:url?\n - [x] footer\n - [x] icon hover 发光， bg 不要变色\n - [x] 增加 icon ， Pixiv\n- [x] 处理旧链接跳转 https://www.viget.com/articles/host-build-and-deploy-next-js-projects-on-github-pages/\n - [x] path prefix\n - [x] 环境变量？配置文件？\n - [x] 代码高亮换成静态后 mermaid 也要用 remark 处理\n - [x] mermaid 内样式 -> 修复 global applyed 的行高\n - [x] 为什么 haxibami 的样式不会变？为什么是 tspan 和 text ？待探究 -> 是 pie 和 sequence 默认的\n - [x] maybe rehype-raw ？ -> 不是 rehype-raw 的问题，而且如果用 rehype-raw 会让 mdx 渲染不了显示 Cannot compile `mdxJsxFlowElement` node\n - [x] https://github.com/mermaid-js/mermaid/issues/2688\n - [x] turning the htmlLables to false fixed this (maybe other types of charts should be tested as well)\n - [x] 去除 path 中的日期\n 1. get all slugs once\n 2. get post meta by slug\n - [x] 修复 image url 跳转\n - [x] link jump 301 -> 308\n - 不能直接在 config 里配置，不会自动静态生成\n - 在 getStaticProps 里处理:\n - param 中拿到 slug 以 string[] 出现， slash 无关\n - build 时出现 error：`redirect` can not be returned from getStaticProps during prerendering\n - https://nextjs.org/docs/messages/gsp-redirect-during-prerender\n - 放弃治疗\n- [x] git time versioning\n - [x] created at\n - [x] updated at\n- [x] 部署脚本\n - [x] ghpage\n - [x] gh page 环境 path 前缀设置，\n - [x] env file 使用\n - [x] s3 test + prod\n - reusable wrokflow (on workflow call) https://docs.github.com/en/actions/using-workflows/reusing-workflows\n - composite action (no details, not to use) https://docs.github.com/en/actions/creating-actions/creating-a-composite-action\n - use artifact between workflow https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts\n - an https://stackoverflow.com/questions/70003863/reusing-github-action-workflow-steps-inside-another-job\n - gh-pages 先用蠢办法， build 上传一次 artifact ，deploy 时在 gh-pages action 里再上传一次\n - [x] Github Action 复用\n - [x] test infra stack 更新使用 s3 web hosting\n - [x] 处理 url 结尾带 slash 问题\n - https://github.com/keaeriksson/hugo-s3-cloudfront \\<- 最终解决方案，用 pulumi 把这个重写一遍\n - maybe it's time to serverless https://github.com/serverless-nextjs/serverless-next.js\n - or just use vercel! \n\n - [x] 更新 prod （infra ， Deploy ）\n- [x] 修复 mermaid 渲染\n - [x] 方法1 remark 时处理，变静态 svg （简单）\n - [x] 方法2 highlight 推延到渲染时处理，用组件包裹 （希望优先）\n - [x] 组建渲染时快速刷新可能导致 syntax error\n - [x] 可能的处理闪动的信息： \n - https://github.com/ant-design/ant-design/issues/16037\n - https://stackoverflow.com/questions/72248724/components-flicker-during-server-side-render-for-nextjs-and-material-ui\n - https://www.stackfive.io/work/nextjs/how-to-fix-styled-components-page-flicker-in-next-js-12\n - https://stackoverflow.com/questions/65527040/using-prism-js-line-highlight-plugin-with-next-js-app-causes-text-content-did-n\n - https://css-tricks.com/syntax-highlighting-prism-on-a-next-js-site/#aa-highlighting-lines\n - https://www.felixmokross.dev/blog/code-samples-line-highlighting\n- [x] 修复：\n - [x] Home Page 下方链接点击问题\n - [x] 改进 trailing slash -> lambda 写错，要加 .html 不是 /index.html\n - [x] 排查 s3 旧文件未删除问题 rm 后加一句 ls debug\n - [x] tag box 增加 focus\n- [x] reuse https://docs.github.com/en/actions/using-workflows/reusing-workflows\n\n\n## 二期\n\n- [x] favicon\n- [x] Google Analytics\n - [ ] sitemap 检查\n- [ ] test workflow for dependabot\n- [x] SEO better, og:type=article read more: https://ogp.me/#types\n- [x] 文章按创建时间倒序\n- [x] 写 README 与项目简介\n- [ ] Rss etc https://github.com/jpmonette/feed\n- [x] 响应式适配\n\n- tips:\n - md syntax -> mdx(react component) : use mdx provider component rewriting (code block to mermaid component)\n - md syntax -> special html -> use rehype plugin rewriting (katex, highlight)\n - special md syntax -> use remark plugin rewriting (could not to mdx, should first to html and then mdx provider rewrite)\n\n\nplus:\n- [ ] https://conv.denshochan.com/markdown\n - [ ] 段落内の改行\n - [ ] 行頭の文字下げ\n - [ ] Twitter アカウント\n - [ ] ルビ\n - [ ] ものルビ風の熟語ルビ\n- [ ] https://www.haxibami.net/blog/posts/blog-renewal\n - [ ] link card\n - [ ] image to next image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [ ] precompile mermaid\n- [ ] svg 输入\n - [ ] 绘画工具： KRITA ， 免费，有 mac os 版 https://docs.krita.org/zh_CN/user_manual.html\n - [ ] KRITA 推荐使用 Inkscape 进行编辑\n- [ ] vscode 语法站内相对链接\n - [ ] mui/base could be very good\n - [ ] search lunr？ -> mini search https://www.webpro.nl/articles/how-to-add-search-to-your-static-site\n - [ ] 可以简单参考 3b1b 直接全局 hold 住，然后全文搜索\n - [ ] blog list pagition (could be later, use infinite scroll)\n- [ ] nextjs 13 app directory https://beta.nextjs.org/docs/getting-started\n- [ ] ja 等多语言支持\n- [ ] 基于 git 的差量 build\n- [ ] 组件 visual testing https://glebbahmutov.com/blog/open-source-visual-testing-of-components/\n- [x] gh-pages gls 不可能，不支持\n- [x] gh-pages public paths\n- [ ] search console?\n- [ ] 参考以下链接优化主页\n - [ ] https://meola.booth.pm/items\n - [ ] https://makoto-kaminaga.jimdofree.com/\n\n\n","title":"用 Next.js 重构 blog ，TODO list","abstract":"- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex","length":160,"created_at":"2023-02-12T07:35:21.000Z","updated_at":"2023-02-12T07:25:33.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"use-paste-image-and-vscode-memo","file":"public/content/articles/2022-04-03-use-paste-image-and-vscode-memo.md","mediaDir":"content/articles/2022-04-03-use-paste-image-and-vscode-memo","path":"/articles/use-paste-image-and-vscode-memo","meta":{"content":"\n我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。\n\n# 关于 vscode-memo\n\n可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。\n\nvscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：\n\n1. 使用独有的短链接语法 `[[]]` 连接到其他文档与图片。\n2. 修改文件名时自动同步更新链接，反向查找当前文档被那些文档链接。\n3. 鼠标悬停时能预览链接与图片。\n\n同时，由于 vscode-memo 是个 vscode 插件，可以跟 vscode 的其他众多插件合作使用。比如 [vscode-memo 官方文档](https://github.com/svsool/vscode-memo/blob/master/help/How%20to/Pasting%20images%20from%20clipboard.md)里就推荐将 vscode-memo 与 vscode-past-image 插件配合，粘贴图片。\n\n这篇文章主要的目的，也是利用这两个插件，达到把图片粘贴为短链接，并被 Hexo 正常渲染为网页。\n\n# Image Paste 与 Hexo 的配置\n\n这一步其实很简单。\n\n在 Hexo 的文章中，一般需要使用从根目录起的相对链接。如有文件结构：\n\n```tree\nsource\n├───img\n│ └───in-post\n│ ├───heap-cheat-sheet.jpg\n│ └───post-js-version.jpg\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n在 `2022-03-26-create-blog-cicd-by-github.md` 中引用 `heap-cheat-sheet.jpg` 这个图片，就需要 `![](/img/in-post/heap-cheat-sheet.jpg)` 这样的链接。\n\n但如果在配置里把 `post_asset_folder` 设为 `true` ，就可以在 Markdown 文件的同级位置的同名目录中直接找到图片。如：\n\n```tree\nsource\n├───img\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github\n │ ├───heap-cheat-sheet.jpg\n │ └───post-js-version.jpg\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n然后在 `2022-03-26-create-blog-cicd-by-github.md` 中可以直接 `![](heap-cheat-sheet.jpg)` 引用图片。为了图片文件管理方便，我们打开这个配置项。\n\n为了能让 Image Paste 粘贴的图片能放到这个同名文件夹下，我们需要修改 Image Paste 配置，在 VSCode 的 Workspace Setting 中，添加如下设置：\n\n```json\n{\n \"pasteImage.path\": \"${currentFileDir}/${currentFileNameWithoutExt}/\"\n}\n```\n\n# Image Paste 粘贴为 vscode-memo 短链接格式\n\n这一步也很简单。 Image Paste 可以设定粘贴后的格式。我们在 Workspace Setting 中添加如下设置即可：\n\n```json\n{\n \"pasteImage.insertPattern\": \"![[${imageFileName}]]\",\n}\n```\n\n这样我们粘贴后的图片就能有预览功能了。\n\n# 让 Hexo 正确渲染 vscode-memo 的短链接\n\n这一步其实是最难的。 Hexo 当然不认识 vscode-memo 的短链接，而经过调查，现在还没有现成的方案让 Hexo 与 vscode-memo 集成。虽然我们提倡尽量不要重复造轮子，但这里我们也是除了造轮子没有其他办法了。\n\n我们采用的方案是让 Hexo 在渲染 Markdown 前，先把 Markdown 中形如 `![[]]` 的短链接，替换为 `![]()` 的正常 Markdown 图片链接。\n\n假设我们项目 `source` 文件夹如下：\n\n```tree\nsource\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github\n │ ├───heap-cheat-sheet.jpg\n │ └───post-js-version.jpg\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n如在渲染 `2022-03-26-create-blog-cicd-by-github.md` 前，需要将其中的 `![[heat-cheat-sheet.jpg]]` 替换为 `![](heap-cheat-sheet.jpg)` 。我们知道 Hexo 在生成静态文件前会先把项目根目录下 `scripts` 目录下的所有脚本执行一遍。我们可以在这里注册一个 filter ，专门做这个替换。代码如下：\n\n```js\n'use-strict';\n\nhexo.extend.filter.register('before_post_render', function (data) {\n const isToHandle = (data) => {\n var source = data.source;\n var ext = source.substring(source.lastIndexOf('.') + 1, source.length).toLowerCase();\n return ['md'].indexOf(ext) > -1;\n }\n\n if (!isToHandle(data)) {\n return data;\n }\n\n const reg = /(\\s+)\\!\\[\\[(.+)\\]\\](\\s+)/g;\n\n data.content = data.content\n .replace(reg, function (raw, start, content, end) {\n var nameAndTitle = content.split('|');\n if (nameAndTitle.length == 1) {\n return `${start}![](${content})${end}`;\n }\n return `${start}![${nameAndTitle[1]}](${nameAndTitle[0]})${end}`;\n });\n return data;\n\n})\n```\n\n# 测试一下\n\n文章中如下内容：\n\n![[这部分内容会被转换为图片.png]]\n\n\n而你看到上面的内容是一张图片，表示这个转换已经成功了。\n\n# 不足之处\n\n这一段代码仍有以下待改进的地方：\n1. 如果图片短链接的内容写在 Code Block 里，也一样会被转换。实际上我们一般不希望 Code Block 里的内容被转换，需要过滤一下。\n2. 形如 `![[文件|图片描述]]` 的内容会正常转换为 `![图片描述](文件)` 。然而我现在用的这个主题不支持图片描述。以后可能需要更换主题。\n\n# 补充\n\n如果希望网站图片放在 `img` 之类的文件夹下统一管理，不把 `post_asset_folder` 设为 `true` ，也是没问题的，可以通过修改代码，在返回 `${content}` 前添加统一前缀。\n\n而如果希望图片放在 `img` 下，又要按文章分文件夹管理，如下情况：\n\n```tree\nsource\n├───img\n│ ├───2022-03-26-create-blog-cicd-by-github\n│ │ ├───heap-cheat-sheet.jpg\n│ │ └───post-js-version.jpg\n│ └───2022-04-03-use-paste-image-and-vscode-memo\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n可以通过在代码中引用 `data.source` 解决。","title":"完善 Hexo 编写环境，改善文章中使用图片的体验","abstract":"我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。\n可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。\nvscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：","length":158,"created_at":"2022-04-03T21:03:03.000Z","updated_at":"2022-04-03T17:47:52.000Z","tags":["Blog","VSCode","Hexo","JavaScript"],"license":false}},{"slug":"create-blog-cicd-by-github","file":"public/content/articles/2022-03-26-create-blog-cicd-by-github.md","mediaDir":"content/articles/2022-03-26-create-blog-cicd-by-github","path":"/articles/create-blog-cicd-by-github","meta":{"content":"\nGitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。\n但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。\n\n# 这篇文章的目标\n\n我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：\n1. 将文章 push 到 GitHub 的 master branch 后，自动触发。\n2. 我们博客使用 Hexo 引擎，需要先构建静态文件。\n3. 需要将静态文件部署到 GitHub Page 。\n4. 需要将静态文件部署到自己域名下。\n 这里我们使用 AWS 的 S3 服务与 CloudFront 服务直接部署到 CDN 上。 CloudFront 直接通过 OAI 访问 S3 ，不允许用户直接通过 S3 访问。\n5. 博客在 GitHub Page 与 S3 需要处于不同的路径下。\n 为了延续以往的情况，博客在 GitHub Page 需要部署在 `/blog/` 下。\n 而在 AWS 上我则希望直接部署在根目录下，这就导致需要两份配置文件。\n 当然弄两份配置文件我是不乐意的，于是就需要从模板自动生成配置文件...\n\n其中，一二三点都很好解决，而第四点会是一个比较难又比较坑爹的地方。\n\n# 先做简单的 —— CI/CD 构建并发布到 GitHub Pages\n\n这一步其实没什么难的， Hexo 官网上就有[这篇文章](https://hexo.io/docs/github-pages.html)写的十分详细了，可以作为参考。\n\n```yaml\nname: Pages\n\non:\n push:\n branches:\n - master # default branch\n\njobs:\n pages:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v2\n - name: Use Node.js 16.x\n uses: actions/setup-node@v2\n with:\n node-version: '16'\n - name: Cache NPM dependencies\n uses: actions/cache@v2\n with:\n path: node_modules\n key: ${{ runner.OS }}-npm-cache\n restore-keys: |\n ${{ runner.OS }}-npm-cache\n - name: Install Dependencies\n run: npm install\n - name: Build\n run: npm run build\n - name: Deploy\n uses: peaceiris/actions-gh-pages@v3\n with:\n github_token: ${{ secrets.GITHUB_TOKEN }}\n publish_dir: ./public\n publish_branch: gh-pages # deploying branch\n```\n\n这个 yaml 就是 GitHub Action 的 workflow 文件，在这个 workflow 里：\n1. 先用 `npm run build` 把静态文件生成到 `./public` 下\n2. 用 `peaceiris/actions-gh-pages@v3` 这个 action 把 `./public` 的文件放到 `gh-pages` 分支下。\n\n把上面这个 yaml 文件复制到 `.github/workflows/build.yml` 中，这样 master 分支上发生任何提交都会触发构建流程了。按照 Hexo 官网上的文档跑一边就能成功发布到 GitHub Pages 上了。\n\n不过我需要部署到 `/blog/` 下，这叫 Project Page ，因此我走的是 Hexo 文档的 Project Page 这一小节的流程，需要把 `_config.yml` 里做如下设置：\n\n```yaml\nurl: https://ryojerryyu.github.io/blog # 这个其实不是很重要，现在用的主题没有用到这个字段\nroot: /blog/ # 这个比较重要，这个不设定好，整个页面的超链接都会歪掉\n```\n\n当然， “没什么难” 的前提是你首先要对 Hexo 和 GitHub Action 有一个了解...\n\n# 难一点 —— 搭建 AWS 基础设施\n\n我为什么不止用 GitHub Pages 还要配一套 AWS 呢？其实主要还是想以后可能会做一下 Backend ，而且放 AWS 上还能利用 AWS 的服务做一下流量分析之类的。没这么些需求的小伙伴可以不用继续看了...\n\n我们打算使用 AWS 的 S3 与 CloudFront 服务， CloudFront 直接通过 OAI 访问 S3 。\n\n## S3\n\nS3 是 AWS 的对象储存服务，简单来说就是可以当网盘用，往里面放文件。\nS3 有静态网站托管服务，把静态文件放到 S3 里，配置一番就直接可以通过 HTTP 访问了，还能用自己的域名。\n但我们不打算使用 S3 的静态网站托管，因为我打算直接上 CDN ，又不想用户可以直接通过 S3 来访问我们的静态文件。\n\n## CloudFront\n\nCloudFront 是 AWS 的内容分发服务，简单来说就是 CDN 。其实它不只有 CDN 的功能，它还能加速动态调用，还能通过 CloudFront 连接 Web Socket ... 不过我们这次主要是用 CDN 功能。\nCloudFront 访问 S3 的方式还是有好几种的。中文教程最常见的是让你先打开 S3 静态网站托管，然后将 CloudFront 的源设为 S3 的域名。\n这个方法是最早支持的，因此推广的也比较开。但其实我觉得这个方法有些问题：\n\n1. S3 不做另外配置的话是可以直接访问的，比较 low\n2. S3 自己的 HTTP Endpoint 不能上 TLS ，所以 CloudFront 到 S3 这一段是裸奔的\n\n因此我打算使用 AWS 最近推荐的 OAI 方式访问 S3 。这种方式不走 HTTP Endpoint 而是 S3 自己的 S3 Endpoint ，可以通过 AWS 的 IAM 机制统一管理。\nOAI 是 Origin Access Identity ，简单来说就是给 CloudFront 一个 AWS IAM Policy 的 Principal 身份， S3 可以通过如下 Bucket Policy 限制外部只能通过这个 Principal 访问：\n```json\n{\n \"Version\": \"2012-10-17\",\n \"Statement\": [\n {\n \"Effect\": \"Allow\",\n \"Principal\": {\n \"AWS\": \"arn:aws:iam::cloudfront:user/\"\n },\n \"Action\": \"s3:GetObject\",\n \"Resource\": \"arn:aws:s3:::/*\"\n }\n ]\n}\n```\n上面这一段看不懂的同学，可以去补习一下 AWS IAM 权限管理机制，关键就是 Principal —— 主体 、 Action —— 动词 、 Resource —— 受体 的一个主谓宾模式。\n\n## 其他 AWS 服务\n\n当然，仅有 S3 和 CloudFront 是不足以实现全部功能的，我们还需要 Route53 来管理路由， ACM 来获取免费证书。\n但这些我都不打算细讲，因为内容真的很多-_-，而且大部分都是 AWS 的细节，搬到别的云上不一定适用...而且手动操作麻烦死了...\n\n## Pulumi\n\n综上嘛，我们需要：\n1. 建一个 Route53 Hosted Zone ，把域名交给 Route53 管理\n2. 用 ACM 给域名申请一个 us-east-1 Region 的免费证书（CloudFront 的证书必须在 us-east-1 ）\n3. 建一个 S3 储存桶，把 Public Access Block 配置一下\n4. 建一个 CloudFront Distribution ，通过 OAI 来访问 S3 ，还要指定一下证书\n5. 给 S3 配一个 Bucket Policy ，允许 CloudFront 访问\n6. 把 Route53 里的域名弄个 DNS 记录指向 CloudFront\n\n手动操作麻烦死了，于是我打算用 IaC (Infrastructure-as-Code) 来解决。我把这些基础设施定义用 Pulumi 写成的代码放在[这里](https://github.com/RyoJerryYu/aws-blog-infra/tree/c97f0fe41b5c0306d5343ddfc22f4a3775d79b88/website)了，大家可以参考一下（做了模块化，跟我其他基础设施放一起了）。\n\n当然，用 Pulumi 没什么特别原因，纯粹是因为我最近在写 Pulumi... 你完全可以用其他 IaC 工具（Ansible、Terraform、CloudFormation）来做。而且 Pulumi 太新了，用起来挺多 Bug 的...（也许是我不会用）\n\n## 测试一下\n\nS3 桶啥的都建好之后，本地把文件 build 一下，用 `aws s3 cp ./public/ s3:/// --recursive` 之类的命令上传到 S3 ，给 CloudFront 创建一个 Invalidation 刷新一下 CloudFront 缓存，访问域名看看，有返回个 HTML 我们的基础设施就算是跑通了。此时可能会出现以下情况，都属正常：\n1. 访问返回 307 ：\n 是 S3 储存桶 Region 不在 us-east-1 导致的。\n CloudFront 是通过 s3 的 global endpoint 访问 s3 的，但不在 us-east-1 的 s3 刚新建时还不能通过 global endpoint 访问。\n 参考 so 的[这个问题](https://stackoverflow.com/questions/38706424/aws-cloudfront-returns-http-307-when-origin-is-s3-bucket)：\n\n > All buckets have at least two REST endpoint hostnames. In eu-west-1, they are example-bucket.s3-eu-west-1.amazonaws.com and example-bucket.s3.amazonaws.com. The first one will be immedately valid when the bucket is created. The second one -- sometimes referred to as the \"global endpoint\" -- which is the one CloudFront uses -- will not, unless the bucket is in us-east-1. Over a period of seconds to minutes, variable by location and other factors, it becomes globally accesible as well. Before that, the 307 redirect is returned. Hence, the bucket was not ready.\n \n 这时候只要等个十几分钟就好了。\n2. 本地 build 的时候没配置好的话，js 之类的静态文件可能返回不了，但问题不大，我们接下来再处理。\n\n\n# 搭建 S3 的 workflow\n\n基础设施搭好了，我们就要像 deploy 到 GitHub Pages 一样，造一个自动管线发布到 S3 了。\n整理一下，我们的 workflow 里要包括：\n\n1. 从模板生成配置文件\n 别忘了，我需要的是静态文件部署在 GitHub Pages 和自己域名下的不同路径上。 Hexo 生成静态文件前配置文件必须要改的。\n2. 把原先 s3 上的文件删除，并上传新的文件到 s3\n3. 给 CloudFront 创建一个 Invalidation 刷新缓存\n\n## 生成配置文件\n\n这一步其实方案很多，甚至 bash 直接全文替换都可以...\n不过怕以后要改的东西变多，这里还是选择一些模板生成工具。有如下选择：\n\n1. 屠龙刀 Ansible\n2. Python Jinja2\n3. Go Template\n\n这里用 Ansible 确实是大材小用了，而且 Ansible 不能在 Windows 下用还是有点不方便，只能弃选。而 Python 和 Go 里我选了 Go Template ，原因是... 不想写 Python...\n这里其实确实是装逼了，这种小型脚本应该 Python 比 Go 合适的多。不过还好 Go run 可以不先 go mod 就能运行，不算是个太差的选择。不过以后还是大概率要改回 Python 。\n\n写 golang 脚本没有难度，大致如下：\n\ngolang template 的 name 要是 file name\n```golang\nname := path.Base(*tmpl)\nt := template.Must(template.New(name).ParseFiles(*tmpl))\nerr = t.Execute(os.Stdout, config)\nif err != nil {\n log.Fatal(err)\n}\n```\ngithub workflow 如下\n```yaml \n- name: Use Go 1.16\n uses: actions/setup-go@v1\n with:\n go-version: '1.16.1'\n\n- name: generate config\n run: go run ./genconfig/main.go --env=gh-pages > _config.yml\n\n```\nwindows 玩家可能要注意一下，windows 下编码有问题， `go run ./genconfig/main.go --env=gh-pages > _config.yml` 这段命令直接在 PowerShell 下跑生成出来的文件不能被 Hexo 识别。不过没什么关系，反正这段到时候是在 GitHub Action Runner 上跑的，只不过是不能本地生成用来测试而已。\n\n[参考代码](https://raw.githubusercontent.com/RyoJerryYu/blog/2f407cb6ee723d0e17c97af1289bd2231bb265ab/genconfig/main.go)\n\n## 上传 s3 与刷新 CloudFront\n\n后两步搜一下发现其实有很多现成的 GitHub Action 可以用。\n不过我没有采用，原因是——真的没必要啊...就几个命令的事，又不是不会敲...\n\nworkflows yaml 如下：\n```yaml\n- name: Configure AWS\n uses: aws-actions/configure-aws-credentials@v1\n with:\n aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}\n aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}\n aws-region: ap-northeast-1\n- name: Deploy\n env:\n S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}\n DISTRIBUTION_ID: ${{ secrets.AWS_CLOUDFRONT_DISTRIBUTION_ID }}\n run: |\n aws s3 rm s3://$S3_BUCKET/* --recursive\n aws s3 cp ./public s3://$S3_BUCKET/ --recursive\n aws cloudfront create-invalidation --distribution-id $DISTRIBUTION_ID --paths '/*' --region=us-east-1\n```\n\n[完整 yaml 参考代码](https://raw.githubusercontent.com/RyoJerryYu/blog/f0affb812f2de437943d9cf2a4f8a5fe690d1efd/.github/workflows/clouds.yml)\n\n由于改为了生成配置文件， deploy 到 Github Pages 的 yaml 也要做相应改动，这里就不多说。\n\n# CloudFront 的一点小问题（不太小）\n\n这样我们的整个流程是不是跑完了？我们的博客已经部署到自己的域名下了？\n浏览器打开自己的域名看看，完美显示！\n\n等等，别高兴的太早，点进去一篇文章... 403 了...\n\n403 的原因：\n1. hexo 生成出来的 page 连接是 `/` 结尾的，如 `/2022/03/26/create-blog-cicd-by-github/` ，然后通过 HTTP 服务器的自动转义指向 `/2022/03/26/create-blog-cicd-by-github/index.html` 文件。\n2. CloudFront 可以定义默认根对象，没有为每个子路径都自动转义的功能。\n3. S3 的 HTTP endpoint 可以配置索引文档，为每个子路径自动转义，但 CloudFront 通过 OAI 访问 S3 时通过 REST endpoint 访问，不会触发自动转义。\n\n一大波参考阅读：\n\n[Specifying a default root object](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/DefaultRootObject.html)\n> Here's an example of how a default root object works. Suppose the following request points to the object image.jpg:\n> ```\n> https://d111111abcdef8.cloudfront.net/image.jpg\n> ```\n> In contrast, the following request points to the root URL of the same distribution instead of to a specific object, as in the first example:\n> ```\n> https://d111111abcdef8.cloudfront.net/\n> ```\n> When you define a default root object, an end-user request that calls the root of your distribution returns the default root object. For example, if you designate the file index.html as your default root object, a request for:\n> ```\n> https://d111111abcdef8.cloudfront.net/\n> ```\n> Returns:\n> ```\n> https://d111111abcdef8.cloudfront.net/index.html\n> ```\n> However, if you define a default root object, an end-user request for a subdirectory of your distribution does not return the default root object. For example, suppose index.html is your default root object and that CloudFront receives an end-user request for the install directory under your CloudFront distribution:\n> ```\n> https://d111111abcdef8.cloudfront.net/install/\n> ```\n> CloudFront does not return the default root object even if a copy of index.html appears in the install directory.\n> \n> If you configure your distribution to allow all of the HTTP methods that CloudFront supports, the default root object applies to all methods. For example, if your default root object is index.php and you write your application to submit a POST request to the root of your domain (http://example.com), CloudFront sends the request to http://example.com/index.php.\n> \n> The behavior of CloudFront default root objects is different from the behavior of Amazon S3 index documents. When you configure an Amazon S3 bucket as a website and specify the index document, Amazon S3 returns the index document even if a user requests a subdirectory in the bucket. (A copy of the index document must appear in every subdirectory.) For more information about configuring Amazon S3 buckets as websites and about index documents, see the Hosting Websites on Amazon S3 chapter in the Amazon Simple Storage Service User Guide.\n\n[Configuring an index document](https://docs.aws.amazon.com/AmazonS3/latest/userguide/IndexDocumentSupport.html)\n> In Amazon S3, a bucket is a flat container of objects. It does not provide any hierarchical organization as the file system on your computer does. However, you can create a logical hierarchy by using object key names that imply a folder structure.\n> \n> For example, consider a bucket with three objects that have the following key names. Although these are stored with no physical hierarchical organization, you can infer the following logical folder structure from the key names:\n> - sample1.jpg — Object is at the root of the bucket.\n> - photos/2006/Jan/sample2.jpg — Object is in the photos/2006/Jan subfolder.\n> - photos/2006/Feb/sample3.jpg — Object is in the photos/2006/Feb subfolder.\n> \n> In the Amazon S3 console, you can also create a folder in a bucket. For example, you can create a folder named photos. You can upload objects to the bucket or to the photos folder within the bucket. If you add the object sample.jpg to the bucket, the key name is sample.jpg. If you upload the object to the photos folder, the object key name is photos/sample.jpg.\n> \n> If you create a folder structure in your bucket, you must have an index document at each level. In each folder, the index document must have the same name, for example, index.html. When a user specifies a URL that resembles a folder lookup, the presence or absence of a trailing slash determines the behavior of the website. For example, the following URL, with a trailing slash, returns the photos/index.html index document.\n> ```\n> http://bucket-name.s3-website.Region.amazonaws.com/photos/\n> ```\n> \n> However, if you exclude the trailing slash from the preceding URL, Amazon S3 first looks for an object photos in the bucket. If the photos object is not found, it searches for an index document, photos/index.html. If that document is found, Amazon S3 returns a 302 Found message and points to the photos/ key. For subsequent requests to photos/, Amazon S3 returns photos/index.html. If the index document is not found, Amazon S3 returns an error.\n\n[Implementing Default Directory Indexes in Amazon S3-backed Amazon CloudFront Origins Using Lambda@Edge](https://aws.amazon.com/blogs/compute/implementing-default-directory-indexes-in-amazon-s3-backed-amazon-cloudfront-origins-using-lambdaedge/)\n> If you implement CloudFront in front of S3, you can achieve this by using an OAI. However, in order to do this, you cannot use the HTTP endpoint that is exposed by S3’s static website hosting feature. Instead, CloudFront must use the S3 REST endpoint to fetch content from your origin so that the request can be authenticated using the OAI. This presents some challenges in that the REST endpoint does not support redirection to a default index page.\n\n> CloudFront does allow you to specify a default root object (index.html), but it only works on the root of the website (such as http://www.example.com > http://www.example.com/index.html). It does not work on any subdirectory (such as http://www.example.com/about/). If you were to attempt to request this URL through CloudFront, CloudFront would do a S3 GetObject API call against a key that does not exist.\n\n\n\n那么，我们要怎么解决这个问题呢？我觉得，这个问题有三种解决方法：\n\n1. 不使用 OAI ，让 CloudFront 直接指向 S3 的域名，让 CloudFront 使用 S3 HTTP Endpoint 的特性\n2. 调整 Hexo 配置，更改生成文件路径或连接路径\n3. 使用 AWS 推荐的 Lambda@Edge 功能，在 CloudFront 上修改路径\n\n其中第二种方案是最下策，我们不能在还有其他方案的情况下，因为基础设施的一个性质就去修改我们的产品。况且我们的产品在大多数场景下都是适用的。\n第一种方案是中策，也许实行起来也是最简单的。但我不想用，原因上面也说过了。\n第三种方案是实施起来难度最大的，我们要引入 Lambda 这一新概念。但反正折腾嘛，试试就试试，反正失败了再变回第一种方案就是。\n\n## 创建 Lambda\n\n[Implementing Default Directory Indexes in Amazon S3-backed Amazon CloudFront Origins Using Lambda@Edge](https://aws.amazon.com/blogs/compute/implementing-default-directory-indexes-in-amazon-s3-backed-amazon-cloudfront-origins-using-lambdaedge/)\n\n参考上面的文档，我们直接在 Console 创建一个 Lambda 函数，内容如下：\n\n```javascript\n'use strict';\nexports.handler = (event, context, callback) => {\n \n // Extract the request from the CloudFront event that is sent to Lambda@Edge \n var request = event.Records[0].cf.request;\n\n // Extract the URI from the request\n var olduri = request.uri;\n\n // Match any '/' that occurs at the end of a URI. Replace it with a default index\n var newuri = olduri.replace(/\\/$/, '\\/index.html');\n \n // Log the URI as received by CloudFront and the new URI to be used to fetch from origin\n console.log(\"Old URI: \" + olduri);\n console.log(\"New URI: \" + newuri);\n \n // Replace the received URI with the URI that includes the index page\n request.uri = newuri;\n \n // Return to CloudFront\n return callback(null, request);\n\n};\n```\n这一段代码主要作用是把接收到每个以 `/` 结尾的请求，都转换为以 `/index.html` 结尾的请求。\n\nDeploy 之后，为 Lambda 添加 Trigger ，选择 CloudFront 作为 Trigger ， Event 选择 On Request 。按照界面的提示为 Lambda 创建专用的 Role 。\n提交后，我们就可以通过 Url 访问，发现 `/` 结尾的 URL 也会正常显示了。\n\n# 之后的事\n\n这个过程仍有以下问题：\n- 对 Lambda 的认识仍有不足，今后需继续学习运用\n- Lambda@Edge 还没有结合到 IaC 中\n- 配置文件生成过程仍有改进空间\n\n留下这些问题，今后再修改。\n","title":"用 GitHub Action 自动化构建 Hexo 并发布到 S3","abstract":"GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。\n但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。\n我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：","length":342,"created_at":"2022-03-26T23:55:08.000Z","updated_at":"2022-03-27T13:31:04.000Z","tags":["Blog","GitHub","AWS","CI/CD","IaC","DevOps"],"license":false}},{"slug":"init-a-new-hexo-project","file":"public/content/articles/2021-12-12-init-a-new-hexo-project.md","mediaDir":"content/articles/2021-12-12-init-a-new-hexo-project","path":"/articles/init-a-new-hexo-project","meta":{"content":"\n## 使用 hexo 搭建博客\n\n最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。\n对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。\n\n使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。\n\n我们可以尝试一下代码块高亮：\n\n```python\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n试试下标语法吧：\n\n这是一句话。[^sub]\n\n没想到还支持下标语法，还是比较惊艳的。\n\n来几句 mermaid 吧\n\n```mermaid\ngraph LR\n\nohmy-->coll\n\n```\n\n原本是不能渲染的， 这个主题渲染代码块时把 mermaid 代码当作普通代码，往里面里插换行符号了。\n使用了 hexo-filter-mermaid-diagrams 插件，添加 mermaid 过滤器，解决问题。\n\n\n来几句 LaTeX:\n\n$$\n\\begin{aligned}\nf(x) &= \\sum_{i=2}^{\\infty}{\\Join} \\\\\n&= \\sum_{i=2}^{\\infty}{\\frac{1}{i}}\n\\end{aligned}\n$$\n\n原本是不能渲染的，因为与 hexo 的渲染器有冲突，需要转义。\n我因为需要从以前的博客把文章转移过来觉得比较麻烦...\n于是魔改了一下主题，用上 mathjax 插件，能渲染了，感觉挺不错的。\n再改善一下推个 PR 吧。\n\n\n\n\n[^sub]: 这是脚注","title":"init-a-new-hexo-project","abstract":"最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。\n对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。\n使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。","length":66,"created_at":"2021-12-12T20:09:13.000Z","updated_at":"2022-03-27T13:30:33.000Z","tags":["Blog"],"license":false}},{"slug":"Building-this-blog","file":"public/content/articles/2020-01-27-Building-this-blog.md","mediaDir":"content/articles/2020-01-27-Building-this-blog","path":"/articles/Building-this-blog","meta":{"content":"\n> “Stop Trying to Reinvent the Wheel.”\n\n## 博客构建\n\n\n#### 把仓库clone到本地\n\n参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。\n\n整个网站文件夹大致结构如下：\n\n```\n├── _config.yml\n|\n├── _posts/\n| ├── 2007-10-29-awsome-file-name.md\n| └── 2009-04-26-stupid-file-name.md\n├── img/\n| ├── in-post/\n| ├── awsome-bg.jpg\n| ├── avatar-ryo.png\n| ├── favicon.ico\n| └── icon_wechat.jpg\n├── other_awsome_directory/\n| └── awsomefiles\n|\n|\n├── 404.html\n├── about.html\n├── index.html\n└── other_awsome_files\n```\n\n博客的文章上传到`_posts`文件夹中，网站中用到的图片上传到`img`文件夹中，网站的全局设置在`_config.yml`中进行。\n\n\n\n#### 修改**_config.yml**文件\n\n修改根目录下的`_config.yml`文件，将其中的内容更改为自己的信息。\n\n```yml\n# Site settings\ntitle: Ryo's Blog\nSEOTitle: 阿亮仔的博客 | 亮のブログ | Ryo's Blog\nheader-img: img/home-bg.jpg\nemail: qq250707340@163.com\ndescription: \"君の夢が　叶うのは　誰かのおかげじゃないぜ。\"\nkeyword: \"Ryo, Blog, 阿亮仔, りょう, 博客, ブログ, Algorithm, Unity, Python, C-Sharp\"\nurl: \"http://RyoJerryYu.github.io\" # your host, for absolute URL\nbaseurl: \"\" # for example, '/blog' if your blog hosted on 'host/blog'\ngithub_repo: \"https://github.com/RyoJerryYu/RyoJerryYu.github.io.git\" # you code repository\n```\n- `SEOTitle`: ``标签，即显示在浏览器标题中的文字。\n- `header-img`: 首页显示的图像，可以把路径更改为自己的图片。\n- `description`: `<meta name=\"description\">`中的内容。\n- `keyword`: `<meta name=\"keyword\">`中的内容。\n- `url`, `baseurl`: 分别为博客域名地址与其下路径。如不想将博客直接架在根路径下，需要对`baseurl`进行设置。\n- `github_repo`: 博客所在的GitHub仓库。\n\n---\n\n\n```yml\n# SNS settings\nRSS: false\n# weibo_username: huxpro\n# zhihu_username: huxpro\ngithub_username: RyoJerryYu\ntwitter_username: ryo_okami\n# facebook_username: huxpro\n```\n分别为各个社交网站上的账号信息，以供在侧边栏中直接跳转到对应的页面。可通过在行首添加或删除`#`进行注释或取消注释。\n\n从[原仓库][origin_repo]中直接fork出来时，社交网站的图标可能会有[无法显示的问题](https://github.com/Huxpro/huxblog-boilerplate/issues/17)，其解决方法在[后面](#FixSNS)介绍。\n\n---\n\n\n```yml\n# Disqus settings\n#disqus_username: _your_disqus_short_name_\n\n# Duoshuo settings\n# duoshuo_username: huxblog\n# Share component is depend on Comment so we can NOT use share only.\n# duoshuo_share: true # set to false if you want to use Comment without Sharing\n\n# Gitalk\ngitalk:\n enable: false #是否开启Gitalk评论\n clientID: f2c84e7629bb1446c1a4 #生成的clientID\n clientSecret: ca6d6139d1e1b8c43f8b2e19492ddcac8b322d0d #生成的clientSecret\n repo: qiubaiying.github.io #仓库名称\n owner: qiubaiying #github用户名\n admin: qiubaiying\n distractionFreeMode: true #是否启用类似FB的阴影遮罩 \n```\n分别为各种评论系统。均未开启。\n\n---\n\n\n```yml\n# Analytics settings\n# Baidu Analytics\n# ba_track_id: 4cc1f2d8f3067386cc5cdb626a202900\n# Google Analytics\nga_track_id: 'UA-156933256-1' # Format: UA-xxxxxx-xx\nga_domain: auto\n```\n分别为百度与谷歌的网站统计。我只启用了Google Analytics。可先到[Google Marketing Platform](https://marketingplatform.google.com/about/)注册，开启Google Analytics。在`设置`->`媒体资源设置`中获得Track ID，并填入`ga_track_id`中。\n\n---\n\n\n```yml\n# Sidebar settings\nsidebar: true # whether or not using Sidebar.\nsidebar-about-description: \"记录平时遇到的问题，以及对应的解决方法。偶尔上传些许宅活或是娱乐方面的记录。\"\nsidebar-avatar: /img/avatar-ryo.png # use absolute URL, seeing it's used in both `/` and `/about/`\n```\n`sidebar`: 是否开启侧边栏，为`true`或`false`。\n`sidebar-about-description`: 显示在侧边栏中的个人简介。\n`sidebar-avatar`: 显示在侧边栏中的头像。\n\n---\n\n\n```yml\n# Featured Tags\nfeatured-tags: true # whether or not using Feature-Tags\nfeatured-condition-size: 2 # A tag will be featured if the size of it is more than this condition value\n```\n是否开启tag功能，以及最少要达到多少篇文章才能使tag显示在首页上。\n\n\n\n#### 修改主页等信息\n\n修改`index.html`、`404.html`、`about.html`、`tags.html`等文件，将其中的内容更改为自己的信息。\n\n- 在`index`中，修改`description`对应的内容，亦即主页中标题下方的描述。\n- 在`404`、`tags`、`about`中，修改`description`的内容，亦即404页面中的描述信息。如有需要，也可以修改`header-img`，即404页面的图片地址。\n- 在`about`中，还有修改自我介绍对应的内容。\n\n\n\n#### 修改图片信息\n\n修改`img/`下的图片，替换为自己的图片。要记得替换以下图片：\n- `avatar-ryo.png`\n- `favicon.ico`\n- `icon_wechat.png`\n\n\n\n#### 修改README.md\n\nREADME.md为Github仓库的介绍，可以在README.md中写上这个博客主要的内容，让别人了解这个博客。\n\n\n\n#### 完成\n\n将`_posts`中的博文全部删除后，将本地文件全部push到GitHub仓库中。稍等后用浏览器浏览`<用户名>.github.io`（或是你在`_config.yml`中设定的路径）。若发现网页已更新，即博客搭建成功，可以开始写博文了。\n\n*然而，并没有成功。*\n\n\n\n## Fix Bug\n\n<p id = \"FixReadmeCh\"></p>\n\n#### 修复README.zh.md引发的错误\n\n按上述步骤搭建完毕后，网页并没有正常显示。此时GitHub账号所关联的邮箱中收到标题为**Page build failure**的邮件，内容如下：\n> The page build failed for the `master` branch with the following error:\n> The tag `if` on line 235 in `README.zh.md` was not properly closed.\n\n如[原仓库][origin_repo]中的[issue#11](https://github.com/Huxpro/huxblog-boilerplate/issues/11)所示，在`README.zh.md`中存在`if`语句，会触发错误。\n\n因并无其他特别的需求，此处采用暴力删除`README.zh.md`的方法解决。\n\n对应commit：[删除README.zh.md，尝试修复因...](https://github.com/RyoJerryYu/RyoJerryYu.GitHub.io/commit/098d710160775df9b6d2cf04d7d4eec526a67bf4)\n\n\n<p id = \"FixSNS\"></p>\n\n#### 修复SNS链接不正常显示\n\n修复上述错误后，稍等即可正常打开网页。但是，我们在`_config.yml`中设置好的SNS链接并没有在侧边栏以及网页底部正常显示。如原仓库中的[issue#17](https://github.com/Huxpro/huxblog-boilerplate/issues/17)所示，原因是gitpage必须通过https访问bootcss.com等的cdn。\n\n此处采用原仓库[pull request#21](https://github.com/Huxpro/huxblog-boilerplate/pull/21)的方法，修改`_includes/head.html`, `_includes/footer.html`, `_layouts/keynote.html`, `_layouts/post.html`文件，将其中`http`修改为`https`。\n\n对应commit：[fix: change http into https](https://github.com/RyoJerryYu/RyoJerryYu.GitHub.io/commit/ec954c380472f30f09efdfadd074cb7967c2fa11)\n\n\n\n## 上传文章\n\n文章主要放在_posts文件夹中，用`git push`的方式推送到GitHub仓库，即可完成文章上传。\n\n文章正文以**markdown**语法书写，在文本头部增加如下格式的信息：\n```\n---\nlayout: post\ntitle: \"Welcome to Ryo's Blog!\"\nsubtitle: \" \\\"Hello World, Hello Blog\\\"\"\ndate: 2020-01-27 12:00:00\nauthor: \"Ryo\"\nheader-img: \"img/post-bg-default.jpg\"\ntags:\n - 杂技\n - 杂谈\n---\n```\n其中：\n- `layout`为文章所用的模板，可选`post`或`keynote`，也可自己写一个模板html放在`_layouts`文件夹下。\n- `title`为文章标题，`subtitle`为文章副标题。\n- `date`为博客中显示的文章发表时间。\n- `author`为博客中显示的作者。\n- `header-img`为文章顶部显示的封面。\n- `tags`为文章的标签，我们的博客网站可以通过标签来快速寻找文章。\n\n把文章的文件名命名为时间+标题的形式，后缀名使用markdown文本的通用后缀名`md`，如`2020-01-27-hello-world.md`。完成后将此文本文件放到`_posts/`文件夹下。文章中使用到的图片建议放到`img/in-post/`文件夹下。\n\n完成后，使用`git push`推送到GitHub仓库，稍等后刷新博客网页即可看见刚才上传的文章。文章的url一般为：`<博客地址>/<文章文件名中的年>/<月>/<日>/<文件名中剩余部分>`。\n\n\n\n\n## 祝你开始愉快的博客生活。\n\n\n#### 感谢\n\n- [Huxpro][Huxpro]提供的博客模板：[huxblog-boilerplate][origin_repo]\n- [BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]\n- [Luo Yifan（罗一凡）](https://github.com/iVanlIsh)提供的Bug解决方案。\n\n\n\n\n[Huxpro]: https://github.com/huxpro\n[BruceZhao]: https://github.com/BruceZhaoR\n[origin_repo]: https://github.com/Huxpro/huxblog-boilerplate\n[READMEzh]: https://github.com/Huxpro/huxpro.github.io/blob/master/README.zh.md","title":"搭建博客的过程","abstract":"> “Stop Trying to Reinvent the Wheel.”\n参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。\n整个网站文件夹大致结构如下：","length":250,"created_at":"2020-01-27T14:00:00.000Z","updated_at":"2022-03-27T13:30:33.000Z","tags":["杂技","Blog"],"license":false}}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/nextjs.json b/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/nextjs.json deleted file mode 100644 index 4d6b2ec3..00000000 --- a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/nextjs.json +++ /dev/null @@ -1 +0,0 @@ -{"pageProps":{"allTagInfos":[{"tag":"Kubernetes","slug":"kubernetes","path":"/tags/kubernetes","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"DevOps","slug":"devops","path":"/tags/devops","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Docker","slug":"docker","path":"/tags/docker","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Cloud Native","slug":"cloud-native","path":"/tags/cloud-native","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"VSCode","slug":"vscode","path":"/tags/vscode","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"Hexo","slug":"hexo","path":"/tags/hexo","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"JavaScript","slug":"javascript","path":"/tags/javascript","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"GitHub","slug":"github","path":"/tags/github","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"AWS","slug":"aws","path":"/tags/aws","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"CI/CD","slug":"ci-cd","path":"/tags/ci-cd","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"IaC","slug":"iac","path":"/tags/iac","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"数据结构","slug":"数据结构","path":"/tags/数据结构","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"},{"postSlug":"python-dict","postType":"article"}]},{"tag":"算法","slug":"算法","path":"/tags/算法","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"算法竞赛","slug":"算法竞赛","path":"/tags/算法竞赛","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"}]},{"tag":"设计模式","slug":"设计模式","path":"/tags/设计模式","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"笔记","slug":"笔记","path":"/tags/笔记","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"排序","slug":"排序","path":"/tags/排序","postSlugs":[{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"Python","slug":"python","path":"/tags/python","postSlugs":[{"postSlug":"python-dict","postType":"article"}]},{"tag":"C++","slug":"c++","path":"/tags/c++","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"}]},{"tag":"杂技","slug":"杂技","path":"/tags/杂技","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"hello-world","postType":"article"}]},{"tag":"杂谈","slug":"杂谈","path":"/tags/杂谈","postSlugs":[{"postSlug":"hello-world","postType":"article"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Cloud Computing","slug":"cloud-computing","path":"/tags/cloud-computing","postSlugs":[{"postSlug":"newest","postType":"idea"}]}],"selectedTagInfo":{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},"posts":[{"slug":"blog-syntax","file":"public/content/ideas/blog-syntax.md","mediaDir":"content/ideas/blog-syntax","path":"/ideas/blog-syntax","meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts <br/>prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":191,"created_at":"2024-04-14T18:58:06.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"blog-in-next","file":"public/content/ideas/blog-in-next.md","mediaDir":"content/ideas/blog-in-next","path":"/ideas/blog-in-next","meta":{"content":"\n# blog todo\n\n## 一期\n\n- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex\n - [x] rehype-slug\n - [x] https://github.com/unifiedjs/unified\n - [x] recma -> 修改 MDX , remark -> 修改 markdown ， rehype -> 修改 html\n - [x] https://www.haxibami.net/blog/posts/blog-renewal\n - [x] about img to next/Image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [x] introduction of remark https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html\n- [x] 下标语法行为 -> 修改默认不用 a 标签\n 使用 remark gfm 后自动解决\n- [x] 处理 picture 路径的问题\n- [x] 默认元素映射，处理代码高亮\n - [x] mermaid 渲染\n - [x] latex 渲染 弃用，思考 remark-rehype 优先\n - [x] latex 中文渲染\n - [x] vscode-memo 语法\n - [x] 站内多媒体相对链接\n - [x] latex 显示两次\n - [x] katex 需要特殊的 css ，加载后修复\n - [x] 没有闭合的左箭头自动转义\n 做不到， next-mdx-remote 调用 mdx-js ， createProcessor 中会在执行所有 remark 插件之前，先执行 remark-mdx ，无法通过插件修改 \n - https://github.com/mdx-js/mdx/tree/main/packages/remark-mdx\n - https://github.com/mdx-js/mdx/blob/main/packages/mdx/lib/core.js\n- [x] 简单的样式\n - [x] Article 页面\n - [x] 主页\n - [x] 主页封面： position: static 不会反应 z-index ，需要 position: 其他值\n - [x] about 页\n - 先不做\n - [x] 其他页的最小高度，处理 footer 不要太高\n - [x] Tag 页\n - [x] Idea 页\n - [x] refactor move meta together\n- [x] fix post list height\n- [x] fix post list page tag box\n- [x] SEO 简单\n - [x] site map https://github.com/iamvishnusankar/next-sitemap\n - [x] Header， title\n - [x] OG\n - [x] og:site_name vs og:title?\n - [x] og:url?\n - [x] footer\n - [x] icon hover 发光， bg 不要变色\n - [x] 增加 icon ， Pixiv\n- [x] 处理旧链接跳转 https://www.viget.com/articles/host-build-and-deploy-next-js-projects-on-github-pages/\n - [x] path prefix\n - [x] 环境变量？配置文件？\n - [x] 代码高亮换成静态后 mermaid 也要用 remark 处理\n - [x] mermaid 内样式 -> 修复 global applyed 的行高\n - [x] 为什么 haxibami 的样式不会变？为什么是 tspan 和 text ？待探究 -> 是 pie 和 sequence 默认的\n - [x] maybe rehype-raw ？ -> 不是 rehype-raw 的问题，而且如果用 rehype-raw 会让 mdx 渲染不了显示 Cannot compile `mdxJsxFlowElement` node\n - [x] https://github.com/mermaid-js/mermaid/issues/2688\n - [x] turning the htmlLables to false fixed this (maybe other types of charts should be tested as well)\n - [x] 去除 path 中的日期\n 1. get all slugs once\n 2. get post meta by slug\n - [x] 修复 image url 跳转\n - [x] link jump 301 -> 308\n - 不能直接在 config 里配置，不会自动静态生成\n - 在 getStaticProps 里处理:\n - param 中拿到 slug 以 string[] 出现， slash 无关\n - build 时出现 error：`redirect` can not be returned from getStaticProps during prerendering\n - https://nextjs.org/docs/messages/gsp-redirect-during-prerender\n - 放弃治疗\n- [x] git time versioning\n - [x] created at\n - [x] updated at\n- [x] 部署脚本\n - [x] ghpage\n - [x] gh page 环境 path 前缀设置，\n - [x] env file 使用\n - [x] s3 test + prod\n - reusable wrokflow (on workflow call) https://docs.github.com/en/actions/using-workflows/reusing-workflows\n - composite action (no details, not to use) https://docs.github.com/en/actions/creating-actions/creating-a-composite-action\n - use artifact between workflow https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts\n - an https://stackoverflow.com/questions/70003863/reusing-github-action-workflow-steps-inside-another-job\n - gh-pages 先用蠢办法， build 上传一次 artifact ，deploy 时在 gh-pages action 里再上传一次\n - [x] Github Action 复用\n - [x] test infra stack 更新使用 s3 web hosting\n - [x] 处理 url 结尾带 slash 问题\n - https://github.com/keaeriksson/hugo-s3-cloudfront \\<- 最终解决方案，用 pulumi 把这个重写一遍\n - maybe it's time to serverless https://github.com/serverless-nextjs/serverless-next.js\n - or just use vercel! \n\n - [x] 更新 prod （infra ， Deploy ）\n- [x] 修复 mermaid 渲染\n - [x] 方法1 remark 时处理，变静态 svg （简单）\n - [x] 方法2 highlight 推延到渲染时处理，用组件包裹 （希望优先）\n - [x] 组建渲染时快速刷新可能导致 syntax error\n - [x] 可能的处理闪动的信息： \n - https://github.com/ant-design/ant-design/issues/16037\n - https://stackoverflow.com/questions/72248724/components-flicker-during-server-side-render-for-nextjs-and-material-ui\n - https://www.stackfive.io/work/nextjs/how-to-fix-styled-components-page-flicker-in-next-js-12\n - https://stackoverflow.com/questions/65527040/using-prism-js-line-highlight-plugin-with-next-js-app-causes-text-content-did-n\n - https://css-tricks.com/syntax-highlighting-prism-on-a-next-js-site/#aa-highlighting-lines\n - https://www.felixmokross.dev/blog/code-samples-line-highlighting\n- [x] 修复：\n - [x] Home Page 下方链接点击问题\n - [x] 改进 trailing slash -> lambda 写错，要加 .html 不是 /index.html\n - [x] 排查 s3 旧文件未删除问题 rm 后加一句 ls debug\n - [x] tag box 增加 focus\n- [x] reuse https://docs.github.com/en/actions/using-workflows/reusing-workflows\n\n\n## 二期\n\n- [x] favicon\n- [x] Google Analytics\n - [ ] sitemap 检查\n- [ ] test workflow for dependabot\n- [x] SEO better, og:type=article read more: https://ogp.me/#types\n- [x] 文章按创建时间倒序\n- [x] 写 README 与项目简介\n- [ ] Rss etc https://github.com/jpmonette/feed\n- [x] 响应式适配\n\n- tips:\n - md syntax -> mdx(react component) : use mdx provider component rewriting (code block to mermaid component)\n - md syntax -> special html -> use rehype plugin rewriting (katex, highlight)\n - special md syntax -> use remark plugin rewriting (could not to mdx, should first to html and then mdx provider rewrite)\n\n\nplus:\n- [ ] https://conv.denshochan.com/markdown\n - [ ] 段落内の改行\n - [ ] 行頭の文字下げ\n - [ ] Twitter アカウント\n - [ ] ルビ\n - [ ] ものルビ風の熟語ルビ\n- [ ] https://www.haxibami.net/blog/posts/blog-renewal\n - [ ] link card\n - [ ] image to next image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [ ] precompile mermaid\n- [ ] svg 输入\n - [ ] 绘画工具： KRITA ， 免费，有 mac os 版 https://docs.krita.org/zh_CN/user_manual.html\n - [ ] KRITA 推荐使用 Inkscape 进行编辑\n- [ ] vscode 语法站内相对链接\n - [ ] mui/base could be very good\n - [ ] search lunr？ -> mini search https://www.webpro.nl/articles/how-to-add-search-to-your-static-site\n - [ ] 可以简单参考 3b1b 直接全局 hold 住，然后全文搜索\n - [ ] blog list pagition (could be later, use infinite scroll)\n- [ ] nextjs 13 app directory https://beta.nextjs.org/docs/getting-started\n- [ ] ja 等多语言支持\n- [ ] 基于 git 的差量 build\n- [ ] 组件 visual testing https://glebbahmutov.com/blog/open-source-visual-testing-of-components/\n- [x] gh-pages gls 不可能，不支持\n- [x] gh-pages public paths\n- [ ] search console?\n- [ ] 参考以下链接优化主页\n - [ ] https://meola.booth.pm/items\n - [ ] https://makoto-kaminaga.jimdofree.com/\n\n\n","title":"用 Next.js 重构 blog ，TODO list","abstract":"- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex","length":160,"created_at":"2023-02-12T07:35:21.000Z","updated_at":"2023-02-12T07:25:33.000Z","tags":["Blog","Nextjs"],"license":false}}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/Building-this-blog.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/Building-this-blog.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/Building-this-blog.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/Building-this-blog.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/Handy-heap-cheat-sheet.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/Handy-heap-cheat-sheet.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/Handy-heap-cheat-sheet.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/Handy-heap-cheat-sheet.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/Sort-algorithm.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/Sort-algorithm.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/Sort-algorithm.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/Sort-algorithm.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/The-beauty-of-design-parten.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/The-beauty-of-design-parten.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/The-beauty-of-design-parten.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/The-beauty-of-design-parten.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/create-blog-cicd-by-github.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/create-blog-cicd-by-github.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/create-blog-cicd-by-github.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/create-blog-cicd-by-github.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/graph-for-economics-1.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/graph-for-economics-1.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/graph-for-economics-1.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/graph-for-economics-1.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/graph-for-economics-2.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/graph-for-economics-2.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/graph-for-economics-2.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/graph-for-economics-2.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/hello-world.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/hello-world.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/hello-world.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/hello-world.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/init-a-new-hexo-project.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/init-a-new-hexo-project.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/init-a-new-hexo-project.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/init-a-new-hexo-project.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/introduction-for-k8s-2.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/introduction-for-k8s-2.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/introduction-for-k8s-2.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/introduction-for-k8s-2.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/introduction-for-k8s.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/introduction-for-k8s.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/introduction-for-k8s.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/introduction-for-k8s.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/python-dict.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/python-dict.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/python-dict.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/python-dict.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/the-using-in-cpp.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/the-using-in-cpp.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/the-using-in-cpp.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/the-using-in-cpp.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/use-paste-image-and-vscode-memo.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/use-paste-image-and-vscode-memo.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/use-paste-image-and-vscode-memo.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/use-paste-image-and-vscode-memo.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/why-homogeneous.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/articles/why-homogeneous.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/articles/why-homogeneous.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/articles/why-homogeneous.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/clips.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/clips.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/clips.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/clips.json diff --git a/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas.json new file mode 100644 index 00000000..fe306324 --- /dev/null +++ b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas.json @@ -0,0 +1 @@ +{"pageProps":{"posts":[{"slug":"blog-syntax","file":"public/content/ideas/blog-syntax.md","mediaDir":"content/ideas/blog-syntax","path":"/ideas/blog-syntax","meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\n另一个 mermaid 流程图，同样类型不会冲突\n\n```mermaid\ngraph TD\n A((圆)) --> B([圆边])\n B --> C[(DB)]\n```\n\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts <br/>prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":200,"created_at":"2024-04-15T16:44:34.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"using-chart-js","file":"public/content/ideas/using-chart-js.mdx","mediaDir":"content/ideas/using-chart-js","path":"/ideas/using-chart-js","meta":{"content":"\n# testing for using chart js\n\nUse Chart.js in React.\n\nIntroduce:\n\n- Chart.js: https://github.com/chartjs/Chart.js\n- react-chartjs-2: https://github.com/reactchartjs/react-chartjs-2\n- remark-mdx-chartjs: https://github.com/pangelani/remark-mdx-chartjs\n\n# Chart.js\n\nDocumentation:\n\nhttps://www.chartjs.org/docs/latest/\n\nWe should use the Tree-shaking feature for react-chartjs-2.\n\nA very helpful guide about Chart.js:\n\nhttps://www.chartjs.org/docs/latest/getting-started/usage.html\n\n# react-chartjs-2\n\nDocumentation:\n\nhttps://react-chartjs-2.js.org/\n\nwe could code like this:\n\n```jsx\n<Bar\n data={{\n labels: [\"January\", \"February\", \"March\"],\n datasets: [\n {\n label: \"Dataset 1\",\n data: [10, 20, 30],\n backgroundColor: \"rgba(255, 99, 132, 0.5)\",\n },\n {\n label: \"Dataset 2\",\n data: [20, 30, 40],\n backgroundColor: \"rgba(53, 162, 235, 0.5)\",\n },\n ],\n }}\n/>\n```\n\nand result:\n\n<Bar\n data={{\n labels: [\"January\", \"February\", \"March\"],\n datasets: [\n {\n label: \"Dataset 1\",\n data: [10, 20, 30],\n backgroundColor: \"rgba(255, 99, 132, 0.5)\",\n },\n {\n label: \"Dataset 2\",\n data: [20, 30, 40],\n backgroundColor: \"rgba(53, 162, 235, 0.5)\",\n },\n ],\n }}\n/>\n\nAnd it is tree-shakable.\n\nhttps://react-chartjs-2.js.org/docs/migration-to-v4/#tree-shaking\n\n# remark-mdx-chartjs\n\nhttps://github.com/pangelani/remark-mdx-chartjs\n\nWith this, could write chart in markdown.\n\n````md\n```chartjs\ntype: bar\ndata:\nlabels: [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\"]\ndatasets:\n - label: \"Dataset 1\"\n data: [0,2,6,1,7,13,2]\n backgroundColor: \"rgba(255, 99, 132, 0.5)\"\n\n - label: \"Dataset 2\"\n data: [4,2,11,8,6,1,4]\n backgroundColor: \"rgba(53, 162, 235, 0.5)\"\n```\n````\n\n```chartjs\ntype: bar\ndata:\nlabels: [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\"]\ndatasets:\n - label: \"Dataset 1\"\n data: [0,2,6,1,7,13,2]\n backgroundColor: \"rgba(255, 99, 132, 0.5)\"\n\n - label: \"Dataset 2\"\n data: [4,2,11,8,6,1,4]\n backgroundColor: \"rgba(53, 162, 235, 0.5)\"\n```\n\nBut it's not written in TypeScript, and raising a TS7016 error.\nSo raise an issue, and wait for the type definition.\n","title":"About Chart.js","abstract":"Use Chart.js in React.\nIntroduce:\n- Chart.js: https://github.com/chartjs/Chart.js","length":114,"created_at":"2023-02-12T16:56:33.000Z","updated_at":"2023-02-12T16:36:52.000Z","tags":[],"license":false}},{"slug":"blog-in-next","file":"public/content/ideas/blog-in-next.md","mediaDir":"content/ideas/blog-in-next","path":"/ideas/blog-in-next","meta":{"content":"\n# blog todo\n\n## 一期\n\n- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex\n - [x] rehype-slug\n - [x] https://github.com/unifiedjs/unified\n - [x] recma -> 修改 MDX , remark -> 修改 markdown ， rehype -> 修改 html\n - [x] https://www.haxibami.net/blog/posts/blog-renewal\n - [x] about img to next/Image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [x] introduction of remark https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html\n- [x] 下标语法行为 -> 修改默认不用 a 标签\n 使用 remark gfm 后自动解决\n- [x] 处理 picture 路径的问题\n- [x] 默认元素映射，处理代码高亮\n - [x] mermaid 渲染\n - [x] latex 渲染 弃用，思考 remark-rehype 优先\n - [x] latex 中文渲染\n - [x] vscode-memo 语法\n - [x] 站内多媒体相对链接\n - [x] latex 显示两次\n - [x] katex 需要特殊的 css ，加载后修复\n - [x] 没有闭合的左箭头自动转义\n 做不到， next-mdx-remote 调用 mdx-js ， createProcessor 中会在执行所有 remark 插件之前，先执行 remark-mdx ，无法通过插件修改 \n - https://github.com/mdx-js/mdx/tree/main/packages/remark-mdx\n - https://github.com/mdx-js/mdx/blob/main/packages/mdx/lib/core.js\n- [x] 简单的样式\n - [x] Article 页面\n - [x] 主页\n - [x] 主页封面： position: static 不会反应 z-index ，需要 position: 其他值\n - [x] about 页\n - 先不做\n - [x] 其他页的最小高度，处理 footer 不要太高\n - [x] Tag 页\n - [x] Idea 页\n - [x] refactor move meta together\n- [x] fix post list height\n- [x] fix post list page tag box\n- [x] SEO 简单\n - [x] site map https://github.com/iamvishnusankar/next-sitemap\n - [x] Header， title\n - [x] OG\n - [x] og:site_name vs og:title?\n - [x] og:url?\n - [x] footer\n - [x] icon hover 发光， bg 不要变色\n - [x] 增加 icon ， Pixiv\n- [x] 处理旧链接跳转 https://www.viget.com/articles/host-build-and-deploy-next-js-projects-on-github-pages/\n - [x] path prefix\n - [x] 环境变量？配置文件？\n - [x] 代码高亮换成静态后 mermaid 也要用 remark 处理\n - [x] mermaid 内样式 -> 修复 global applyed 的行高\n - [x] 为什么 haxibami 的样式不会变？为什么是 tspan 和 text ？待探究 -> 是 pie 和 sequence 默认的\n - [x] maybe rehype-raw ？ -> 不是 rehype-raw 的问题，而且如果用 rehype-raw 会让 mdx 渲染不了显示 Cannot compile `mdxJsxFlowElement` node\n - [x] https://github.com/mermaid-js/mermaid/issues/2688\n - [x] turning the htmlLables to false fixed this (maybe other types of charts should be tested as well)\n - [x] 去除 path 中的日期\n 1. get all slugs once\n 2. get post meta by slug\n - [x] 修复 image url 跳转\n - [x] link jump 301 -> 308\n - 不能直接在 config 里配置，不会自动静态生成\n - 在 getStaticProps 里处理:\n - param 中拿到 slug 以 string[] 出现， slash 无关\n - build 时出现 error：`redirect` can not be returned from getStaticProps during prerendering\n - https://nextjs.org/docs/messages/gsp-redirect-during-prerender\n - 放弃治疗\n- [x] git time versioning\n - [x] created at\n - [x] updated at\n- [x] 部署脚本\n - [x] ghpage\n - [x] gh page 环境 path 前缀设置，\n - [x] env file 使用\n - [x] s3 test + prod\n - reusable wrokflow (on workflow call) https://docs.github.com/en/actions/using-workflows/reusing-workflows\n - composite action (no details, not to use) https://docs.github.com/en/actions/creating-actions/creating-a-composite-action\n - use artifact between workflow https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts\n - an https://stackoverflow.com/questions/70003863/reusing-github-action-workflow-steps-inside-another-job\n - gh-pages 先用蠢办法， build 上传一次 artifact ，deploy 时在 gh-pages action 里再上传一次\n - [x] Github Action 复用\n - [x] test infra stack 更新使用 s3 web hosting\n - [x] 处理 url 结尾带 slash 问题\n - https://github.com/keaeriksson/hugo-s3-cloudfront \\<- 最终解决方案，用 pulumi 把这个重写一遍\n - maybe it's time to serverless https://github.com/serverless-nextjs/serverless-next.js\n - or just use vercel! \n\n - [x] 更新 prod （infra ， Deploy ）\n- [x] 修复 mermaid 渲染\n - [x] 方法1 remark 时处理，变静态 svg （简单）\n - [x] 方法2 highlight 推延到渲染时处理，用组件包裹 （希望优先）\n - [x] 组建渲染时快速刷新可能导致 syntax error\n - [x] 可能的处理闪动的信息： \n - https://github.com/ant-design/ant-design/issues/16037\n - https://stackoverflow.com/questions/72248724/components-flicker-during-server-side-render-for-nextjs-and-material-ui\n - https://www.stackfive.io/work/nextjs/how-to-fix-styled-components-page-flicker-in-next-js-12\n - https://stackoverflow.com/questions/65527040/using-prism-js-line-highlight-plugin-with-next-js-app-causes-text-content-did-n\n - https://css-tricks.com/syntax-highlighting-prism-on-a-next-js-site/#aa-highlighting-lines\n - https://www.felixmokross.dev/blog/code-samples-line-highlighting\n- [x] 修复：\n - [x] Home Page 下方链接点击问题\n - [x] 改进 trailing slash -> lambda 写错，要加 .html 不是 /index.html\n - [x] 排查 s3 旧文件未删除问题 rm 后加一句 ls debug\n - [x] tag box 增加 focus\n- [x] reuse https://docs.github.com/en/actions/using-workflows/reusing-workflows\n\n\n## 二期\n\n- [x] favicon\n- [x] Google Analytics\n - [ ] sitemap 检查\n- [ ] test workflow for dependabot\n- [x] SEO better, og:type=article read more: https://ogp.me/#types\n- [x] 文章按创建时间倒序\n- [x] 写 README 与项目简介\n- [ ] Rss etc https://github.com/jpmonette/feed\n- [x] 响应式适配\n\n- tips:\n - md syntax -> mdx(react component) : use mdx provider component rewriting (code block to mermaid component)\n - md syntax -> special html -> use rehype plugin rewriting (katex, highlight)\n - special md syntax -> use remark plugin rewriting (could not to mdx, should first to html and then mdx provider rewrite)\n\n\nplus:\n- [ ] https://conv.denshochan.com/markdown\n - [ ] 段落内の改行\n - [ ] 行頭の文字下げ\n - [ ] Twitter アカウント\n - [ ] ルビ\n - [ ] ものルビ風の熟語ルビ\n- [ ] https://www.haxibami.net/blog/posts/blog-renewal\n - [ ] link card\n - [ ] image to next image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [ ] precompile mermaid\n- [ ] svg 输入\n - [ ] 绘画工具： KRITA ， 免费，有 mac os 版 https://docs.krita.org/zh_CN/user_manual.html\n - [ ] KRITA 推荐使用 Inkscape 进行编辑\n- [ ] vscode 语法站内相对链接\n - [ ] mui/base could be very good\n - [ ] search lunr？ -> mini search https://www.webpro.nl/articles/how-to-add-search-to-your-static-site\n - [ ] 可以简单参考 3b1b 直接全局 hold 住，然后全文搜索\n - [ ] blog list pagition (could be later, use infinite scroll)\n- [ ] nextjs 13 app directory https://beta.nextjs.org/docs/getting-started\n- [ ] ja 等多语言支持\n- [ ] 基于 git 的差量 build\n- [ ] 组件 visual testing https://glebbahmutov.com/blog/open-source-visual-testing-of-components/\n- [x] gh-pages gls 不可能，不支持\n- [x] gh-pages public paths\n- [ ] search console?\n- [ ] 参考以下链接优化主页\n - [ ] https://meola.booth.pm/items\n - [ ] https://makoto-kaminaga.jimdofree.com/\n\n\n","title":"用 Next.js 重构 blog ，TODO list","abstract":"- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex","length":160,"created_at":"2023-02-12T07:35:21.000Z","updated_at":"2023-02-12T07:25:33.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"first-idea","file":"public/content/ideas/first-idea.md","mediaDir":"content/ideas/first-idea","path":"/ideas/first-idea","meta":{"content":"# First Idea\nhello! first idea here!","title":"<No Title>","abstract":"hello! first idea here!","length":2,"created_at":"2023-02-04T20:34:05.000Z","updated_at":null,"tags":[],"license":false}},{"slug":"newest","file":"public/content/ideas/newest.mdx","mediaDir":"content/ideas/newest","path":"/ideas/newest","meta":{"content":"\n这里是第一行，\n然后这里是第二行。\n\n这里是一些内容。\n再来一行。\n第三行。\n\n<License />\n\n| 名称空间 | 隔离内容 | 内核版本 |\n| :------------ | :---------------------------- | :------- |\n| Mount | 文件系统与路径等 | 2.4.19 |\n| UTS | 主机的 Hostname、Domain names | 2.6.19 |\n| IPC | 进程间通信管道 | 2.6.19 |\n| PID | 独立的进程编号空间 | 2.6.24 |\n| Network | 网卡、IP 地址、端口等网络资源 | 2.6.29 |\n| User | 进程独立的用户和用户组 | 3.8 |\n| Cgroup | CPU 时间片，内存分页等 | 4.6 |\n| Time \\<- New! | 进程独立的系统时间 | 5.6 |\n\n```mermaid\nsequenceDiagram\nAlice->>John: Hello John, how are you?\nloop Healthcheck\n John->>John: Fight against hypochondria\nend\nNote right of John: Rational thoughts!\nJohn-->>Alice: Great!\nJohn->>Bob: How about you?\nBob-->>John: Jolly good!\n```\n\n```mermaid\npie\n\"Dogs\" : 386\n\"Cats\" : 85\n\"Rats\" : 15\n```\n\n```mermaid\ngraph LR\n\nohmy-->coll\n\n```\n\nnew lines!\n","title":"Kubernetes 入门 （1）","abstract":"这里是第一行，\n然后这里是第二行。\n这里是一些内容。","length":49,"created_at":"2022-08-13T17:45:31.000Z","updated_at":"2022-08-20T14:02:18.000Z","tags":["Kubernetes","DevOps","Docker","Cloud Native","Cloud Computing"],"license":true}}],"allTags":[{"tag":"Kubernetes","slug":"kubernetes","path":"/tags/kubernetes","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"DevOps","slug":"devops","path":"/tags/devops","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Docker","slug":"docker","path":"/tags/docker","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Cloud Native","slug":"cloud-native","path":"/tags/cloud-native","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"VSCode","slug":"vscode","path":"/tags/vscode","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"Hexo","slug":"hexo","path":"/tags/hexo","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"JavaScript","slug":"javascript","path":"/tags/javascript","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"GitHub","slug":"github","path":"/tags/github","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"AWS","slug":"aws","path":"/tags/aws","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"CI/CD","slug":"ci-cd","path":"/tags/ci-cd","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"IaC","slug":"iac","path":"/tags/iac","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"数据结构","slug":"数据结构","path":"/tags/数据结构","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"},{"postSlug":"python-dict","postType":"article"}]},{"tag":"算法","slug":"算法","path":"/tags/算法","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"算法竞赛","slug":"算法竞赛","path":"/tags/算法竞赛","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"}]},{"tag":"设计模式","slug":"设计模式","path":"/tags/设计模式","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"笔记","slug":"笔记","path":"/tags/笔记","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"排序","slug":"排序","path":"/tags/排序","postSlugs":[{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"Python","slug":"python","path":"/tags/python","postSlugs":[{"postSlug":"python-dict","postType":"article"}]},{"tag":"C++","slug":"c++","path":"/tags/c++","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"}]},{"tag":"杂技","slug":"杂技","path":"/tags/杂技","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"hello-world","postType":"article"}]},{"tag":"杂谈","slug":"杂谈","path":"/tags/杂谈","postSlugs":[{"postSlug":"hello-world","postType":"article"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Cloud Computing","slug":"cloud-computing","path":"/tags/cloud-computing","postSlugs":[{"postSlug":"newest","postType":"idea"}]}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/blog-in-next.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas/blog-in-next.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/blog-in-next.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/ideas/blog-in-next.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/blog-syntax.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas/blog-syntax.json similarity index 87% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/blog-syntax.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/ideas/blog-syntax.json index 9ad6a436..dc276af8 100644 --- a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/blog-syntax.json +++ b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas/blog-syntax.json @@ -1 +1 @@ -{"pageProps":{"slug":"blog-syntax","tags":[{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]}],"source":{"compiledSource":"/*@jsxRuntime automatic @jsxImportSource react*/\nconst {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = Object.assign({\n h1: \"h1\",\n a: \"a\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n h6: \"h6\",\n p: \"p\",\n strong: \"strong\",\n em: \"em\",\n del: \"del\",\n blockquote: \"blockquote\",\n code: \"code\",\n div: \"div\",\n pre: \"pre\",\n span: \"span\",\n ul: \"ul\",\n li: \"li\",\n ol: \"ol\",\n img: \"img\",\n table: \"table\",\n thead: \"thead\",\n tr: \"tr\",\n th: \"th\",\n tbody: \"tbody\",\n td: \"td\",\n sup: \"sup\",\n math: \"math\",\n semantics: \"semantics\",\n mtable: \"mtable\",\n mtr: \"mtr\",\n mtd: \"mtd\",\n mstyle: \"mstyle\",\n mover: \"mover\",\n mi: \"mi\",\n mo: \"mo\",\n mrow: \"mrow\",\n annotation: \"annotation\",\n msup: \"msup\",\n mn: \"mn\",\n section: \"section\"\n }, _provideComponents(), props.components), {MermaidCodeBlock, ObsidianRich} = _components;\n if (!MermaidCodeBlock) _missingMdxReference(\"MermaidCodeBlock\", true);\n if (!ObsidianRich) _missingMdxReference(\"ObsidianRich\", true);\n return _jsxs(_Fragment, {\n children: [_jsx(_components.h1, {\n id: \"一级标题\",\n children: _jsx(_components.a, {\n href: \"#一级标题\",\n children: \"一级标题\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"二级标题\",\n children: _jsx(_components.a, {\n href: \"#二级标题\",\n children: \"二级标题\"\n })\n }), \"\\n\", _jsx(_components.h3, {\n id: \"三级标题\",\n children: _jsx(_components.a, {\n href: \"#三级标题\",\n children: \"三级标题\"\n })\n }), \"\\n\", _jsx(_components.h4, {\n id: \"四级标题\",\n children: _jsx(_components.a, {\n href: \"#四级标题\",\n children: \"四级标题\"\n })\n }), \"\\n\", _jsx(_components.h5, {\n id: \"五级标题\",\n children: _jsx(_components.a, {\n href: \"#五级标题\",\n children: \"五级标题\"\n })\n }), \"\\n\", _jsx(_components.h6, {\n id: \"六级标题\",\n children: _jsx(_components.a, {\n href: \"#六级标题\",\n children: \"六级标题\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.strong, {\n children: \"加粗\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.em, {\n children: \"斜体\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.em, {\n children: _jsx(_components.strong, {\n children: \"加粗斜体\"\n })\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.del, {\n children: \"删除线\"\n })\n }), \"\\n\", _jsxs(_components.blockquote, {\n children: [\"\\n\", _jsx(_components.p, {\n children: \"引用\"\n }), \"\\n\"]\n }), \"\\n\", _jsx(_components.h1, {\n id: \"其他-md-语法\",\n children: _jsx(_components.a, {\n href: \"#其他-md-语法\",\n children: \"其他 MD 语法\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"代码块\",\n children: _jsx(_components.a, {\n href: \"#代码块\",\n children: \"代码块\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.code, {\n children: \"行内代码\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"代码块高亮：\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n style: {\n backgroundColor: \"#232136\"\n },\n tabIndex: \"0\",\n \"data-language\": \"python\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"python\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#908CAA\",\n fontStyle: \"italic\"\n },\n children: \"#\"\n }), _jsx(_components.span, {\n style: {\n color: \"#6E6A86\",\n fontStyle: \"italic\"\n },\n children: \" 代码块\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"def\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EA9A97\"\n },\n children: \"func_echo\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"):\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EB6F92\",\n fontStyle: \"italic\"\n },\n children: \"print\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"class\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"HelloPrinter\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" printer\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" Callable\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"[[\"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"]]\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"def\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EB6F92\",\n fontStyle: \"italic\"\n },\n children: \"__init__\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \",\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"printer\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" Callable\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"[[\"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"]]):\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \".\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"printer \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" printer\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"def\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EA9A97\"\n },\n children: \"call\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \",\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"):\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \".\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"printer\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"p \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" HelloPrinter\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"func_echo\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"p\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \".\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"call\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#F6C177\"\n },\n children: \"\\\"hello world!\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n })]\n })\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"大围栏\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n style: {\n backgroundColor: \"#232136\"\n },\n tabIndex: \"0\",\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: [_jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"```\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"def func_echo(s: str):\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" print(s)\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"```\"\n })\n })]\n })\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"行内反引号围栏： \", _jsx(_components.code, {\n children: \"`\"\n }), \" 或者 \", _jsx(_components.code, {\n children: \"``\"\n }), \" 的模式\"]\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n style: {\n backgroundColor: \"#232136\"\n },\n tabIndex: \"0\",\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"`\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"段落反引号内的行内反引号\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"`\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"列表\",\n children: _jsx(_components.a, {\n href: \"#列表\",\n children: \"列表\"\n })\n }), \"\\n\", _jsxs(_components.ul, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"无序列表\", \"\\n\", _jsxs(_components.ul, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"无序列表\", \"\\n\", _jsxs(_components.ul, {\n children: [\"\\n\", _jsx(_components.li, {\n children: \"无序列表\"\n }), \"\\n\", _jsx(_components.li, {\n children: \"无序列表\"\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\", _jsxs(_components.ol, {\n children: [\"\\n\", _jsx(_components.li, {\n children: \"有序列表\"\n }), \"\\n\", _jsx(_components.li, {\n children: \"有序列表\"\n }), \"\\n\", _jsx(_components.li, {\n children: \"有序列表\"\n }), \"\\n\"]\n }), \"\\n\", _jsx(_components.h2, {\n id: \"链接\",\n children: _jsx(_components.a, {\n href: \"#链接\",\n children: \"链接\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"https://blog.ryo-okami.xyz\",\n children: \"链接\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"/ideas/blog-syntax\",\n children: \"站内链接\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"图片\",\n children: _jsx(_components.a, {\n href: \"#图片\",\n children: \"图片\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"图片：\"\n }), \"\\n\", _jsx(_components.img, {\n src: \"https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif\",\n alt: \"图片\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"站内图片：\"\n }), \"\\n\", _jsx(_components.img, {\n src: \"/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif\",\n alt: \"站内图片\"\n }), \"\\n\", _jsx(_components.h2, {\n id: \"表格\",\n children: _jsx(_components.a, {\n href: \"#表格\",\n children: \"表格\"\n })\n }), \"\\n\", _jsxs(_components.table, {\n children: [_jsx(_components.thead, {\n children: _jsxs(_components.tr, {\n children: [_jsx(_components.th, {\n children: \"表头\"\n }), _jsx(_components.th, {\n children: \"表头\"\n }), _jsx(_components.th, {\n children: \"表头\"\n })]\n })\n }), _jsxs(_components.tbody, {\n children: [_jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n })]\n })]\n })]\n }), \"\\n\", _jsx(_components.h2, {\n id: \"脚注\",\n children: _jsx(_components.a, {\n href: \"#脚注\",\n children: \"脚注\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"下标\", _jsx(_components.sup, {\n children: _jsx(_components.a, {\n href: \"#user-content-fn-1\",\n id: \"user-content-fnref-1\",\n \"data-footnote-ref\": true,\n \"aria-describedby\": \"footnote-label\",\n children: \"1\"\n })\n })]\n }), \"\\n\", _jsx(_components.h1, {\n id: \"插件\",\n children: _jsx(_components.a, {\n href: \"#插件\",\n children: \"插件\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"katex\",\n children: _jsx(_components.a, {\n href: \"#katex\",\n children: \"Katex\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"行间公式\"\n }), \"\\n\", _jsx(_components.div, {\n className: \"math math-display\",\n children: _jsx(_components.span, {\n className: \"katex-display\",\n children: _jsxs(_components.span, {\n className: \"katex\",\n children: [_jsx(_components.span, {\n className: \"katex-mathml\",\n children: _jsx(_components.math, {\n xmlns: \"http://www.w3.org/1998/Math/MathML\",\n display: \"block\",\n children: _jsxs(_components.semantics, {\n children: [_jsxs(_components.mtable, {\n rowspacing: \"0.25em\",\n columnalign: \"right left\",\n columnspacing: \"0em\",\n children: [_jsxs(_components.mtr, {\n children: [_jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mover, {\n accent: \"true\",\n children: [_jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mo, {\n children: \"˙\"\n })]\n })\n })\n }), _jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mrow, {\n children: [_jsx(_components.mrow, {}), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mi, {\n children: \"σ\"\n }), _jsx(_components.mo, {\n stretchy: \"false\",\n children: \"(\"\n }), _jsx(_components.mi, {\n children: \"y\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mo, {\n stretchy: \"false\",\n children: \")\"\n })]\n })\n })\n })]\n }), _jsxs(_components.mtr, {\n children: [_jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mover, {\n accent: \"true\",\n children: [_jsx(_components.mi, {\n children: \"y\"\n }), _jsx(_components.mo, {\n children: \"˙\"\n })]\n })\n })\n }), _jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mrow, {\n children: [_jsx(_components.mrow, {}), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mi, {\n children: \"ρ\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"y\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mi, {\n children: \"z\"\n })]\n })\n })\n })]\n }), _jsxs(_components.mtr, {\n children: [_jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mover, {\n accent: \"true\",\n children: [_jsx(_components.mi, {\n children: \"z\"\n }), _jsx(_components.mo, {\n children: \"˙\"\n })]\n })\n })\n }), _jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mrow, {\n children: [_jsx(_components.mrow, {}), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"β\"\n }), _jsx(_components.mi, {\n children: \"z\"\n }), _jsx(_components.mo, {\n children: \"+\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mi, {\n children: \"y\"\n })]\n })\n })\n })]\n })]\n }), _jsx(_components.annotation, {\n encoding: \"application/x-tex\",\n children: \"\\\\begin{aligned}\\n\\\\dot{x} & = \\\\sigma(y-x) \\\\\\\\\\n\\\\dot{y} & = \\\\rho x - y - xz \\\\\\\\\\n\\\\dot{z} & = -\\\\beta z + xy\\n\\\\end{aligned}\"\n })]\n })\n })\n }), _jsx(_components.span, {\n className: \"katex-html\",\n \"aria-hidden\": \"true\",\n children: _jsxs(_components.span, {\n className: \"base\",\n children: [_jsx(_components.span, {\n className: \"strut\",\n style: {\n height: \"4.5em\",\n verticalAlign: \"-2em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsxs(_components.span, {\n className: \"mtable\",\n children: [_jsx(_components.span, {\n className: \"col-align-r\",\n children: _jsxs(_components.span, {\n className: \"vlist-t vlist-t2\",\n children: [_jsxs(_components.span, {\n className: \"vlist-r\",\n children: [_jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2.5em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-4.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsx(_components.span, {\n className: \"mord accent\",\n children: _jsx(_components.span, {\n className: \"vlist-t\",\n children: _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.6679em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"accent-body\",\n style: {\n left: \"-0.1111em\"\n },\n children: _jsx(_components.span, {\n className: \"mord\",\n children: \"˙\"\n })\n })]\n })]\n })\n })\n })\n })\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3.16em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsx(_components.span, {\n className: \"mord accent\",\n children: _jsxs(_components.span, {\n className: \"vlist-t vlist-t2\",\n children: [_jsxs(_components.span, {\n className: \"vlist-r\",\n children: [_jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.6679em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"accent-body\",\n style: {\n left: \"-0.0833em\"\n },\n children: _jsx(_components.span, {\n className: \"mord\",\n children: \"˙\"\n })\n })]\n })]\n }), _jsx(_components.span, {\n className: \"vlist-s\",\n children: \"​\"\n })]\n }), _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.1944em\"\n },\n children: _jsx(_components.span, {})\n })\n })]\n })\n })\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-1.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsx(_components.span, {\n className: \"mord accent\",\n children: _jsx(_components.span, {\n className: \"vlist-t\",\n children: _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.6679em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.04398em\"\n },\n children: \"z\"\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"accent-body\",\n style: {\n left: \"-0.0833em\"\n },\n children: _jsx(_components.span, {\n className: \"mord\",\n children: \"˙\"\n })\n })]\n })]\n })\n })\n })\n })\n })]\n })]\n }), _jsx(_components.span, {\n className: \"vlist-s\",\n children: \"​\"\n })]\n }), _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2em\"\n },\n children: _jsx(_components.span, {})\n })\n })]\n })\n }), _jsx(_components.span, {\n className: \"col-align-l\",\n children: _jsxs(_components.span, {\n className: \"vlist-t vlist-t2\",\n children: [_jsxs(_components.span, {\n className: \"vlist-r\",\n children: [_jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2.5em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-4.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"σ\"\n }), _jsx(_components.span, {\n className: \"mopen\",\n children: \"(\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mclose\",\n children: \")\"\n })]\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3.16em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"ρ\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.04398em\"\n },\n children: \"z\"\n })]\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-1.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.05278em\"\n },\n children: \"β\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.04398em\"\n },\n children: \"z\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"+\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n })]\n })]\n })]\n }), _jsx(_components.span, {\n className: \"vlist-s\",\n children: \"​\"\n })]\n }), _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2em\"\n },\n children: _jsx(_components.span, {})\n })\n })]\n })\n })]\n })\n })]\n })\n })]\n })\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"行内公式 \", _jsx(_components.span, {\n className: \"math math-inline\",\n children: _jsxs(_components.span, {\n className: \"katex\",\n children: [_jsx(_components.span, {\n className: \"katex-mathml\",\n children: _jsx(_components.math, {\n xmlns: \"http://www.w3.org/1998/Math/MathML\",\n children: _jsxs(_components.semantics, {\n children: [_jsxs(_components.mrow, {\n children: [_jsx(_components.mi, {\n children: \"E\"\n }), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mi, {\n children: \"m\"\n }), _jsxs(_components.msup, {\n children: [_jsx(_components.mi, {\n children: \"c\"\n }), _jsx(_components.mn, {\n children: \"2\"\n })]\n })]\n }), _jsx(_components.annotation, {\n encoding: \"application/x-tex\",\n children: \"E=mc^2\"\n })]\n })\n })\n }), _jsxs(_components.span, {\n className: \"katex-html\",\n \"aria-hidden\": \"true\",\n children: [_jsxs(_components.span, {\n className: \"base\",\n children: [_jsx(_components.span, {\n className: \"strut\",\n style: {\n height: \"0.6833em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.05764em\"\n },\n children: \"E\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n })]\n }), _jsxs(_components.span, {\n className: \"base\",\n children: [_jsx(_components.span, {\n className: \"strut\",\n style: {\n height: \"0.8141em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"m\"\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"c\"\n }), _jsx(_components.span, {\n className: \"msupsub\",\n children: _jsx(_components.span, {\n className: \"vlist-t\",\n children: _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.8141em\"\n },\n children: _jsxs(_components.span, {\n style: {\n top: \"-3.063em\",\n marginRight: \"0.05em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"2.7em\"\n }\n }), _jsx(_components.span, {\n className: \"sizing reset-size6 size3 mtight\",\n children: _jsx(_components.span, {\n className: \"mord mtight\",\n children: \"2\"\n })\n })]\n })\n })\n })\n })\n })]\n })]\n })]\n })]\n })\n })]\n }), \"\\n\", _jsx(_components.h2, {\n id: \"mermaid\",\n children: _jsx(_components.a, {\n href: \"#mermaid\",\n children: \"Mermaid\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"mermaid 流程图\"\n }), \"\\n\", _jsx(MermaidCodeBlock, {\n name: true,\n children: \"graph LR\\n A[方形] --> B(圆角)\\n B --> C{条件}\\n C -->|a=1| D[结果1]\\n C -->|a=2| E[结果2]\\n C -->|a=3| F[结果3]\",\n className: true\n }), \"\\n\", _jsx(_components.p, {\n children: \"mermaid 时序图\"\n }), \"\\n\", _jsx(MermaidCodeBlock, {\n name: true,\n children: \"sequenceDiagram\\n participant Alice\\n participant Bob\\n Alice->>John: Hello John, how are you?\\n loop Healthcheck\\n John->>John: Fight against hypochondria\\n end\\n Note right of John: Rational thoughts <br/>prevail...\\n John-->>Alice: Great!\\n John->>Bob: How about you?\\n Bob-->>John: Jolly good!\",\n className: true\n }), \"\\n\", _jsx(_components.h2, {\n id: \"heading-引用\",\n children: _jsx(_components.a, {\n href: \"#heading-引用\",\n children: \"Heading 引用\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"点击能够跳转：\"\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"#%E4%B8%80%E7%BA%A7%E6%A0%87%E9%A2%98\",\n children: \"文章内标题引用\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"/ideas/blog-syntax#%E4%B8%80%E7%BA%A7%E6%A0%87%E9%A2%98\",\n children: \"跨文章标题引用\"\n })\n }), \"\\n\", _jsx(_components.h1, {\n id: \"obsidian-短引用\",\n children: _jsx(_components.a, {\n href: \"#obsidian-短引用\",\n children: \"Obsidian 短引用\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"图片-1\",\n children: _jsx(_components.a, {\n href: \"#图片-1\",\n children: \"图片\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，纯文件名\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"test-img-show-image.png\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，带注释\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"这是一张图片\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，带路径\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"blog-syntax/test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"blog-syntax/test-img-show-image.png\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，带路径和注释\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"blog-syntax/test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"这是一张图片\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，全路径\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"/content/ideas/blog-syntax/test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"/content/ideas/blog-syntax/test-img-show-image.png\"\n }), \"\\n\", _jsx(_components.h2, {\n id: \"excalidraw\",\n children: _jsx(_components.a, {\n href: \"#excalidraw\",\n children: \"Excalidraw\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用 Excalidraw\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"Drawing 2024-04-13 17.33.27.excalidraw\",\n url: \"/blog-next/content/ideas/blog-syntax/Drawing 2024-04-13 17.33.27.excalidraw\",\n label: \"Drawing 2024-04-13 17.33.27.excalidraw\"\n }), \"\\n\", _jsxs(_components.section, {\n \"data-footnotes\": true,\n className: \"footnotes\",\n children: [_jsx(_components.h2, {\n className: \"sr-only\",\n id: \"footnote-label\",\n children: _jsx(_components.a, {\n href: \"#footnote-label\",\n children: \"Footnotes\"\n })\n }), \"\\n\", _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n id: \"user-content-fn-1\",\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"注释 \", _jsx(_components.a, {\n href: \"#user-content-fnref-1\",\n \"data-footnote-backref\": true,\n className: \"data-footnote-backref\",\n \"aria-label\": \"Back to content\",\n children: \"↩\"\n })]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n })]\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {\n children: _jsx(_createMdxContent, props)\n })) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\nfunction _missingMdxReference(id, component) {\n throw new Error(\"Expected \" + (component ? \"component\" : \"object\") + \" `\" + id + \"` to be defined: you likely forgot to import, pass, or provide it.\");\n}\n","frontmatter":{},"scope":{}},"meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts <br/>prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":191,"created_at":"2024-04-14T18:58:06.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false},"prevNextInfo":{"prevInfo":null,"nextInfo":{"slug":"using-chart-js","title":"About Chart.js","path":"/ideas/using-chart-js"}}},"__N_SSG":true} \ No newline at end of file +{"pageProps":{"slug":"blog-syntax","tags":[{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]}],"source":{"compiledSource":"/*@jsxRuntime automatic @jsxImportSource react*/\nconst {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = Object.assign({\n h1: \"h1\",\n a: \"a\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n h6: \"h6\",\n p: \"p\",\n strong: \"strong\",\n em: \"em\",\n del: \"del\",\n blockquote: \"blockquote\",\n code: \"code\",\n div: \"div\",\n pre: \"pre\",\n span: \"span\",\n ul: \"ul\",\n li: \"li\",\n ol: \"ol\",\n img: \"img\",\n table: \"table\",\n thead: \"thead\",\n tr: \"tr\",\n th: \"th\",\n tbody: \"tbody\",\n td: \"td\",\n sup: \"sup\",\n math: \"math\",\n semantics: \"semantics\",\n mtable: \"mtable\",\n mtr: \"mtr\",\n mtd: \"mtd\",\n mstyle: \"mstyle\",\n mover: \"mover\",\n mi: \"mi\",\n mo: \"mo\",\n mrow: \"mrow\",\n annotation: \"annotation\",\n msup: \"msup\",\n mn: \"mn\",\n section: \"section\"\n }, _provideComponents(), props.components), {MermaidCodeBlock, ObsidianRich} = _components;\n if (!MermaidCodeBlock) _missingMdxReference(\"MermaidCodeBlock\", true);\n if (!ObsidianRich) _missingMdxReference(\"ObsidianRich\", true);\n return _jsxs(_Fragment, {\n children: [_jsx(_components.h1, {\n id: \"一级标题\",\n children: _jsx(_components.a, {\n href: \"#一级标题\",\n children: \"一级标题\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"二级标题\",\n children: _jsx(_components.a, {\n href: \"#二级标题\",\n children: \"二级标题\"\n })\n }), \"\\n\", _jsx(_components.h3, {\n id: \"三级标题\",\n children: _jsx(_components.a, {\n href: \"#三级标题\",\n children: \"三级标题\"\n })\n }), \"\\n\", _jsx(_components.h4, {\n id: \"四级标题\",\n children: _jsx(_components.a, {\n href: \"#四级标题\",\n children: \"四级标题\"\n })\n }), \"\\n\", _jsx(_components.h5, {\n id: \"五级标题\",\n children: _jsx(_components.a, {\n href: \"#五级标题\",\n children: \"五级标题\"\n })\n }), \"\\n\", _jsx(_components.h6, {\n id: \"六级标题\",\n children: _jsx(_components.a, {\n href: \"#六级标题\",\n children: \"六级标题\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.strong, {\n children: \"加粗\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.em, {\n children: \"斜体\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.em, {\n children: _jsx(_components.strong, {\n children: \"加粗斜体\"\n })\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.del, {\n children: \"删除线\"\n })\n }), \"\\n\", _jsxs(_components.blockquote, {\n children: [\"\\n\", _jsx(_components.p, {\n children: \"引用\"\n }), \"\\n\"]\n }), \"\\n\", _jsx(_components.h1, {\n id: \"其他-md-语法\",\n children: _jsx(_components.a, {\n href: \"#其他-md-语法\",\n children: \"其他 MD 语法\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"代码块\",\n children: _jsx(_components.a, {\n href: \"#代码块\",\n children: \"代码块\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.code, {\n children: \"行内代码\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"代码块高亮：\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n style: {\n backgroundColor: \"#232136\"\n },\n tabIndex: \"0\",\n \"data-language\": \"python\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"python\",\n \"data-theme\": \"default\",\n children: [_jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#908CAA\",\n fontStyle: \"italic\"\n },\n children: \"#\"\n }), _jsx(_components.span, {\n style: {\n color: \"#6E6A86\",\n fontStyle: \"italic\"\n },\n children: \" 代码块\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"def\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EA9A97\"\n },\n children: \"func_echo\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"):\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EB6F92\",\n fontStyle: \"italic\"\n },\n children: \"print\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"class\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"HelloPrinter\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" printer\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" Callable\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"[[\"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"]]\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"def\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EB6F92\",\n fontStyle: \"italic\"\n },\n children: \"__init__\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \",\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"printer\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" Callable\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"[[\"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"]]):\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \".\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"printer \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" printer\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n })\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"def\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#EA9A97\"\n },\n children: \"call\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \",\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#C4A7E7\",\n fontStyle: \"italic\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \":\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#9CCFD8\"\n },\n children: \"str\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"):\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" \"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\",\n fontStyle: \"italic\"\n },\n children: \"self\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \".\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"printer\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"s\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: \" \"\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"p \"\n }), _jsx(_components.span, {\n style: {\n color: \"#3E8FB0\"\n },\n children: \"=\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" HelloPrinter\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"func_echo\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n }), \"\\n\", _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"p\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \".\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"call\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"(\"\n }), _jsx(_components.span, {\n style: {\n color: \"#F6C177\"\n },\n children: \"\\\"hello world!\\\"\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \")\"\n })]\n })]\n })\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"大围栏\"\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n style: {\n backgroundColor: \"#232136\"\n },\n tabIndex: \"0\",\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.code, {\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: [_jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"```\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"def func_echo(s: str):\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \" print(s)\"\n })\n }), \"\\n\", _jsx(_components.span, {\n className: \"line\",\n children: _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"```\"\n })\n })]\n })\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"行内反引号围栏： \", _jsx(_components.code, {\n children: \"`\"\n }), \" 或者 \", _jsx(_components.code, {\n children: \"``\"\n }), \" 的模式\"]\n }), \"\\n\", _jsx(_components.div, {\n \"data-rehype-pretty-code-fragment\": \"\",\n children: _jsx(_components.pre, {\n style: {\n backgroundColor: \"#232136\"\n },\n tabIndex: \"0\",\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: _jsx(_components.code, {\n \"data-language\": \"markdown\",\n \"data-theme\": \"default\",\n children: _jsxs(_components.span, {\n className: \"line\",\n children: [_jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"`\"\n }), _jsx(_components.span, {\n style: {\n color: \"#E0DEF4\"\n },\n children: \"段落反引号内的行内反引号\"\n }), _jsx(_components.span, {\n style: {\n color: \"#908CAA\"\n },\n children: \"`\"\n })]\n })\n })\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"列表\",\n children: _jsx(_components.a, {\n href: \"#列表\",\n children: \"列表\"\n })\n }), \"\\n\", _jsxs(_components.ul, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"无序列表\", \"\\n\", _jsxs(_components.ul, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"无序列表\", \"\\n\", _jsxs(_components.ul, {\n children: [\"\\n\", _jsx(_components.li, {\n children: \"无序列表\"\n }), \"\\n\", _jsx(_components.li, {\n children: \"无序列表\"\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\", _jsxs(_components.ol, {\n children: [\"\\n\", _jsx(_components.li, {\n children: \"有序列表\"\n }), \"\\n\", _jsx(_components.li, {\n children: \"有序列表\"\n }), \"\\n\", _jsx(_components.li, {\n children: \"有序列表\"\n }), \"\\n\"]\n }), \"\\n\", _jsx(_components.h2, {\n id: \"链接\",\n children: _jsx(_components.a, {\n href: \"#链接\",\n children: \"链接\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"https://blog.ryo-okami.xyz\",\n children: \"链接\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"/ideas/blog-syntax\",\n children: \"站内链接\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"图片\",\n children: _jsx(_components.a, {\n href: \"#图片\",\n children: \"图片\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"图片：\"\n }), \"\\n\", _jsx(_components.img, {\n src: \"https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif\",\n alt: \"图片\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"站内图片：\"\n }), \"\\n\", _jsx(_components.img, {\n src: \"/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif\",\n alt: \"站内图片\"\n }), \"\\n\", _jsx(_components.h2, {\n id: \"表格\",\n children: _jsx(_components.a, {\n href: \"#表格\",\n children: \"表格\"\n })\n }), \"\\n\", _jsxs(_components.table, {\n children: [_jsx(_components.thead, {\n children: _jsxs(_components.tr, {\n children: [_jsx(_components.th, {\n children: \"表头\"\n }), _jsx(_components.th, {\n children: \"表头\"\n }), _jsx(_components.th, {\n children: \"表头\"\n })]\n })\n }), _jsxs(_components.tbody, {\n children: [_jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n })]\n }), _jsxs(_components.tr, {\n children: [_jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n }), _jsx(_components.td, {\n children: \"单元\"\n })]\n })]\n })]\n }), \"\\n\", _jsx(_components.h2, {\n id: \"脚注\",\n children: _jsx(_components.a, {\n href: \"#脚注\",\n children: \"脚注\"\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"下标\", _jsx(_components.sup, {\n children: _jsx(_components.a, {\n href: \"#user-content-fn-1\",\n id: \"user-content-fnref-1\",\n \"data-footnote-ref\": true,\n \"aria-describedby\": \"footnote-label\",\n children: \"1\"\n })\n })]\n }), \"\\n\", _jsx(_components.h1, {\n id: \"插件\",\n children: _jsx(_components.a, {\n href: \"#插件\",\n children: \"插件\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"katex\",\n children: _jsx(_components.a, {\n href: \"#katex\",\n children: \"Katex\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"行间公式\"\n }), \"\\n\", _jsx(_components.div, {\n className: \"math math-display\",\n children: _jsx(_components.span, {\n className: \"katex-display\",\n children: _jsxs(_components.span, {\n className: \"katex\",\n children: [_jsx(_components.span, {\n className: \"katex-mathml\",\n children: _jsx(_components.math, {\n xmlns: \"http://www.w3.org/1998/Math/MathML\",\n display: \"block\",\n children: _jsxs(_components.semantics, {\n children: [_jsxs(_components.mtable, {\n rowspacing: \"0.25em\",\n columnalign: \"right left\",\n columnspacing: \"0em\",\n children: [_jsxs(_components.mtr, {\n children: [_jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mover, {\n accent: \"true\",\n children: [_jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mo, {\n children: \"˙\"\n })]\n })\n })\n }), _jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mrow, {\n children: [_jsx(_components.mrow, {}), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mi, {\n children: \"σ\"\n }), _jsx(_components.mo, {\n stretchy: \"false\",\n children: \"(\"\n }), _jsx(_components.mi, {\n children: \"y\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mo, {\n stretchy: \"false\",\n children: \")\"\n })]\n })\n })\n })]\n }), _jsxs(_components.mtr, {\n children: [_jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mover, {\n accent: \"true\",\n children: [_jsx(_components.mi, {\n children: \"y\"\n }), _jsx(_components.mo, {\n children: \"˙\"\n })]\n })\n })\n }), _jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mrow, {\n children: [_jsx(_components.mrow, {}), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mi, {\n children: \"ρ\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"y\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mi, {\n children: \"z\"\n })]\n })\n })\n })]\n }), _jsxs(_components.mtr, {\n children: [_jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mover, {\n accent: \"true\",\n children: [_jsx(_components.mi, {\n children: \"z\"\n }), _jsx(_components.mo, {\n children: \"˙\"\n })]\n })\n })\n }), _jsx(_components.mtd, {\n children: _jsx(_components.mstyle, {\n scriptlevel: \"0\",\n displaystyle: \"true\",\n children: _jsxs(_components.mrow, {\n children: [_jsx(_components.mrow, {}), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mo, {\n children: \"−\"\n }), _jsx(_components.mi, {\n children: \"β\"\n }), _jsx(_components.mi, {\n children: \"z\"\n }), _jsx(_components.mo, {\n children: \"+\"\n }), _jsx(_components.mi, {\n children: \"x\"\n }), _jsx(_components.mi, {\n children: \"y\"\n })]\n })\n })\n })]\n })]\n }), _jsx(_components.annotation, {\n encoding: \"application/x-tex\",\n children: \"\\\\begin{aligned}\\n\\\\dot{x} & = \\\\sigma(y-x) \\\\\\\\\\n\\\\dot{y} & = \\\\rho x - y - xz \\\\\\\\\\n\\\\dot{z} & = -\\\\beta z + xy\\n\\\\end{aligned}\"\n })]\n })\n })\n }), _jsx(_components.span, {\n className: \"katex-html\",\n \"aria-hidden\": \"true\",\n children: _jsxs(_components.span, {\n className: \"base\",\n children: [_jsx(_components.span, {\n className: \"strut\",\n style: {\n height: \"4.5em\",\n verticalAlign: \"-2em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsxs(_components.span, {\n className: \"mtable\",\n children: [_jsx(_components.span, {\n className: \"col-align-r\",\n children: _jsxs(_components.span, {\n className: \"vlist-t vlist-t2\",\n children: [_jsxs(_components.span, {\n className: \"vlist-r\",\n children: [_jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2.5em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-4.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsx(_components.span, {\n className: \"mord accent\",\n children: _jsx(_components.span, {\n className: \"vlist-t\",\n children: _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.6679em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"accent-body\",\n style: {\n left: \"-0.1111em\"\n },\n children: _jsx(_components.span, {\n className: \"mord\",\n children: \"˙\"\n })\n })]\n })]\n })\n })\n })\n })\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3.16em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsx(_components.span, {\n className: \"mord accent\",\n children: _jsxs(_components.span, {\n className: \"vlist-t vlist-t2\",\n children: [_jsxs(_components.span, {\n className: \"vlist-r\",\n children: [_jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.6679em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"accent-body\",\n style: {\n left: \"-0.0833em\"\n },\n children: _jsx(_components.span, {\n className: \"mord\",\n children: \"˙\"\n })\n })]\n })]\n }), _jsx(_components.span, {\n className: \"vlist-s\",\n children: \"​\"\n })]\n }), _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.1944em\"\n },\n children: _jsx(_components.span, {})\n })\n })]\n })\n })\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-1.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: _jsx(_components.span, {\n className: \"mord accent\",\n children: _jsx(_components.span, {\n className: \"vlist-t\",\n children: _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.6679em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.04398em\"\n },\n children: \"z\"\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsx(_components.span, {\n className: \"accent-body\",\n style: {\n left: \"-0.0833em\"\n },\n children: _jsx(_components.span, {\n className: \"mord\",\n children: \"˙\"\n })\n })]\n })]\n })\n })\n })\n })\n })]\n })]\n }), _jsx(_components.span, {\n className: \"vlist-s\",\n children: \"​\"\n })]\n }), _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2em\"\n },\n children: _jsx(_components.span, {})\n })\n })]\n })\n }), _jsx(_components.span, {\n className: \"col-align-l\",\n children: _jsxs(_components.span, {\n className: \"vlist-t vlist-t2\",\n children: [_jsxs(_components.span, {\n className: \"vlist-r\",\n children: [_jsxs(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2.5em\"\n },\n children: [_jsxs(_components.span, {\n style: {\n top: \"-4.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"σ\"\n }), _jsx(_components.span, {\n className: \"mopen\",\n children: \"(\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mclose\",\n children: \")\"\n })]\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-3.16em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"ρ\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.04398em\"\n },\n children: \"z\"\n })]\n })]\n }), _jsxs(_components.span, {\n style: {\n top: \"-1.66em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"3em\"\n }\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mord\",\n children: \"−\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.05278em\"\n },\n children: \"β\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.04398em\"\n },\n children: \"z\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mbin\",\n children: \"+\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2222em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"x\"\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.03588em\"\n },\n children: \"y\"\n })]\n })]\n })]\n }), _jsx(_components.span, {\n className: \"vlist-s\",\n children: \"​\"\n })]\n }), _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"2em\"\n },\n children: _jsx(_components.span, {})\n })\n })]\n })\n })]\n })\n })]\n })\n })]\n })\n })\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"行内公式 \", _jsx(_components.span, {\n className: \"math math-inline\",\n children: _jsxs(_components.span, {\n className: \"katex\",\n children: [_jsx(_components.span, {\n className: \"katex-mathml\",\n children: _jsx(_components.math, {\n xmlns: \"http://www.w3.org/1998/Math/MathML\",\n children: _jsxs(_components.semantics, {\n children: [_jsxs(_components.mrow, {\n children: [_jsx(_components.mi, {\n children: \"E\"\n }), _jsx(_components.mo, {\n children: \"=\"\n }), _jsx(_components.mi, {\n children: \"m\"\n }), _jsxs(_components.msup, {\n children: [_jsx(_components.mi, {\n children: \"c\"\n }), _jsx(_components.mn, {\n children: \"2\"\n })]\n })]\n }), _jsx(_components.annotation, {\n encoding: \"application/x-tex\",\n children: \"E=mc^2\"\n })]\n })\n })\n }), _jsxs(_components.span, {\n className: \"katex-html\",\n \"aria-hidden\": \"true\",\n children: [_jsxs(_components.span, {\n className: \"base\",\n children: [_jsx(_components.span, {\n className: \"strut\",\n style: {\n height: \"0.6833em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n style: {\n marginRight: \"0.05764em\"\n },\n children: \"E\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n }), _jsx(_components.span, {\n className: \"mrel\",\n children: \"=\"\n }), _jsx(_components.span, {\n className: \"mspace\",\n style: {\n marginRight: \"0.2778em\"\n }\n })]\n }), _jsxs(_components.span, {\n className: \"base\",\n children: [_jsx(_components.span, {\n className: \"strut\",\n style: {\n height: \"0.8141em\"\n }\n }), _jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"m\"\n }), _jsxs(_components.span, {\n className: \"mord\",\n children: [_jsx(_components.span, {\n className: \"mord mathnormal\",\n children: \"c\"\n }), _jsx(_components.span, {\n className: \"msupsub\",\n children: _jsx(_components.span, {\n className: \"vlist-t\",\n children: _jsx(_components.span, {\n className: \"vlist-r\",\n children: _jsx(_components.span, {\n className: \"vlist\",\n style: {\n height: \"0.8141em\"\n },\n children: _jsxs(_components.span, {\n style: {\n top: \"-3.063em\",\n marginRight: \"0.05em\"\n },\n children: [_jsx(_components.span, {\n className: \"pstrut\",\n style: {\n height: \"2.7em\"\n }\n }), _jsx(_components.span, {\n className: \"sizing reset-size6 size3 mtight\",\n children: _jsx(_components.span, {\n className: \"mord mtight\",\n children: \"2\"\n })\n })]\n })\n })\n })\n })\n })]\n })]\n })]\n })]\n })\n })]\n }), \"\\n\", _jsx(_components.h2, {\n id: \"mermaid\",\n children: _jsx(_components.a, {\n href: \"#mermaid\",\n children: \"Mermaid\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"mermaid 流程图\"\n }), \"\\n\", _jsx(MermaidCodeBlock, {\n name: true,\n children: \"graph LR\\n A[方形] --> B(圆角)\\n B --> C{条件}\\n C -->|a=1| D[结果1]\\n C -->|a=2| E[结果2]\\n C -->|a=3| F[结果3]\",\n className: true\n }), \"\\n\", _jsx(_components.p, {\n children: \"另一个 mermaid 流程图，同样类型不会冲突\"\n }), \"\\n\", _jsx(MermaidCodeBlock, {\n name: true,\n children: \"graph TD\\n A((圆)) --> B([圆边])\\n B --> C[(DB)]\",\n className: true\n }), \"\\n\", _jsx(_components.p, {\n children: \"mermaid 时序图\"\n }), \"\\n\", _jsx(MermaidCodeBlock, {\n name: true,\n children: \"sequenceDiagram\\n participant Alice\\n participant Bob\\n Alice->>John: Hello John, how are you?\\n loop Healthcheck\\n John->>John: Fight against hypochondria\\n end\\n Note right of John: Rational thoughts <br/>prevail...\\n John-->>Alice: Great!\\n John->>Bob: How about you?\\n Bob-->>John: Jolly good!\",\n className: true\n }), \"\\n\", _jsx(_components.h2, {\n id: \"heading-引用\",\n children: _jsx(_components.a, {\n href: \"#heading-引用\",\n children: \"Heading 引用\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"点击能够跳转：\"\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"#%E4%B8%80%E7%BA%A7%E6%A0%87%E9%A2%98\",\n children: \"文章内标题引用\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: _jsx(_components.a, {\n href: \"/ideas/blog-syntax#%E4%B8%80%E7%BA%A7%E6%A0%87%E9%A2%98\",\n children: \"跨文章标题引用\"\n })\n }), \"\\n\", _jsx(_components.h1, {\n id: \"obsidian-短引用\",\n children: _jsx(_components.a, {\n href: \"#obsidian-短引用\",\n children: \"Obsidian 短引用\"\n })\n }), \"\\n\", _jsx(_components.h2, {\n id: \"图片-1\",\n children: _jsx(_components.a, {\n href: \"#图片-1\",\n children: \"图片\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，纯文件名\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"test-img-show-image.png\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，带注释\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"这是一张图片\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，带路径\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"blog-syntax/test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"blog-syntax/test-img-show-image.png\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，带路径和注释\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"blog-syntax/test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"这是一张图片\"\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用图片，全路径\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"/content/ideas/blog-syntax/test-img-show-image.png\",\n url: \"/blog-next/content/ideas/blog-syntax/test-img-show-image.png\",\n label: \"/content/ideas/blog-syntax/test-img-show-image.png\"\n }), \"\\n\", _jsx(_components.h2, {\n id: \"excalidraw\",\n children: _jsx(_components.a, {\n href: \"#excalidraw\",\n children: \"Excalidraw\"\n })\n }), \"\\n\", _jsx(_components.p, {\n children: \"短引用 Excalidraw\"\n }), \"\\n\", _jsx(ObsidianRich, {\n file: \"Drawing 2024-04-13 17.33.27.excalidraw\",\n url: \"/blog-next/content/ideas/blog-syntax/Drawing 2024-04-13 17.33.27.excalidraw\",\n label: \"Drawing 2024-04-13 17.33.27.excalidraw\"\n }), \"\\n\", _jsxs(_components.section, {\n \"data-footnotes\": true,\n className: \"footnotes\",\n children: [_jsx(_components.h2, {\n className: \"sr-only\",\n id: \"footnote-label\",\n children: _jsx(_components.a, {\n href: \"#footnote-label\",\n children: \"Footnotes\"\n })\n }), \"\\n\", _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n id: \"user-content-fn-1\",\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"注释 \", _jsx(_components.a, {\n href: \"#user-content-fnref-1\",\n \"data-footnote-backref\": true,\n className: \"data-footnote-backref\",\n \"aria-label\": \"Back to content\",\n children: \"↩\"\n })]\n }), \"\\n\"]\n }), \"\\n\"]\n }), \"\\n\"]\n })]\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {\n children: _jsx(_createMdxContent, props)\n })) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\nfunction _missingMdxReference(id, component) {\n throw new Error(\"Expected \" + (component ? \"component\" : \"object\") + \" `\" + id + \"` to be defined: you likely forgot to import, pass, or provide it.\");\n}\n","frontmatter":{},"scope":{}},"meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\n另一个 mermaid 流程图，同样类型不会冲突\n\n```mermaid\ngraph TD\n A((圆)) --> B([圆边])\n B --> C[(DB)]\n```\n\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts <br/>prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":200,"created_at":"2024-04-15T16:44:34.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false},"prevNextInfo":{"prevInfo":null,"nextInfo":{"slug":"using-chart-js","title":"About Chart.js","path":"/ideas/using-chart-js"}}},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/first-idea.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas/first-idea.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/first-idea.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/ideas/first-idea.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/newest.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas/newest.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/newest.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/ideas/newest.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/using-chart-js.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/ideas/using-chart-js.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/ideas/using-chart-js.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/ideas/using-chart-js.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/index.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/index.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/index.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/index.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/aws.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/aws.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/aws.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/aws.json diff --git a/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/blog.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/blog.json new file mode 100644 index 00000000..289066a8 --- /dev/null +++ b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/blog.json @@ -0,0 +1 @@ +{"pageProps":{"allTagInfos":[{"tag":"Kubernetes","slug":"kubernetes","path":"/tags/kubernetes","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"DevOps","slug":"devops","path":"/tags/devops","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Docker","slug":"docker","path":"/tags/docker","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Cloud Native","slug":"cloud-native","path":"/tags/cloud-native","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"VSCode","slug":"vscode","path":"/tags/vscode","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"Hexo","slug":"hexo","path":"/tags/hexo","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"JavaScript","slug":"javascript","path":"/tags/javascript","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"GitHub","slug":"github","path":"/tags/github","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"AWS","slug":"aws","path":"/tags/aws","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"CI/CD","slug":"ci-cd","path":"/tags/ci-cd","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"IaC","slug":"iac","path":"/tags/iac","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"数据结构","slug":"数据结构","path":"/tags/数据结构","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"},{"postSlug":"python-dict","postType":"article"}]},{"tag":"算法","slug":"算法","path":"/tags/算法","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"算法竞赛","slug":"算法竞赛","path":"/tags/算法竞赛","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"}]},{"tag":"设计模式","slug":"设计模式","path":"/tags/设计模式","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"笔记","slug":"笔记","path":"/tags/笔记","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"排序","slug":"排序","path":"/tags/排序","postSlugs":[{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"Python","slug":"python","path":"/tags/python","postSlugs":[{"postSlug":"python-dict","postType":"article"}]},{"tag":"C++","slug":"c++","path":"/tags/c++","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"}]},{"tag":"杂技","slug":"杂技","path":"/tags/杂技","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"hello-world","postType":"article"}]},{"tag":"杂谈","slug":"杂谈","path":"/tags/杂谈","postSlugs":[{"postSlug":"hello-world","postType":"article"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Cloud Computing","slug":"cloud-computing","path":"/tags/cloud-computing","postSlugs":[{"postSlug":"newest","postType":"idea"}]}],"selectedTagInfo":{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},"posts":[{"slug":"blog-syntax","file":"public/content/ideas/blog-syntax.md","mediaDir":"content/ideas/blog-syntax","path":"/ideas/blog-syntax","meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\n另一个 mermaid 流程图，同样类型不会冲突\n\n```mermaid\ngraph TD\n A((圆)) --> B([圆边])\n B --> C[(DB)]\n```\n\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts <br/>prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":200,"created_at":"2024-04-15T16:44:34.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"blog-in-next","file":"public/content/ideas/blog-in-next.md","mediaDir":"content/ideas/blog-in-next","path":"/ideas/blog-in-next","meta":{"content":"\n# blog todo\n\n## 一期\n\n- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex\n - [x] rehype-slug\n - [x] https://github.com/unifiedjs/unified\n - [x] recma -> 修改 MDX , remark -> 修改 markdown ， rehype -> 修改 html\n - [x] https://www.haxibami.net/blog/posts/blog-renewal\n - [x] about img to next/Image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [x] introduction of remark https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html\n- [x] 下标语法行为 -> 修改默认不用 a 标签\n 使用 remark gfm 后自动解决\n- [x] 处理 picture 路径的问题\n- [x] 默认元素映射，处理代码高亮\n - [x] mermaid 渲染\n - [x] latex 渲染 弃用，思考 remark-rehype 优先\n - [x] latex 中文渲染\n - [x] vscode-memo 语法\n - [x] 站内多媒体相对链接\n - [x] latex 显示两次\n - [x] katex 需要特殊的 css ，加载后修复\n - [x] 没有闭合的左箭头自动转义\n 做不到， next-mdx-remote 调用 mdx-js ， createProcessor 中会在执行所有 remark 插件之前，先执行 remark-mdx ，无法通过插件修改 \n - https://github.com/mdx-js/mdx/tree/main/packages/remark-mdx\n - https://github.com/mdx-js/mdx/blob/main/packages/mdx/lib/core.js\n- [x] 简单的样式\n - [x] Article 页面\n - [x] 主页\n - [x] 主页封面： position: static 不会反应 z-index ，需要 position: 其他值\n - [x] about 页\n - 先不做\n - [x] 其他页的最小高度，处理 footer 不要太高\n - [x] Tag 页\n - [x] Idea 页\n - [x] refactor move meta together\n- [x] fix post list height\n- [x] fix post list page tag box\n- [x] SEO 简单\n - [x] site map https://github.com/iamvishnusankar/next-sitemap\n - [x] Header， title\n - [x] OG\n - [x] og:site_name vs og:title?\n - [x] og:url?\n - [x] footer\n - [x] icon hover 发光， bg 不要变色\n - [x] 增加 icon ， Pixiv\n- [x] 处理旧链接跳转 https://www.viget.com/articles/host-build-and-deploy-next-js-projects-on-github-pages/\n - [x] path prefix\n - [x] 环境变量？配置文件？\n - [x] 代码高亮换成静态后 mermaid 也要用 remark 处理\n - [x] mermaid 内样式 -> 修复 global applyed 的行高\n - [x] 为什么 haxibami 的样式不会变？为什么是 tspan 和 text ？待探究 -> 是 pie 和 sequence 默认的\n - [x] maybe rehype-raw ？ -> 不是 rehype-raw 的问题，而且如果用 rehype-raw 会让 mdx 渲染不了显示 Cannot compile `mdxJsxFlowElement` node\n - [x] https://github.com/mermaid-js/mermaid/issues/2688\n - [x] turning the htmlLables to false fixed this (maybe other types of charts should be tested as well)\n - [x] 去除 path 中的日期\n 1. get all slugs once\n 2. get post meta by slug\n - [x] 修复 image url 跳转\n - [x] link jump 301 -> 308\n - 不能直接在 config 里配置，不会自动静态生成\n - 在 getStaticProps 里处理:\n - param 中拿到 slug 以 string[] 出现， slash 无关\n - build 时出现 error：`redirect` can not be returned from getStaticProps during prerendering\n - https://nextjs.org/docs/messages/gsp-redirect-during-prerender\n - 放弃治疗\n- [x] git time versioning\n - [x] created at\n - [x] updated at\n- [x] 部署脚本\n - [x] ghpage\n - [x] gh page 环境 path 前缀设置，\n - [x] env file 使用\n - [x] s3 test + prod\n - reusable wrokflow (on workflow call) https://docs.github.com/en/actions/using-workflows/reusing-workflows\n - composite action (no details, not to use) https://docs.github.com/en/actions/creating-actions/creating-a-composite-action\n - use artifact between workflow https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts\n - an https://stackoverflow.com/questions/70003863/reusing-github-action-workflow-steps-inside-another-job\n - gh-pages 先用蠢办法， build 上传一次 artifact ，deploy 时在 gh-pages action 里再上传一次\n - [x] Github Action 复用\n - [x] test infra stack 更新使用 s3 web hosting\n - [x] 处理 url 结尾带 slash 问题\n - https://github.com/keaeriksson/hugo-s3-cloudfront \\<- 最终解决方案，用 pulumi 把这个重写一遍\n - maybe it's time to serverless https://github.com/serverless-nextjs/serverless-next.js\n - or just use vercel! \n\n - [x] 更新 prod （infra ， Deploy ）\n- [x] 修复 mermaid 渲染\n - [x] 方法1 remark 时处理，变静态 svg （简单）\n - [x] 方法2 highlight 推延到渲染时处理，用组件包裹 （希望优先）\n - [x] 组建渲染时快速刷新可能导致 syntax error\n - [x] 可能的处理闪动的信息： \n - https://github.com/ant-design/ant-design/issues/16037\n - https://stackoverflow.com/questions/72248724/components-flicker-during-server-side-render-for-nextjs-and-material-ui\n - https://www.stackfive.io/work/nextjs/how-to-fix-styled-components-page-flicker-in-next-js-12\n - https://stackoverflow.com/questions/65527040/using-prism-js-line-highlight-plugin-with-next-js-app-causes-text-content-did-n\n - https://css-tricks.com/syntax-highlighting-prism-on-a-next-js-site/#aa-highlighting-lines\n - https://www.felixmokross.dev/blog/code-samples-line-highlighting\n- [x] 修复：\n - [x] Home Page 下方链接点击问题\n - [x] 改进 trailing slash -> lambda 写错，要加 .html 不是 /index.html\n - [x] 排查 s3 旧文件未删除问题 rm 后加一句 ls debug\n - [x] tag box 增加 focus\n- [x] reuse https://docs.github.com/en/actions/using-workflows/reusing-workflows\n\n\n## 二期\n\n- [x] favicon\n- [x] Google Analytics\n - [ ] sitemap 检查\n- [ ] test workflow for dependabot\n- [x] SEO better, og:type=article read more: https://ogp.me/#types\n- [x] 文章按创建时间倒序\n- [x] 写 README 与项目简介\n- [ ] Rss etc https://github.com/jpmonette/feed\n- [x] 响应式适配\n\n- tips:\n - md syntax -> mdx(react component) : use mdx provider component rewriting (code block to mermaid component)\n - md syntax -> special html -> use rehype plugin rewriting (katex, highlight)\n - special md syntax -> use remark plugin rewriting (could not to mdx, should first to html and then mdx provider rewrite)\n\n\nplus:\n- [ ] https://conv.denshochan.com/markdown\n - [ ] 段落内の改行\n - [ ] 行頭の文字下げ\n - [ ] Twitter アカウント\n - [ ] ルビ\n - [ ] ものルビ風の熟語ルビ\n- [ ] https://www.haxibami.net/blog/posts/blog-renewal\n - [ ] link card\n - [ ] image to next image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [ ] precompile mermaid\n- [ ] svg 输入\n - [ ] 绘画工具： KRITA ， 免费，有 mac os 版 https://docs.krita.org/zh_CN/user_manual.html\n - [ ] KRITA 推荐使用 Inkscape 进行编辑\n- [ ] vscode 语法站内相对链接\n - [ ] mui/base could be very good\n - [ ] search lunr？ -> mini search https://www.webpro.nl/articles/how-to-add-search-to-your-static-site\n - [ ] 可以简单参考 3b1b 直接全局 hold 住，然后全文搜索\n - [ ] blog list pagition (could be later, use infinite scroll)\n- [ ] nextjs 13 app directory https://beta.nextjs.org/docs/getting-started\n- [ ] ja 等多语言支持\n- [ ] 基于 git 的差量 build\n- [ ] 组件 visual testing https://glebbahmutov.com/blog/open-source-visual-testing-of-components/\n- [x] gh-pages gls 不可能，不支持\n- [x] gh-pages public paths\n- [ ] search console?\n- [ ] 参考以下链接优化主页\n - [ ] https://meola.booth.pm/items\n - [ ] https://makoto-kaminaga.jimdofree.com/\n\n\n","title":"用 Next.js 重构 blog ，TODO list","abstract":"- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex","length":160,"created_at":"2023-02-12T07:35:21.000Z","updated_at":"2023-02-12T07:25:33.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"use-paste-image-and-vscode-memo","file":"public/content/articles/2022-04-03-use-paste-image-and-vscode-memo.md","mediaDir":"content/articles/2022-04-03-use-paste-image-and-vscode-memo","path":"/articles/use-paste-image-and-vscode-memo","meta":{"content":"\n我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。\n\n# 关于 vscode-memo\n\n可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。\n\nvscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：\n\n1. 使用独有的短链接语法 `[[]]` 连接到其他文档与图片。\n2. 修改文件名时自动同步更新链接，反向查找当前文档被那些文档链接。\n3. 鼠标悬停时能预览链接与图片。\n\n同时，由于 vscode-memo 是个 vscode 插件，可以跟 vscode 的其他众多插件合作使用。比如 [vscode-memo 官方文档](https://github.com/svsool/vscode-memo/blob/master/help/How%20to/Pasting%20images%20from%20clipboard.md)里就推荐将 vscode-memo 与 vscode-past-image 插件配合，粘贴图片。\n\n这篇文章主要的目的，也是利用这两个插件，达到把图片粘贴为短链接，并被 Hexo 正常渲染为网页。\n\n# Image Paste 与 Hexo 的配置\n\n这一步其实很简单。\n\n在 Hexo 的文章中，一般需要使用从根目录起的相对链接。如有文件结构：\n\n```tree\nsource\n├───img\n│ └───in-post\n│ ├───heap-cheat-sheet.jpg\n│ └───post-js-version.jpg\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n在 `2022-03-26-create-blog-cicd-by-github.md` 中引用 `heap-cheat-sheet.jpg` 这个图片，就需要 `![](/img/in-post/heap-cheat-sheet.jpg)` 这样的链接。\n\n但如果在配置里把 `post_asset_folder` 设为 `true` ，就可以在 Markdown 文件的同级位置的同名目录中直接找到图片。如：\n\n```tree\nsource\n├───img\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github\n │ ├───heap-cheat-sheet.jpg\n │ └───post-js-version.jpg\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n然后在 `2022-03-26-create-blog-cicd-by-github.md` 中可以直接 `![](heap-cheat-sheet.jpg)` 引用图片。为了图片文件管理方便，我们打开这个配置项。\n\n为了能让 Image Paste 粘贴的图片能放到这个同名文件夹下，我们需要修改 Image Paste 配置，在 VSCode 的 Workspace Setting 中，添加如下设置：\n\n```json\n{\n \"pasteImage.path\": \"${currentFileDir}/${currentFileNameWithoutExt}/\"\n}\n```\n\n# Image Paste 粘贴为 vscode-memo 短链接格式\n\n这一步也很简单。 Image Paste 可以设定粘贴后的格式。我们在 Workspace Setting 中添加如下设置即可：\n\n```json\n{\n \"pasteImage.insertPattern\": \"![[${imageFileName}]]\",\n}\n```\n\n这样我们粘贴后的图片就能有预览功能了。\n\n# 让 Hexo 正确渲染 vscode-memo 的短链接\n\n这一步其实是最难的。 Hexo 当然不认识 vscode-memo 的短链接，而经过调查，现在还没有现成的方案让 Hexo 与 vscode-memo 集成。虽然我们提倡尽量不要重复造轮子，但这里我们也是除了造轮子没有其他办法了。\n\n我们采用的方案是让 Hexo 在渲染 Markdown 前，先把 Markdown 中形如 `![[]]` 的短链接，替换为 `![]()` 的正常 Markdown 图片链接。\n\n假设我们项目 `source` 文件夹如下：\n\n```tree\nsource\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github\n │ ├───heap-cheat-sheet.jpg\n │ └───post-js-version.jpg\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n如在渲染 `2022-03-26-create-blog-cicd-by-github.md` 前，需要将其中的 `![[heat-cheat-sheet.jpg]]` 替换为 `![](heap-cheat-sheet.jpg)` 。我们知道 Hexo 在生成静态文件前会先把项目根目录下 `scripts` 目录下的所有脚本执行一遍。我们可以在这里注册一个 filter ，专门做这个替换。代码如下：\n\n```js\n'use-strict';\n\nhexo.extend.filter.register('before_post_render', function (data) {\n const isToHandle = (data) => {\n var source = data.source;\n var ext = source.substring(source.lastIndexOf('.') + 1, source.length).toLowerCase();\n return ['md'].indexOf(ext) > -1;\n }\n\n if (!isToHandle(data)) {\n return data;\n }\n\n const reg = /(\\s+)\\!\\[\\[(.+)\\]\\](\\s+)/g;\n\n data.content = data.content\n .replace(reg, function (raw, start, content, end) {\n var nameAndTitle = content.split('|');\n if (nameAndTitle.length == 1) {\n return `${start}![](${content})${end}`;\n }\n return `${start}![${nameAndTitle[1]}](${nameAndTitle[0]})${end}`;\n });\n return data;\n\n})\n```\n\n# 测试一下\n\n文章中如下内容：\n\n![[这部分内容会被转换为图片.png]]\n\n\n而你看到上面的内容是一张图片，表示这个转换已经成功了。\n\n# 不足之处\n\n这一段代码仍有以下待改进的地方：\n1. 如果图片短链接的内容写在 Code Block 里，也一样会被转换。实际上我们一般不希望 Code Block 里的内容被转换，需要过滤一下。\n2. 形如 `![[文件|图片描述]]` 的内容会正常转换为 `![图片描述](文件)` 。然而我现在用的这个主题不支持图片描述。以后可能需要更换主题。\n\n# 补充\n\n如果希望网站图片放在 `img` 之类的文件夹下统一管理，不把 `post_asset_folder` 设为 `true` ，也是没问题的，可以通过修改代码，在返回 `${content}` 前添加统一前缀。\n\n而如果希望图片放在 `img` 下，又要按文章分文件夹管理，如下情况：\n\n```tree\nsource\n├───img\n│ ├───2022-03-26-create-blog-cicd-by-github\n│ │ ├───heap-cheat-sheet.jpg\n│ │ └───post-js-version.jpg\n│ └───2022-04-03-use-paste-image-and-vscode-memo\n├───playground\n└───_posts\n ├───2022-03-26-create-blog-cicd-by-github.md\n └───2022-04-03-use-paste-image-and-vscode-memo.md\n```\n\n可以通过在代码中引用 `data.source` 解决。","title":"完善 Hexo 编写环境，改善文章中使用图片的体验","abstract":"我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。\n可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。\nvscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：","length":158,"created_at":"2022-04-03T21:03:03.000Z","updated_at":"2022-04-03T17:47:52.000Z","tags":["Blog","VSCode","Hexo","JavaScript"],"license":false}},{"slug":"create-blog-cicd-by-github","file":"public/content/articles/2022-03-26-create-blog-cicd-by-github.md","mediaDir":"content/articles/2022-03-26-create-blog-cicd-by-github","path":"/articles/create-blog-cicd-by-github","meta":{"content":"\nGitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。\n但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。\n\n# 这篇文章的目标\n\n我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：\n1. 将文章 push 到 GitHub 的 master branch 后，自动触发。\n2. 我们博客使用 Hexo 引擎，需要先构建静态文件。\n3. 需要将静态文件部署到 GitHub Page 。\n4. 需要将静态文件部署到自己域名下。\n 这里我们使用 AWS 的 S3 服务与 CloudFront 服务直接部署到 CDN 上。 CloudFront 直接通过 OAI 访问 S3 ，不允许用户直接通过 S3 访问。\n5. 博客在 GitHub Page 与 S3 需要处于不同的路径下。\n 为了延续以往的情况，博客在 GitHub Page 需要部署在 `/blog/` 下。\n 而在 AWS 上我则希望直接部署在根目录下，这就导致需要两份配置文件。\n 当然弄两份配置文件我是不乐意的，于是就需要从模板自动生成配置文件...\n\n其中，一二三点都很好解决，而第四点会是一个比较难又比较坑爹的地方。\n\n# 先做简单的 —— CI/CD 构建并发布到 GitHub Pages\n\n这一步其实没什么难的， Hexo 官网上就有[这篇文章](https://hexo.io/docs/github-pages.html)写的十分详细了，可以作为参考。\n\n```yaml\nname: Pages\n\non:\n push:\n branches:\n - master # default branch\n\njobs:\n pages:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v2\n - name: Use Node.js 16.x\n uses: actions/setup-node@v2\n with:\n node-version: '16'\n - name: Cache NPM dependencies\n uses: actions/cache@v2\n with:\n path: node_modules\n key: ${{ runner.OS }}-npm-cache\n restore-keys: |\n ${{ runner.OS }}-npm-cache\n - name: Install Dependencies\n run: npm install\n - name: Build\n run: npm run build\n - name: Deploy\n uses: peaceiris/actions-gh-pages@v3\n with:\n github_token: ${{ secrets.GITHUB_TOKEN }}\n publish_dir: ./public\n publish_branch: gh-pages # deploying branch\n```\n\n这个 yaml 就是 GitHub Action 的 workflow 文件，在这个 workflow 里：\n1. 先用 `npm run build` 把静态文件生成到 `./public` 下\n2. 用 `peaceiris/actions-gh-pages@v3` 这个 action 把 `./public` 的文件放到 `gh-pages` 分支下。\n\n把上面这个 yaml 文件复制到 `.github/workflows/build.yml` 中，这样 master 分支上发生任何提交都会触发构建流程了。按照 Hexo 官网上的文档跑一边就能成功发布到 GitHub Pages 上了。\n\n不过我需要部署到 `/blog/` 下，这叫 Project Page ，因此我走的是 Hexo 文档的 Project Page 这一小节的流程，需要把 `_config.yml` 里做如下设置：\n\n```yaml\nurl: https://ryojerryyu.github.io/blog # 这个其实不是很重要，现在用的主题没有用到这个字段\nroot: /blog/ # 这个比较重要，这个不设定好，整个页面的超链接都会歪掉\n```\n\n当然， “没什么难” 的前提是你首先要对 Hexo 和 GitHub Action 有一个了解...\n\n# 难一点 —— 搭建 AWS 基础设施\n\n我为什么不止用 GitHub Pages 还要配一套 AWS 呢？其实主要还是想以后可能会做一下 Backend ，而且放 AWS 上还能利用 AWS 的服务做一下流量分析之类的。没这么些需求的小伙伴可以不用继续看了...\n\n我们打算使用 AWS 的 S3 与 CloudFront 服务， CloudFront 直接通过 OAI 访问 S3 。\n\n## S3\n\nS3 是 AWS 的对象储存服务，简单来说就是可以当网盘用，往里面放文件。\nS3 有静态网站托管服务，把静态文件放到 S3 里，配置一番就直接可以通过 HTTP 访问了，还能用自己的域名。\n但我们不打算使用 S3 的静态网站托管，因为我打算直接上 CDN ，又不想用户可以直接通过 S3 来访问我们的静态文件。\n\n## CloudFront\n\nCloudFront 是 AWS 的内容分发服务，简单来说就是 CDN 。其实它不只有 CDN 的功能，它还能加速动态调用，还能通过 CloudFront 连接 Web Socket ... 不过我们这次主要是用 CDN 功能。\nCloudFront 访问 S3 的方式还是有好几种的。中文教程最常见的是让你先打开 S3 静态网站托管，然后将 CloudFront 的源设为 S3 的域名。\n这个方法是最早支持的，因此推广的也比较开。但其实我觉得这个方法有些问题：\n\n1. S3 不做另外配置的话是可以直接访问的，比较 low\n2. S3 自己的 HTTP Endpoint 不能上 TLS ，所以 CloudFront 到 S3 这一段是裸奔的\n\n因此我打算使用 AWS 最近推荐的 OAI 方式访问 S3 。这种方式不走 HTTP Endpoint 而是 S3 自己的 S3 Endpoint ，可以通过 AWS 的 IAM 机制统一管理。\nOAI 是 Origin Access Identity ，简单来说就是给 CloudFront 一个 AWS IAM Policy 的 Principal 身份， S3 可以通过如下 Bucket Policy 限制外部只能通过这个 Principal 访问：\n```json\n{\n \"Version\": \"2012-10-17\",\n \"Statement\": [\n {\n \"Effect\": \"Allow\",\n \"Principal\": {\n \"AWS\": \"arn:aws:iam::cloudfront:user/<CloudFront Origin Access Identity ID>\"\n },\n \"Action\": \"s3:GetObject\",\n \"Resource\": \"arn:aws:s3:::<bucket name>/*\"\n }\n ]\n}\n```\n上面这一段看不懂的同学，可以去补习一下 AWS IAM 权限管理机制，关键就是 Principal —— 主体 、 Action —— 动词 、 Resource —— 受体 的一个主谓宾模式。\n\n## 其他 AWS 服务\n\n当然，仅有 S3 和 CloudFront 是不足以实现全部功能的，我们还需要 Route53 来管理路由， ACM 来获取免费证书。\n但这些我都不打算细讲，因为内容真的很多-_-，而且大部分都是 AWS 的细节，搬到别的云上不一定适用...而且手动操作麻烦死了...\n\n## Pulumi\n\n综上嘛，我们需要：\n1. 建一个 Route53 Hosted Zone ，把域名交给 Route53 管理\n2. 用 ACM 给域名申请一个 us-east-1 Region 的免费证书（CloudFront 的证书必须在 us-east-1 ）\n3. 建一个 S3 储存桶，把 Public Access Block 配置一下\n4. 建一个 CloudFront Distribution ，通过 OAI 来访问 S3 ，还要指定一下证书\n5. 给 S3 配一个 Bucket Policy ，允许 CloudFront 访问\n6. 把 Route53 里的域名弄个 DNS 记录指向 CloudFront\n\n手动操作麻烦死了，于是我打算用 IaC (Infrastructure-as-Code) 来解决。我把这些基础设施定义用 Pulumi 写成的代码放在[这里](https://github.com/RyoJerryYu/aws-blog-infra/tree/c97f0fe41b5c0306d5343ddfc22f4a3775d79b88/website)了，大家可以参考一下（做了模块化，跟我其他基础设施放一起了）。\n\n当然，用 Pulumi 没什么特别原因，纯粹是因为我最近在写 Pulumi... 你完全可以用其他 IaC 工具（Ansible、Terraform、CloudFormation）来做。而且 Pulumi 太新了，用起来挺多 Bug 的...（也许是我不会用）\n\n## 测试一下\n\nS3 桶啥的都建好之后，本地把文件 build 一下，用 `aws s3 cp ./public/ s3://<bucket>/ --recursive` 之类的命令上传到 S3 ，给 CloudFront 创建一个 Invalidation 刷新一下 CloudFront 缓存，访问域名看看，有返回个 HTML 我们的基础设施就算是跑通了。此时可能会出现以下情况，都属正常：\n1. 访问返回 307 ：\n 是 S3 储存桶 Region 不在 us-east-1 导致的。\n CloudFront 是通过 s3 的 global endpoint 访问 s3 的，但不在 us-east-1 的 s3 刚新建时还不能通过 global endpoint 访问。\n 参考 so 的[这个问题](https://stackoverflow.com/questions/38706424/aws-cloudfront-returns-http-307-when-origin-is-s3-bucket)：\n\n > All buckets have at least two REST endpoint hostnames. In eu-west-1, they are example-bucket.s3-eu-west-1.amazonaws.com and example-bucket.s3.amazonaws.com. The first one will be immedately valid when the bucket is created. The second one -- sometimes referred to as the \"global endpoint\" -- which is the one CloudFront uses -- will not, unless the bucket is in us-east-1. Over a period of seconds to minutes, variable by location and other factors, it becomes globally accesible as well. Before that, the 307 redirect is returned. Hence, the bucket was not ready.\n \n 这时候只要等个十几分钟就好了。\n2. 本地 build 的时候没配置好的话，js 之类的静态文件可能返回不了，但问题不大，我们接下来再处理。\n\n\n# 搭建 S3 的 workflow\n\n基础设施搭好了，我们就要像 deploy 到 GitHub Pages 一样，造一个自动管线发布到 S3 了。\n整理一下，我们的 workflow 里要包括：\n\n1. 从模板生成配置文件\n 别忘了，我需要的是静态文件部署在 GitHub Pages 和自己域名下的不同路径上。 Hexo 生成静态文件前配置文件必须要改的。\n2. 把原先 s3 上的文件删除，并上传新的文件到 s3\n3. 给 CloudFront 创建一个 Invalidation 刷新缓存\n\n## 生成配置文件\n\n这一步其实方案很多，甚至 bash 直接全文替换都可以...\n不过怕以后要改的东西变多，这里还是选择一些模板生成工具。有如下选择：\n\n1. 屠龙刀 Ansible\n2. Python Jinja2\n3. Go Template\n\n这里用 Ansible 确实是大材小用了，而且 Ansible 不能在 Windows 下用还是有点不方便，只能弃选。而 Python 和 Go 里我选了 Go Template ，原因是... 不想写 Python...\n这里其实确实是装逼了，这种小型脚本应该 Python 比 Go 合适的多。不过还好 Go run 可以不先 go mod 就能运行，不算是个太差的选择。不过以后还是大概率要改回 Python 。\n\n写 golang 脚本没有难度，大致如下：\n\ngolang template 的 name 要是 file name\n```golang\nname := path.Base(*tmpl)\nt := template.Must(template.New(name).ParseFiles(*tmpl))\nerr = t.Execute(os.Stdout, config)\nif err != nil {\n log.Fatal(err)\n}\n```\ngithub workflow 如下\n```yaml \n- name: Use Go 1.16\n uses: actions/setup-go@v1\n with:\n go-version: '1.16.1'\n\n- name: generate config\n run: go run ./genconfig/main.go --env=gh-pages > _config.yml\n\n```\nwindows 玩家可能要注意一下，windows 下编码有问题， `go run ./genconfig/main.go --env=gh-pages > _config.yml` 这段命令直接在 PowerShell 下跑生成出来的文件不能被 Hexo 识别。不过没什么关系，反正这段到时候是在 GitHub Action Runner 上跑的，只不过是不能本地生成用来测试而已。\n\n[参考代码](https://raw.githubusercontent.com/RyoJerryYu/blog/2f407cb6ee723d0e17c97af1289bd2231bb265ab/genconfig/main.go)\n\n## 上传 s3 与刷新 CloudFront\n\n后两步搜一下发现其实有很多现成的 GitHub Action 可以用。\n不过我没有采用，原因是——真的没必要啊...就几个命令的事，又不是不会敲...\n\nworkflows yaml 如下：\n```yaml\n- name: Configure AWS\n uses: aws-actions/configure-aws-credentials@v1\n with:\n aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}\n aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}\n aws-region: ap-northeast-1\n- name: Deploy\n env:\n S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}\n DISTRIBUTION_ID: ${{ secrets.AWS_CLOUDFRONT_DISTRIBUTION_ID }}\n run: |\n aws s3 rm s3://$S3_BUCKET/* --recursive\n aws s3 cp ./public s3://$S3_BUCKET/ --recursive\n aws cloudfront create-invalidation --distribution-id $DISTRIBUTION_ID --paths '/*' --region=us-east-1\n```\n\n[完整 yaml 参考代码](https://raw.githubusercontent.com/RyoJerryYu/blog/f0affb812f2de437943d9cf2a4f8a5fe690d1efd/.github/workflows/clouds.yml)\n\n由于改为了生成配置文件， deploy 到 Github Pages 的 yaml 也要做相应改动，这里就不多说。\n\n# CloudFront 的一点小问题（不太小）\n\n这样我们的整个流程是不是跑完了？我们的博客已经部署到自己的域名下了？\n浏览器打开自己的域名看看，完美显示！\n\n等等，别高兴的太早，点进去一篇文章... 403 了...\n\n403 的原因：\n1. hexo 生成出来的 page 连接是 `/` 结尾的，如 `/2022/03/26/create-blog-cicd-by-github/` ，然后通过 HTTP 服务器的自动转义指向 `/2022/03/26/create-blog-cicd-by-github/index.html` 文件。\n2. CloudFront 可以定义默认根对象，没有为每个子路径都自动转义的功能。\n3. S3 的 HTTP endpoint 可以配置索引文档，为每个子路径自动转义，但 CloudFront 通过 OAI 访问 S3 时通过 REST endpoint 访问，不会触发自动转义。\n\n一大波参考阅读：\n\n[Specifying a default root object](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/DefaultRootObject.html)\n> Here's an example of how a default root object works. Suppose the following request points to the object image.jpg:\n> ```\n> https://d111111abcdef8.cloudfront.net/image.jpg\n> ```\n> In contrast, the following request points to the root URL of the same distribution instead of to a specific object, as in the first example:\n> ```\n> https://d111111abcdef8.cloudfront.net/\n> ```\n> When you define a default root object, an end-user request that calls the root of your distribution returns the default root object. For example, if you designate the file index.html as your default root object, a request for:\n> ```\n> https://d111111abcdef8.cloudfront.net/\n> ```\n> Returns:\n> ```\n> https://d111111abcdef8.cloudfront.net/index.html\n> ```\n> However, if you define a default root object, an end-user request for a subdirectory of your distribution does not return the default root object. For example, suppose index.html is your default root object and that CloudFront receives an end-user request for the install directory under your CloudFront distribution:\n> ```\n> https://d111111abcdef8.cloudfront.net/install/\n> ```\n> CloudFront does not return the default root object even if a copy of index.html appears in the install directory.\n> \n> If you configure your distribution to allow all of the HTTP methods that CloudFront supports, the default root object applies to all methods. For example, if your default root object is index.php and you write your application to submit a POST request to the root of your domain (http://example.com), CloudFront sends the request to http://example.com/index.php.\n> \n> The behavior of CloudFront default root objects is different from the behavior of Amazon S3 index documents. When you configure an Amazon S3 bucket as a website and specify the index document, Amazon S3 returns the index document even if a user requests a subdirectory in the bucket. (A copy of the index document must appear in every subdirectory.) For more information about configuring Amazon S3 buckets as websites and about index documents, see the Hosting Websites on Amazon S3 chapter in the Amazon Simple Storage Service User Guide.\n\n[Configuring an index document](https://docs.aws.amazon.com/AmazonS3/latest/userguide/IndexDocumentSupport.html)\n> In Amazon S3, a bucket is a flat container of objects. It does not provide any hierarchical organization as the file system on your computer does. However, you can create a logical hierarchy by using object key names that imply a folder structure.\n> \n> For example, consider a bucket with three objects that have the following key names. Although these are stored with no physical hierarchical organization, you can infer the following logical folder structure from the key names:\n> - sample1.jpg — Object is at the root of the bucket.\n> - photos/2006/Jan/sample2.jpg — Object is in the photos/2006/Jan subfolder.\n> - photos/2006/Feb/sample3.jpg — Object is in the photos/2006/Feb subfolder.\n> \n> In the Amazon S3 console, you can also create a folder in a bucket. For example, you can create a folder named photos. You can upload objects to the bucket or to the photos folder within the bucket. If you add the object sample.jpg to the bucket, the key name is sample.jpg. If you upload the object to the photos folder, the object key name is photos/sample.jpg.\n> \n> If you create a folder structure in your bucket, you must have an index document at each level. In each folder, the index document must have the same name, for example, index.html. When a user specifies a URL that resembles a folder lookup, the presence or absence of a trailing slash determines the behavior of the website. For example, the following URL, with a trailing slash, returns the photos/index.html index document.\n> ```\n> http://bucket-name.s3-website.Region.amazonaws.com/photos/\n> ```\n> \n> However, if you exclude the trailing slash from the preceding URL, Amazon S3 first looks for an object photos in the bucket. If the photos object is not found, it searches for an index document, photos/index.html. If that document is found, Amazon S3 returns a 302 Found message and points to the photos/ key. For subsequent requests to photos/, Amazon S3 returns photos/index.html. If the index document is not found, Amazon S3 returns an error.\n\n[Implementing Default Directory Indexes in Amazon S3-backed Amazon CloudFront Origins Using Lambda@Edge](https://aws.amazon.com/blogs/compute/implementing-default-directory-indexes-in-amazon-s3-backed-amazon-cloudfront-origins-using-lambdaedge/)\n> If you implement CloudFront in front of S3, you can achieve this by using an OAI. However, in order to do this, you cannot use the HTTP endpoint that is exposed by S3’s static website hosting feature. Instead, CloudFront must use the S3 REST endpoint to fetch content from your origin so that the request can be authenticated using the OAI. This presents some challenges in that the REST endpoint does not support redirection to a default index page.\n\n> CloudFront does allow you to specify a default root object (index.html), but it only works on the root of the website (such as http://www.example.com > http://www.example.com/index.html). It does not work on any subdirectory (such as http://www.example.com/about/). If you were to attempt to request this URL through CloudFront, CloudFront would do a S3 GetObject API call against a key that does not exist.\n\n\n\n那么，我们要怎么解决这个问题呢？我觉得，这个问题有三种解决方法：\n\n1. 不使用 OAI ，让 CloudFront 直接指向 S3 的域名，让 CloudFront 使用 S3 HTTP Endpoint 的特性\n2. 调整 Hexo 配置，更改生成文件路径或连接路径\n3. 使用 AWS 推荐的 Lambda@Edge 功能，在 CloudFront 上修改路径\n\n其中第二种方案是最下策，我们不能在还有其他方案的情况下，因为基础设施的一个性质就去修改我们的产品。况且我们的产品在大多数场景下都是适用的。\n第一种方案是中策，也许实行起来也是最简单的。但我不想用，原因上面也说过了。\n第三种方案是实施起来难度最大的，我们要引入 Lambda 这一新概念。但反正折腾嘛，试试就试试，反正失败了再变回第一种方案就是。\n\n## 创建 Lambda\n\n[Implementing Default Directory Indexes in Amazon S3-backed Amazon CloudFront Origins Using Lambda@Edge](https://aws.amazon.com/blogs/compute/implementing-default-directory-indexes-in-amazon-s3-backed-amazon-cloudfront-origins-using-lambdaedge/)\n\n参考上面的文档，我们直接在 Console 创建一个 Lambda 函数，内容如下：\n\n```javascript\n'use strict';\nexports.handler = (event, context, callback) => {\n \n // Extract the request from the CloudFront event that is sent to Lambda@Edge \n var request = event.Records[0].cf.request;\n\n // Extract the URI from the request\n var olduri = request.uri;\n\n // Match any '/' that occurs at the end of a URI. Replace it with a default index\n var newuri = olduri.replace(/\\/$/, '\\/index.html');\n \n // Log the URI as received by CloudFront and the new URI to be used to fetch from origin\n console.log(\"Old URI: \" + olduri);\n console.log(\"New URI: \" + newuri);\n \n // Replace the received URI with the URI that includes the index page\n request.uri = newuri;\n \n // Return to CloudFront\n return callback(null, request);\n\n};\n```\n这一段代码主要作用是把接收到每个以 `/` 结尾的请求，都转换为以 `/index.html` 结尾的请求。\n\nDeploy 之后，为 Lambda 添加 Trigger ，选择 CloudFront 作为 Trigger ， Event 选择 On Request 。按照界面的提示为 Lambda 创建专用的 Role 。\n提交后，我们就可以通过 Url 访问，发现 `/` 结尾的 URL 也会正常显示了。\n\n# 之后的事\n\n这个过程仍有以下问题：\n- 对 Lambda 的认识仍有不足，今后需继续学习运用\n- Lambda@Edge 还没有结合到 IaC 中\n- 配置文件生成过程仍有改进空间\n\n留下这些问题，今后再修改。\n","title":"用 GitHub Action 自动化构建 Hexo 并发布到 S3","abstract":"GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。\n但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。\n我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：","length":342,"created_at":"2022-03-26T23:55:08.000Z","updated_at":"2022-03-27T13:31:04.000Z","tags":["Blog","GitHub","AWS","CI/CD","IaC","DevOps"],"license":false}},{"slug":"init-a-new-hexo-project","file":"public/content/articles/2021-12-12-init-a-new-hexo-project.md","mediaDir":"content/articles/2021-12-12-init-a-new-hexo-project","path":"/articles/init-a-new-hexo-project","meta":{"content":"\n## 使用 hexo 搭建博客\n\n最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。\n对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。\n\n使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。\n\n我们可以尝试一下代码块高亮：\n\n```python\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n试试下标语法吧：\n\n这是一句话。[^sub]\n\n没想到还支持下标语法，还是比较惊艳的。\n\n来几句 mermaid 吧\n\n```mermaid\ngraph LR\n\nohmy-->coll\n\n```\n\n原本是不能渲染的， 这个主题渲染代码块时把 mermaid 代码当作普通代码，往里面里插换行符号了。\n使用了 hexo-filter-mermaid-diagrams 插件，添加 mermaid 过滤器，解决问题。\n\n\n来几句 LaTeX:\n\n$$\n\\begin{aligned}\nf(x) &= \\sum_{i=2}^{\\infty}{\\Join} \\\\\n&= \\sum_{i=2}^{\\infty}{\\frac{1}{i}}\n\\end{aligned}\n$$\n\n原本是不能渲染的，因为与 hexo 的渲染器有冲突，需要转义。\n我因为需要从以前的博客把文章转移过来觉得比较麻烦...\n于是魔改了一下主题，用上 mathjax 插件，能渲染了，感觉挺不错的。\n再改善一下推个 PR 吧。\n\n\n\n\n[^sub]: 这是脚注","title":"init-a-new-hexo-project","abstract":"最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。\n对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。\n使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。","length":66,"created_at":"2021-12-12T20:09:13.000Z","updated_at":"2022-03-27T13:30:33.000Z","tags":["Blog"],"license":false}},{"slug":"Building-this-blog","file":"public/content/articles/2020-01-27-Building-this-blog.md","mediaDir":"content/articles/2020-01-27-Building-this-blog","path":"/articles/Building-this-blog","meta":{"content":"\n> “Stop Trying to Reinvent the Wheel.”\n\n## 博客构建\n\n\n#### 把仓库clone到本地\n\n参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。\n\n整个网站文件夹大致结构如下：\n\n```\n├── _config.yml\n|\n├── _posts/\n| ├── 2007-10-29-awsome-file-name.md\n| └── 2009-04-26-stupid-file-name.md\n├── img/\n| ├── in-post/\n| ├── awsome-bg.jpg\n| ├── avatar-ryo.png\n| ├── favicon.ico\n| └── icon_wechat.jpg\n├── other_awsome_directory/\n| └── awsomefiles\n|\n|\n├── 404.html\n├── about.html\n├── index.html\n└── other_awsome_files\n```\n\n博客的文章上传到`_posts`文件夹中，网站中用到的图片上传到`img`文件夹中，网站的全局设置在`_config.yml`中进行。\n\n\n\n#### 修改**_config.yml**文件\n\n修改根目录下的`_config.yml`文件，将其中的内容更改为自己的信息。\n\n```yml\n# Site settings\ntitle: Ryo's Blog\nSEOTitle: 阿亮仔的博客 | 亮のブログ | Ryo's Blog\nheader-img: img/home-bg.jpg\nemail: qq250707340@163.com\ndescription: \"君の夢が　叶うのは　誰かのおかげじゃないぜ。\"\nkeyword: \"Ryo, Blog, 阿亮仔, りょう, 博客, ブログ, Algorithm, Unity, Python, C-Sharp\"\nurl: \"http://RyoJerryYu.github.io\" # your host, for absolute URL\nbaseurl: \"\" # for example, '/blog' if your blog hosted on 'host/blog'\ngithub_repo: \"https://github.com/RyoJerryYu/RyoJerryYu.github.io.git\" # you code repository\n```\n- `SEOTitle`: `<title>`标签，即显示在浏览器标题中的文字。\n- `header-img`: 首页显示的图像，可以把路径更改为自己的图片。\n- `description`: `<meta name=\"description\">`中的内容。\n- `keyword`: `<meta name=\"keyword\">`中的内容。\n- `url`, `baseurl`: 分别为博客域名地址与其下路径。如不想将博客直接架在根路径下，需要对`baseurl`进行设置。\n- `github_repo`: 博客所在的GitHub仓库。\n\n---\n\n\n```yml\n# SNS settings\nRSS: false\n# weibo_username: huxpro\n# zhihu_username: huxpro\ngithub_username: RyoJerryYu\ntwitter_username: ryo_okami\n# facebook_username: huxpro\n```\n分别为各个社交网站上的账号信息，以供在侧边栏中直接跳转到对应的页面。可通过在行首添加或删除`#`进行注释或取消注释。\n\n从[原仓库][origin_repo]中直接fork出来时，社交网站的图标可能会有[无法显示的问题](https://github.com/Huxpro/huxblog-boilerplate/issues/17)，其解决方法在[后面](#FixSNS)介绍。\n\n---\n\n\n```yml\n# Disqus settings\n#disqus_username: _your_disqus_short_name_\n\n# Duoshuo settings\n# duoshuo_username: huxblog\n# Share component is depend on Comment so we can NOT use share only.\n# duoshuo_share: true # set to false if you want to use Comment without Sharing\n\n# Gitalk\ngitalk:\n enable: false #是否开启Gitalk评论\n clientID: f2c84e7629bb1446c1a4 #生成的clientID\n clientSecret: ca6d6139d1e1b8c43f8b2e19492ddcac8b322d0d #生成的clientSecret\n repo: qiubaiying.github.io #仓库名称\n owner: qiubaiying #github用户名\n admin: qiubaiying\n distractionFreeMode: true #是否启用类似FB的阴影遮罩 \n```\n分别为各种评论系统。均未开启。\n\n---\n\n\n```yml\n# Analytics settings\n# Baidu Analytics\n# ba_track_id: 4cc1f2d8f3067386cc5cdb626a202900\n# Google Analytics\nga_track_id: 'UA-156933256-1' # Format: UA-xxxxxx-xx\nga_domain: auto\n```\n分别为百度与谷歌的网站统计。我只启用了Google Analytics。可先到[Google Marketing Platform](https://marketingplatform.google.com/about/)注册，开启Google Analytics。在`设置`->`媒体资源设置`中获得Track ID，并填入`ga_track_id`中。\n\n---\n\n\n```yml\n# Sidebar settings\nsidebar: true # whether or not using Sidebar.\nsidebar-about-description: \"记录平时遇到的问题，以及对应的解决方法。偶尔上传些许宅活或是娱乐方面的记录。\"\nsidebar-avatar: /img/avatar-ryo.png # use absolute URL, seeing it's used in both `/` and `/about/`\n```\n`sidebar`: 是否开启侧边栏，为`true`或`false`。\n`sidebar-about-description`: 显示在侧边栏中的个人简介。\n`sidebar-avatar`: 显示在侧边栏中的头像。\n\n---\n\n\n```yml\n# Featured Tags\nfeatured-tags: true # whether or not using Feature-Tags\nfeatured-condition-size: 2 # A tag will be featured if the size of it is more than this condition value\n```\n是否开启tag功能，以及最少要达到多少篇文章才能使tag显示在首页上。\n\n\n\n#### 修改主页等信息\n\n修改`index.html`、`404.html`、`about.html`、`tags.html`等文件，将其中的内容更改为自己的信息。\n\n- 在`index`中，修改`description`对应的内容，亦即主页中标题下方的描述。\n- 在`404`、`tags`、`about`中，修改`description`的内容，亦即404页面中的描述信息。如有需要，也可以修改`header-img`，即404页面的图片地址。\n- 在`about`中，还有修改自我介绍对应的内容。\n\n\n\n#### 修改图片信息\n\n修改`img/`下的图片，替换为自己的图片。要记得替换以下图片：\n- `avatar-ryo.png`\n- `favicon.ico`\n- `icon_wechat.png`\n\n\n\n#### 修改README.md\n\nREADME.md为Github仓库的介绍，可以在README.md中写上这个博客主要的内容，让别人了解这个博客。\n\n\n\n#### 完成\n\n将`_posts`中的博文全部删除后，将本地文件全部push到GitHub仓库中。稍等后用浏览器浏览`<用户名>.github.io`（或是你在`_config.yml`中设定的路径）。若发现网页已更新，即博客搭建成功，可以开始写博文了。\n\n*然而，并没有成功。*\n\n\n\n## Fix Bug\n\n<p id = \"FixReadmeCh\"></p>\n\n#### 修复README.zh.md引发的错误\n\n按上述步骤搭建完毕后，网页并没有正常显示。此时GitHub账号所关联的邮箱中收到标题为**Page build failure**的邮件，内容如下：\n> The page build failed for the `master` branch with the following error:\n> The tag `if` on line 235 in `README.zh.md` was not properly closed.\n\n如[原仓库][origin_repo]中的[issue#11](https://github.com/Huxpro/huxblog-boilerplate/issues/11)所示，在`README.zh.md`中存在`if`语句，会触发错误。\n\n因并无其他特别的需求，此处采用暴力删除`README.zh.md`的方法解决。\n\n对应commit：[删除README.zh.md，尝试修复因...](https://github.com/RyoJerryYu/RyoJerryYu.GitHub.io/commit/098d710160775df9b6d2cf04d7d4eec526a67bf4)\n\n\n<p id = \"FixSNS\"></p>\n\n#### 修复SNS链接不正常显示\n\n修复上述错误后，稍等即可正常打开网页。但是，我们在`_config.yml`中设置好的SNS链接并没有在侧边栏以及网页底部正常显示。如原仓库中的[issue#17](https://github.com/Huxpro/huxblog-boilerplate/issues/17)所示，原因是gitpage必须通过https访问bootcss.com等的cdn。\n\n此处采用原仓库[pull request#21](https://github.com/Huxpro/huxblog-boilerplate/pull/21)的方法，修改`_includes/head.html`, `_includes/footer.html`, `_layouts/keynote.html`, `_layouts/post.html`文件，将其中`http`修改为`https`。\n\n对应commit：[fix: change http into https](https://github.com/RyoJerryYu/RyoJerryYu.GitHub.io/commit/ec954c380472f30f09efdfadd074cb7967c2fa11)\n\n\n\n## 上传文章\n\n文章主要放在_posts文件夹中，用`git push`的方式推送到GitHub仓库，即可完成文章上传。\n\n文章正文以**markdown**语法书写，在文本头部增加如下格式的信息：\n```\n---\nlayout: post\ntitle: \"Welcome to Ryo's Blog!\"\nsubtitle: \" \\\"Hello World, Hello Blog\\\"\"\ndate: 2020-01-27 12:00:00\nauthor: \"Ryo\"\nheader-img: \"img/post-bg-default.jpg\"\ntags:\n - 杂技\n - 杂谈\n---\n```\n其中：\n- `layout`为文章所用的模板，可选`post`或`keynote`，也可自己写一个模板html放在`_layouts`文件夹下。\n- `title`为文章标题，`subtitle`为文章副标题。\n- `date`为博客中显示的文章发表时间。\n- `author`为博客中显示的作者。\n- `header-img`为文章顶部显示的封面。\n- `tags`为文章的标签，我们的博客网站可以通过标签来快速寻找文章。\n\n把文章的文件名命名为时间+标题的形式，后缀名使用markdown文本的通用后缀名`md`，如`2020-01-27-hello-world.md`。完成后将此文本文件放到`_posts/`文件夹下。文章中使用到的图片建议放到`img/in-post/`文件夹下。\n\n完成后，使用`git push`推送到GitHub仓库，稍等后刷新博客网页即可看见刚才上传的文章。文章的url一般为：`<博客地址>/<文章文件名中的年>/<月>/<日>/<文件名中剩余部分>`。\n\n\n\n\n## 祝你开始愉快的博客生活。\n\n\n#### 感谢\n\n- [Huxpro][Huxpro]提供的博客模板：[huxblog-boilerplate][origin_repo]\n- [BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]\n- [Luo Yifan（罗一凡）](https://github.com/iVanlIsh)提供的Bug解决方案。\n\n\n\n\n[Huxpro]: https://github.com/huxpro\n[BruceZhao]: https://github.com/BruceZhaoR\n[origin_repo]: https://github.com/Huxpro/huxblog-boilerplate\n[READMEzh]: https://github.com/Huxpro/huxpro.github.io/blob/master/README.zh.md","title":"搭建博客的过程","abstract":"> “Stop Trying to Reinvent the Wheel.”\n参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。\n整个网站文件夹大致结构如下：","length":250,"created_at":"2020-01-27T14:00:00.000Z","updated_at":"2022-03-27T13:30:33.000Z","tags":["杂技","Blog"],"license":false}}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/c++.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/c++.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/c++.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/c++.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/ci-cd.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/ci-cd.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/ci-cd.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/ci-cd.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/cloud-computing.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/cloud-computing.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/cloud-computing.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/cloud-computing.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/cloud-native.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/cloud-native.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/cloud-native.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/cloud-native.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/devops.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/devops.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/devops.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/devops.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/docker.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/docker.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/docker.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/docker.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/github.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/github.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/github.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/github.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/hexo.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/hexo.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/hexo.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/hexo.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/iac.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/iac.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/iac.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/iac.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/javascript.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/javascript.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/javascript.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/javascript.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/kubernetes.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/kubernetes.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/kubernetes.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/kubernetes.json diff --git a/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/nextjs.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/nextjs.json new file mode 100644 index 00000000..589c9314 --- /dev/null +++ b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/nextjs.json @@ -0,0 +1 @@ +{"pageProps":{"allTagInfos":[{"tag":"Kubernetes","slug":"kubernetes","path":"/tags/kubernetes","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"DevOps","slug":"devops","path":"/tags/devops","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Docker","slug":"docker","path":"/tags/docker","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Cloud Native","slug":"cloud-native","path":"/tags/cloud-native","postSlugs":[{"postSlug":"introduction-for-k8s-2","postType":"article"},{"postSlug":"introduction-for-k8s","postType":"article"},{"postSlug":"newest","postType":"idea"}]},{"tag":"Blog","slug":"blog","path":"/tags/blog","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"},{"postSlug":"create-blog-cicd-by-github","postType":"article"},{"postSlug":"init-a-new-hexo-project","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"VSCode","slug":"vscode","path":"/tags/vscode","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"Hexo","slug":"hexo","path":"/tags/hexo","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"JavaScript","slug":"javascript","path":"/tags/javascript","postSlugs":[{"postSlug":"use-paste-image-and-vscode-memo","postType":"article"}]},{"tag":"GitHub","slug":"github","path":"/tags/github","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"AWS","slug":"aws","path":"/tags/aws","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"CI/CD","slug":"ci-cd","path":"/tags/ci-cd","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"IaC","slug":"iac","path":"/tags/iac","postSlugs":[{"postSlug":"create-blog-cicd-by-github","postType":"article"}]},{"tag":"数据结构","slug":"数据结构","path":"/tags/数据结构","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"},{"postSlug":"python-dict","postType":"article"}]},{"tag":"算法","slug":"算法","path":"/tags/算法","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"},{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"算法竞赛","slug":"算法竞赛","path":"/tags/算法竞赛","postSlugs":[{"postSlug":"Handy-heap-cheat-sheet","postType":"article"}]},{"tag":"设计模式","slug":"设计模式","path":"/tags/设计模式","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"笔记","slug":"笔记","path":"/tags/笔记","postSlugs":[{"postSlug":"The-beauty-of-design-parten","postType":"article"}]},{"tag":"排序","slug":"排序","path":"/tags/排序","postSlugs":[{"postSlug":"Sort-algorithm","postType":"article"}]},{"tag":"Python","slug":"python","path":"/tags/python","postSlugs":[{"postSlug":"python-dict","postType":"article"}]},{"tag":"C++","slug":"c++","path":"/tags/c++","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"}]},{"tag":"杂技","slug":"杂技","path":"/tags/杂技","postSlugs":[{"postSlug":"the-using-in-cpp","postType":"article"},{"postSlug":"Building-this-blog","postType":"article"},{"postSlug":"hello-world","postType":"article"}]},{"tag":"杂谈","slug":"杂谈","path":"/tags/杂谈","postSlugs":[{"postSlug":"hello-world","postType":"article"}]},{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},{"tag":"Cloud Computing","slug":"cloud-computing","path":"/tags/cloud-computing","postSlugs":[{"postSlug":"newest","postType":"idea"}]}],"selectedTagInfo":{"tag":"Nextjs","slug":"nextjs","path":"/tags/nextjs","postSlugs":[{"postSlug":"blog-syntax","postType":"idea"},{"postSlug":"blog-in-next","postType":"idea"}]},"posts":[{"slug":"blog-syntax","file":"public/content/ideas/blog-syntax.md","mediaDir":"content/ideas/blog-syntax","path":"/ideas/blog-syntax","meta":{"content":"\n# 一级标题\n\n## 二级标题\n\n### 三级标题\n\n#### 四级标题\n\n##### 五级标题\n\n###### 六级标题\n\n**加粗**\n\n*斜体*\n\n***加粗斜体***\n\n~~删除线~~\n\n> 引用\n\n# 其他 MD 语法\n\n## 代码块\n\n`行内代码`\n\n代码块高亮：\n\n```python\n# 代码块\ndef func_echo(s: str):\n print(s)\n\n\nclass HelloPrinter:\n printer: Callable[[str]]\n\n def __init__(self, printer: Callable[[str]]):\n self.printer = printer\n \n def call(self, s: str):\n self.printer(s)\n\n\np = HelloPrinter(func_echo)\np.call(\"hello world!\")\n```\n\n大围栏\n\n````markdown\n```\ndef func_echo(s: str):\n print(s)\n```\n````\n\n行内反引号围栏： `` ` `` 或者 ``` `` ``` 的模式\n \n```markdown\n`段落反引号内的行内反引号`\n```\n\n## 列表\n\n- 无序列表\n - 无序列表\n - 无序列表\n - 无序列表\n\n1. 有序列表\n2. 有序列表\n3. 有序列表\n\n## 链接\n\n[链接](https://blog.ryo-okami.xyz)\n\n[站内链接](/ideas/blog-syntax)\n\n## 图片\n\n图片：\n\n![图片](https://blog.ryo-okami.xyz/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n站内图片：\n\n![站内图片](/content/articles/2022-07-31-why-homogeneous/OnOneLineWillStillOneLine_ManimCE_v0.16.0.post0.gif)\n\n## 表格\n\n| 表头 | 表头 | 表头 |\n| ---- | ---- | ---- |\n| 单元 | 单元 | 单元 |\n| 单元 | 单元 | 单元 |\n\n## 脚注\n\n下标[^1]\n\n[^1]: 注释\n\n# 插件\n\n## Katex\n\n行间公式\n\n$$\n\\begin{aligned}\n\\dot{x} & = \\sigma(y-x) \\\\\n\\dot{y} & = \\rho x - y - xz \\\\\n\\dot{z} & = -\\beta z + xy\n\\end{aligned}\n$$\n\n行内公式 $E=mc^2$\n\n## Mermaid\n\nmermaid 流程图\n\n```mermaid\ngraph LR\n A[方形] --> B(圆角)\n B --> C{条件}\n C -->|a=1| D[结果1]\n C -->|a=2| E[结果2]\n C -->|a=3| F[结果3]\n```\n\n另一个 mermaid 流程图，同样类型不会冲突\n\n```mermaid\ngraph TD\n A((圆)) --> B([圆边])\n B --> C[(DB)]\n```\n\n\nmermaid 时序图\n\n```mermaid\nsequenceDiagram\n participant Alice\n participant Bob\n Alice->>John: Hello John, how are you?\n loop Healthcheck\n John->>John: Fight against hypochondria\n end\n Note right of John: Rational thoughts <br/>prevail...\n John-->>Alice: Great!\n John->>Bob: How about you?\n Bob-->>John: Jolly good!\n```\n\n## Heading 引用\n\n点击能够跳转：\n\n[文章内标题引用](#一级标题)\n\n[跨文章标题引用](/ideas/blog-syntax#一级标题)\n\n# Obsidian 短引用\n\n## 图片\n\n短引用图片，纯文件名\n\n![[test-img-show-image.png]]\n\n短引用图片，带注释\n\n![[test-img-show-image.png|这是一张图片]]\n\n短引用图片，带路径\n\n![[blog-syntax/test-img-show-image.png]]\n\n短引用图片，带路径和注释\n\n![[blog-syntax/test-img-show-image.png|这是一张图片]]\n\n短引用图片，全路径\n\n![[/content/ideas/blog-syntax/test-img-show-image.png]]\n\n## Excalidraw\n\n短引用 Excalidraw\n\n![[Drawing 2024-04-13 17.33.27.excalidraw]]\n\n\n","title":"博客语法渲染测试","abstract":"**加粗**\n*斜体*\n***加粗斜体***","length":200,"created_at":"2024-04-15T16:44:34.000Z","updated_at":"2024-04-14T11:41:29.000Z","tags":["Blog","Nextjs"],"license":false}},{"slug":"blog-in-next","file":"public/content/ideas/blog-in-next.md","mediaDir":"content/ideas/blog-in-next","path":"/ideas/blog-in-next","meta":{"content":"\n# blog todo\n\n## 一期\n\n- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex\n - [x] rehype-slug\n - [x] https://github.com/unifiedjs/unified\n - [x] recma -> 修改 MDX , remark -> 修改 markdown ， rehype -> 修改 html\n - [x] https://www.haxibami.net/blog/posts/blog-renewal\n - [x] about img to next/Image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [x] introduction of remark https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html\n- [x] 下标语法行为 -> 修改默认不用 a 标签\n 使用 remark gfm 后自动解决\n- [x] 处理 picture 路径的问题\n- [x] 默认元素映射，处理代码高亮\n - [x] mermaid 渲染\n - [x] latex 渲染 弃用，思考 remark-rehype 优先\n - [x] latex 中文渲染\n - [x] vscode-memo 语法\n - [x] 站内多媒体相对链接\n - [x] latex 显示两次\n - [x] katex 需要特殊的 css ，加载后修复\n - [x] 没有闭合的左箭头自动转义\n 做不到， next-mdx-remote 调用 mdx-js ， createProcessor 中会在执行所有 remark 插件之前，先执行 remark-mdx ，无法通过插件修改 \n - https://github.com/mdx-js/mdx/tree/main/packages/remark-mdx\n - https://github.com/mdx-js/mdx/blob/main/packages/mdx/lib/core.js\n- [x] 简单的样式\n - [x] Article 页面\n - [x] 主页\n - [x] 主页封面： position: static 不会反应 z-index ，需要 position: 其他值\n - [x] about 页\n - 先不做\n - [x] 其他页的最小高度，处理 footer 不要太高\n - [x] Tag 页\n - [x] Idea 页\n - [x] refactor move meta together\n- [x] fix post list height\n- [x] fix post list page tag box\n- [x] SEO 简单\n - [x] site map https://github.com/iamvishnusankar/next-sitemap\n - [x] Header， title\n - [x] OG\n - [x] og:site_name vs og:title?\n - [x] og:url?\n - [x] footer\n - [x] icon hover 发光， bg 不要变色\n - [x] 增加 icon ， Pixiv\n- [x] 处理旧链接跳转 https://www.viget.com/articles/host-build-and-deploy-next-js-projects-on-github-pages/\n - [x] path prefix\n - [x] 环境变量？配置文件？\n - [x] 代码高亮换成静态后 mermaid 也要用 remark 处理\n - [x] mermaid 内样式 -> 修复 global applyed 的行高\n - [x] 为什么 haxibami 的样式不会变？为什么是 tspan 和 text ？待探究 -> 是 pie 和 sequence 默认的\n - [x] maybe rehype-raw ？ -> 不是 rehype-raw 的问题，而且如果用 rehype-raw 会让 mdx 渲染不了显示 Cannot compile `mdxJsxFlowElement` node\n - [x] https://github.com/mermaid-js/mermaid/issues/2688\n - [x] turning the htmlLables to false fixed this (maybe other types of charts should be tested as well)\n - [x] 去除 path 中的日期\n 1. get all slugs once\n 2. get post meta by slug\n - [x] 修复 image url 跳转\n - [x] link jump 301 -> 308\n - 不能直接在 config 里配置，不会自动静态生成\n - 在 getStaticProps 里处理:\n - param 中拿到 slug 以 string[] 出现， slash 无关\n - build 时出现 error：`redirect` can not be returned from getStaticProps during prerendering\n - https://nextjs.org/docs/messages/gsp-redirect-during-prerender\n - 放弃治疗\n- [x] git time versioning\n - [x] created at\n - [x] updated at\n- [x] 部署脚本\n - [x] ghpage\n - [x] gh page 环境 path 前缀设置，\n - [x] env file 使用\n - [x] s3 test + prod\n - reusable wrokflow (on workflow call) https://docs.github.com/en/actions/using-workflows/reusing-workflows\n - composite action (no details, not to use) https://docs.github.com/en/actions/creating-actions/creating-a-composite-action\n - use artifact between workflow https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts\n - an https://stackoverflow.com/questions/70003863/reusing-github-action-workflow-steps-inside-another-job\n - gh-pages 先用蠢办法， build 上传一次 artifact ，deploy 时在 gh-pages action 里再上传一次\n - [x] Github Action 复用\n - [x] test infra stack 更新使用 s3 web hosting\n - [x] 处理 url 结尾带 slash 问题\n - https://github.com/keaeriksson/hugo-s3-cloudfront \\<- 最终解决方案，用 pulumi 把这个重写一遍\n - maybe it's time to serverless https://github.com/serverless-nextjs/serverless-next.js\n - or just use vercel! \n\n - [x] 更新 prod （infra ， Deploy ）\n- [x] 修复 mermaid 渲染\n - [x] 方法1 remark 时处理，变静态 svg （简单）\n - [x] 方法2 highlight 推延到渲染时处理，用组件包裹 （希望优先）\n - [x] 组建渲染时快速刷新可能导致 syntax error\n - [x] 可能的处理闪动的信息： \n - https://github.com/ant-design/ant-design/issues/16037\n - https://stackoverflow.com/questions/72248724/components-flicker-during-server-side-render-for-nextjs-and-material-ui\n - https://www.stackfive.io/work/nextjs/how-to-fix-styled-components-page-flicker-in-next-js-12\n - https://stackoverflow.com/questions/65527040/using-prism-js-line-highlight-plugin-with-next-js-app-causes-text-content-did-n\n - https://css-tricks.com/syntax-highlighting-prism-on-a-next-js-site/#aa-highlighting-lines\n - https://www.felixmokross.dev/blog/code-samples-line-highlighting\n- [x] 修复：\n - [x] Home Page 下方链接点击问题\n - [x] 改进 trailing slash -> lambda 写错，要加 .html 不是 /index.html\n - [x] 排查 s3 旧文件未删除问题 rm 后加一句 ls debug\n - [x] tag box 增加 focus\n- [x] reuse https://docs.github.com/en/actions/using-workflows/reusing-workflows\n\n\n## 二期\n\n- [x] favicon\n- [x] Google Analytics\n - [ ] sitemap 检查\n- [ ] test workflow for dependabot\n- [x] SEO better, og:type=article read more: https://ogp.me/#types\n- [x] 文章按创建时间倒序\n- [x] 写 README 与项目简介\n- [ ] Rss etc https://github.com/jpmonette/feed\n- [x] 响应式适配\n\n- tips:\n - md syntax -> mdx(react component) : use mdx provider component rewriting (code block to mermaid component)\n - md syntax -> special html -> use rehype plugin rewriting (katex, highlight)\n - special md syntax -> use remark plugin rewriting (could not to mdx, should first to html and then mdx provider rewrite)\n\n\nplus:\n- [ ] https://conv.denshochan.com/markdown\n - [ ] 段落内の改行\n - [ ] 行頭の文字下げ\n - [ ] Twitter アカウント\n - [ ] ルビ\n - [ ] ものルビ風の熟語ルビ\n- [ ] https://www.haxibami.net/blog/posts/blog-renewal\n - [ ] link card\n - [ ] image to next image https://zenn.dev/elpnt/articles/c17727e9d254ef00ea60\n - [ ] precompile mermaid\n- [ ] svg 输入\n - [ ] 绘画工具： KRITA ， 免费，有 mac os 版 https://docs.krita.org/zh_CN/user_manual.html\n - [ ] KRITA 推荐使用 Inkscape 进行编辑\n- [ ] vscode 语法站内相对链接\n - [ ] mui/base could be very good\n - [ ] search lunr？ -> mini search https://www.webpro.nl/articles/how-to-add-search-to-your-static-site\n - [ ] 可以简单参考 3b1b 直接全局 hold 住，然后全文搜索\n - [ ] blog list pagition (could be later, use infinite scroll)\n- [ ] nextjs 13 app directory https://beta.nextjs.org/docs/getting-started\n- [ ] ja 等多语言支持\n- [ ] 基于 git 的差量 build\n- [ ] 组件 visual testing https://glebbahmutov.com/blog/open-source-visual-testing-of-components/\n- [x] gh-pages gls 不可能，不支持\n- [x] gh-pages public paths\n- [ ] search console?\n- [ ] 参考以下链接优化主页\n - [ ] https://meola.booth.pm/items\n - [ ] https://makoto-kaminaga.jimdofree.com/\n\n\n","title":"用 Next.js 重构 blog ，TODO list","abstract":"- [x] 复写 markdown parse ，增加 latex 支持\n - [x] remark-math\n - [x] rehype-katex","length":160,"created_at":"2023-02-12T07:35:21.000Z","updated_at":"2023-02-12T07:25:33.000Z","tags":["Blog","Nextjs"],"license":false}}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/python.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/python.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/python.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/python.json diff --git a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/vscode.json b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/vscode.json similarity index 100% rename from _next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/vscode.json rename to _next/data/xFxjrJn2NzpxePE-GRMIC/tags/vscode.json diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\216\222\345\272\217.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\216\222\345\272\217.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\216\222\345\272\217.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\216\222\345\272\217.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\225\260\346\215\256\347\273\223\346\236\204.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\225\260\346\215\256\347\273\223\346\236\204.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\225\260\346\215\256\347\273\223\346\236\204.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\225\260\346\215\256\347\273\223\346\236\204.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\235\202\346\212\200.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\235\202\346\212\200.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\235\202\346\212\200.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\235\202\346\212\200.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\235\202\350\260\210.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\235\202\350\260\210.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\346\235\202\350\260\210.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\346\235\202\350\260\210.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\347\254\224\350\256\260.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\347\254\224\350\256\260.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\347\254\224\350\256\260.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\347\254\224\350\256\260.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\347\256\227\346\263\225.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\347\256\227\346\263\225.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\347\256\227\346\263\225.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\347\256\227\346\263\225.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\347\256\227\346\263\225\347\253\236\350\265\233.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\347\256\227\346\263\225\347\253\236\350\265\233.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\347\256\227\346\263\225\347\253\236\350\265\233.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\347\256\227\346\263\225\347\253\236\350\265\233.json" diff --git "a/_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\350\256\276\350\256\241\346\250\241\345\274\217.json" "b/_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\350\256\276\350\256\241\346\250\241\345\274\217.json" similarity index 100% rename from "_next/data/JA6RoBgC3Dvv5M-I8q-kB/tags/\350\256\276\350\256\241\346\250\241\345\274\217.json" rename to "_next/data/xFxjrJn2NzpxePE-GRMIC/tags/\350\256\276\350\256\241\346\250\241\345\274\217.json" diff --git a/_next/static/JA6RoBgC3Dvv5M-I8q-kB/_buildManifest.js b/_next/static/xFxjrJn2NzpxePE-GRMIC/_buildManifest.js similarity index 100% rename from _next/static/JA6RoBgC3Dvv5M-I8q-kB/_buildManifest.js rename to _next/static/xFxjrJn2NzpxePE-GRMIC/_buildManifest.js diff --git a/_next/static/JA6RoBgC3Dvv5M-I8q-kB/_ssgManifest.js b/_next/static/xFxjrJn2NzpxePE-GRMIC/_ssgManifest.js similarity index 100% rename from _next/static/JA6RoBgC3Dvv5M-I8q-kB/_ssgManifest.js rename to _next/static/xFxjrJn2NzpxePE-GRMIC/_ssgManifest.js diff --git a/articles.html b/articles.html index de5b8873..905dd01b 100644 --- a/articles.html +++ b/articles.html @@ -1 +1 @@ -<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="description" content="The blog owned by Ryo, about Programing, Painting, and Gaming."/><meta property="og:description" content="The blog owned by Ryo, about Programing, Painting, and Gaming."/><meta name="twitter:description" content="The blog owned by Ryo, about Programing, Painting, and Gaming."/><meta property="og:image" content="https://ryojerryyu.github.io/blog-next/img/home-bg-kasumi-hanabi.jpg"/><meta name="twitter:image" content="https://ryojerryyu.github.io/blog-next/img/home-bg-kasumi-hanabi.jpg"/><meta property="og:type" content="website"/><meta property="og:url" content="https://blog.ryo-okami.xyz/articles"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:site" content="@ryo_okami"/><meta name="twitter:creator" content="@ryo_okami"/><link rel="icon" href="/blog-next/favicon.ico"/><meta name="viewport" content="width=device-width, initial-scale=1"/><meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"/><title>Articles | Ryo's Blog
Ryo's Blog
Articles
Ideas
Tags
Clips
Kubernetes 入门 （2）

我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

Kubernetes
DevOps
Docker
Cloud Native
Kubernetes 入门 （1）

我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

> 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

"Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

Kubernetes
DevOps
Docker
Cloud Native
为什么使用在齐次坐标下矩阵乘法能表示点平移？

简化了一万倍来说，线性变换主要是在描述符合这两种性质的变换：一是要可加，二是要能数乘。

也就是说，对于空间中所有向量 $$\vec{v_1}, \vec{v_2}$$ ，以及任意数量 $$k_1, k_2$$ ，如果有：

$$

图解经济学原理(2)

> 1. 这篇文章参考了曼昆的《经济学原理》与北京大学王辉老师的《微观经济学》课程，内容上会有部分相似。

> 2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。

上一篇讲供给，这一篇讲需求。

图解经济学原理(1)

> 1. 这篇文章参考了曼昆的《经济学原理》与北京大学王辉老师的《微观经济学》课程，内容上会有部分相似。

> 2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。

我们先不讲课，先来带个货。

完善 Hexo 编写环境，改善文章中使用图片的体验

我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

Blog
VSCode
Hexo
JavaScript
用 GitHub Action 自动化构建 Hexo 并发布到 S3

GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

Blog
GitHub
AWS
CI/CD
IaC
DevOps
init-a-new-hexo-project

最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。

对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。

使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。

Blog
如何手撕一个堆

在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

数据结构
算法
算法竞赛
设计模式之美读书笔记

从7个方面评价代码的好坏：

1. 易维护性：根本

2. 可读性：最重要

设计模式
笔记
排序算法

我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

数据结构
算法
排序
Python字典的实现原理

> CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？

这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。

Python
数据结构
C++中using关键字的使用

1. 引入整个命名空间中的成员

不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。

```C++

C++
杂技
搭建博客的过程

> “Stop Trying to Reinvent the Wheel.”

参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。

整个网站文件夹大致结构如下：

杂技
Blog
Welcome to Ryo's Blog!

> “Hello World!”

自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。

感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。

杂技
杂谈
© 2023 Ryo Jerry Yu. All rights reserved.
\ No newline at end of file +Articles | Ryo's Blog
Ryo's Blog
Articles
Ideas
Tags
Clips
Kubernetes 入门 （2）

我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

Kubernetes
DevOps
Docker
Cloud Native
Kubernetes 入门 （1）

我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

> 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

"Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

Kubernetes
DevOps
Docker
Cloud Native
为什么使用在齐次坐标下矩阵乘法能表示点平移？

简化了一万倍来说，线性变换主要是在描述符合这两种性质的变换：一是要可加，二是要能数乘。

也就是说，对于空间中所有向量 $$\vec{v_1}, \vec{v_2}$$ ，以及任意数量 $$k_1, k_2$$ ，如果有：

$$

图解经济学原理(2)

> 1. 这篇文章参考了曼昆的《经济学原理》与北京大学王辉老师的《微观经济学》课程，内容上会有部分相似。

> 2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。

上一篇讲供给，这一篇讲需求。

图解经济学原理(1)

> 1. 这篇文章参考了曼昆的《经济学原理》与北京大学王辉老师的《微观经济学》课程，内容上会有部分相似。

> 2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。

我们先不讲课，先来带个货。

完善 Hexo 编写环境，改善文章中使用图片的体验

我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

Blog
VSCode
Hexo
JavaScript
用 GitHub Action 自动化构建 Hexo 并发布到 S3

GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

Blog
GitHub
AWS
CI/CD
IaC
DevOps
init-a-new-hexo-project

最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。

对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。

使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。

Blog
如何手撕一个堆

在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

数据结构
算法
算法竞赛
设计模式之美读书笔记

从7个方面评价代码的好坏：

1. 易维护性：根本

2. 可读性：最重要

设计模式
笔记
排序算法

我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

数据结构
算法
排序
Python字典的实现原理

> CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？

这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。

Python
数据结构
C++中using关键字的使用

1. 引入整个命名空间中的成员

不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。

```C++

C++
杂技
搭建博客的过程

> “Stop Trying to Reinvent the Wheel.”

参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。

整个网站文件夹大致结构如下：

杂技
Blog
Welcome to Ryo's Blog!

> “Hello World!”

自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。

感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。

杂技
杂谈
© 2023 Ryo Jerry Yu. All rights reserved.
\ No newline at end of file diff --git a/articles/Building-this-blog.html b/articles/Building-this-blog.html index 92f710b5..0f9f800a 100644 --- a/articles/Building-this-blog.html +++ b/articles/Building-this-blog.html @@ -4,7 +4,7 @@ 参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。 整个网站文件夹大致结构如下："/>
Ryo's Blog
Articles
Ideas
Tags
Clips

搭建博客的过程

杂技
Blog
+整个网站文件夹大致结构如下："/>
Ryo's Blog
Articles
Ideas
Tags
Clips
Loading comments...
© 2023 Ryo Jerry Yu. All rights reserved.
\ No newline at end of file +
杂技
Blog
<- C++中using关键字的使用
Welcome to Ryo's Blog! ->
Loading comments...
© 2023 Ryo Jerry Yu. All rights reserved.
\ No newline at end of file diff --git a/articles/Handy-heap-cheat-sheet.html b/articles/Handy-heap-cheat-sheet.html index 2c75247f..2730aba8 100644 --- a/articles/Handy-heap-cheat-sheet.html +++ b/articles/Handy-heap-cheat-sheet.html @@ -4,7 +4,7 @@ 当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。 但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。"/>
Ryo's Blog
Articles
Ideas
Tags
Clips

如何手撕一个堆

数据结构
算法
算法竞赛

如何手撕一个堆

+但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。"/>
Ryo's Blog
Articles
Ideas
Tags
Clips

如何手撕一个堆

数据结构
算法
算法竞赛

如何手撕一个堆

写在前面

在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

@@ -366,4 +366,4 @@

关于堆排序

  • 堆结构一般占用数组前端，因此从小到大排序时，有序部分从数组末尾开始扩张，建立的堆为大顶堆。
  • 堆排序只需要建堆与出堆操作，因此只需要实现下沉操作。
    • -

    关于堆排序的具体讨论，有机会的话我会另外写一篇来讲解。

    数据结构
    算法
    算法竞赛
    <- init-a-new-hexo-project
    设计模式之美读书笔记 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    关于堆排序的具体讨论，有机会的话我会另外写一篇来讲解。

    数据结构
    算法
    算法竞赛
    <- init-a-new-hexo-project
    设计模式之美读书笔记 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/Sort-algorithm.html b/articles/Sort-algorithm.html index 4485477e..939f57e7 100644 --- a/articles/Sort-algorithm.html +++ b/articles/Sort-algorithm.html @@ -4,7 +4,7 @@ 当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同： 在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    排序算法

    数据结构
    算法
    排序

    序言

    +在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    排序算法

    数据结构
    算法
    排序

    序言

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    @@ -339,4 +339,4 @@

    堆排序逆序对消除方式比较Tricky，但可以看出消除逆序对大致在于出堆步骤，通过O(logn)时间复杂度消除O(n)个逆序对。（左小右大排序时需要建立左大右小的大顶堆，建堆时基本没有消除逆序对）

    最后

    -

    这篇文章我们主要关注了排序算法中的大头——基于比较的排序算法。在下篇文章，我们再来看一下不基于比较的排序算法，以及外排序与并行排序。

    数据结构
    算法
    排序
    <- 设计模式之美读书笔记
    Python字典的实现原理 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    这篇文章我们主要关注了排序算法中的大头——基于比较的排序算法。在下篇文章，我们再来看一下不基于比较的排序算法，以及外排序与并行排序。

    数据结构
    算法
    排序
    <- 设计模式之美读书笔记
    Python字典的实现原理 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/The-beauty-of-design-parten.html b/articles/The-beauty-of-design-parten.html index 24ddf165..1e2b89c9 100644 --- a/articles/The-beauty-of-design-parten.html +++ b/articles/The-beauty-of-design-parten.html @@ -4,7 +4,7 @@ 1. 易维护性：根本 2. 可读性：最重要"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    设计模式之美读书笔记

    设计模式
    笔记

    导读

    +2. 可读性：最重要"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    设计模式
    笔记
    <- 如何手撕一个堆
    排序算法 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/create-blog-cicd-by-github.html b/articles/create-blog-cicd-by-github.html index 7c4f002e..fa3aabee 100644 --- a/articles/create-blog-cicd-by-github.html +++ b/articles/create-blog-cicd-by-github.html @@ -4,7 +4,7 @@ 但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。 我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标："/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。 +我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标："/>

    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。 但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    这篇文章的目标

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    @@ -285,4 +285,4 @@

    之后的事

  • Lambda@Edge 还没有结合到 IaC 中
  • 配置文件生成过程仍有改进空间
    • -

    留下这些问题，今后再修改。

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    <- 完善 Hexo 编写环境，改善文章中使用图片的体验
    init-a-new-hexo-project ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    留下这些问题，今后再修改。

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    <- 完善 Hexo 编写环境，改善文章中使用图片的体验
    init-a-new-hexo-project ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/graph-for-economics-1.html b/articles/graph-for-economics-1.html index e76b9125..8a700f90 100644 --- a/articles/graph-for-economics-1.html +++ b/articles/graph-for-economics-1.html @@ -4,7 +4,7 @@ > 2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。 我们先不讲课，先来带个货。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    图解经济学原理(1)

    +我们先不讲课，先来带个货。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    图解经济学原理(1)

    1. 这篇文章参考了曼昆的《经济学原理》与北京大学王辉老师的《微观经济学》课程，内容上会有部分相似。
    2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。
      3. @@ -108,4 +108,4 @@

      总结一下

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    <- 图解经济学原理(2)
    完善 Hexo 编写环境，改善文章中使用图片的体验 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    总结一下

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    <- 图解经济学原理(2)
    完善 Hexo 编写环境，改善文章中使用图片的体验 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/graph-for-economics-2.html b/articles/graph-for-economics-2.html index a6c9fd80..d4b5f345 100644 --- a/articles/graph-for-economics-2.html +++ b/articles/graph-for-economics-2.html @@ -4,7 +4,7 @@ > 2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。 上一篇讲供给，这一篇讲需求。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    图解经济学原理(2)

    +上一篇讲供给，这一篇讲需求。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    图解经济学原理(2)

    1. 这篇文章参考了曼昆的《经济学原理》与北京大学王辉老师的《微观经济学》课程，内容上会有部分相似。
    2. 这篇文章中的图使用 3Blue1Brown 的动画生成工具 manim 的 Community Edition 制作，源代码之后会上传到 GitHub 。
      3. @@ -133,4 +133,4 @@

      调节经

      财政政策

      货币政策

      两种政策对经济影响 —— 总供给总需求模型

      -

      国际经济

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    <- 为什么使用在齐次坐标下矩阵乘法能表示点平移？
    图解经济学原理(1) ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    国际经济

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    <- 为什么使用在齐次坐标下矩阵乘法能表示点平移？
    图解经济学原理(1) ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/hello-world.html b/articles/hello-world.html index 8b153f32..ef15edb3 100644 --- a/articles/hello-world.html +++ b/articles/hello-world.html @@ -4,7 +4,7 @@ 自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。 感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Welcome to Ryo's Blog!

    杂技
    杂谈
    +感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    杂技
    杂谈
    <- 搭建博客的过程
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/init-a-new-hexo-project.html b/articles/init-a-new-hexo-project.html index c2b81422..0ccf1f18 100644 --- a/articles/init-a-new-hexo-project.html +++ b/articles/init-a-new-hexo-project.html @@ -4,7 +4,7 @@ 对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。 使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    init-a-new-hexo-project

    Blog

    使用 hexo 搭建博客

    +使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    Blog
    <- 用 GitHub Action 自动化构建 Hexo 并发布到 S3
    如何手撕一个堆 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/introduction-for-k8s-2.html b/articles/introduction-for-k8s-2.html index 14faab71..0a9aa7ae 100644 --- a/articles/introduction-for-k8s-2.html +++ b/articles/introduction-for-k8s-2.html @@ -4,7 +4,7 @@ 其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？ 在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Kubernetes 入门 （2）

    Kubernetes
    DevOps
    Docker
    Cloud Native

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    +在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Kubernetes 入门 （2）

    Kubernetes
    DevOps
    Docker
    Cloud Native

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    储存

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    @@ -677,4 +677,4 @@

    各种工

    JOJO: 你到底想说什么？

    DIO: 我不用 kubectl apply 了！ JOJO ！ （其实还是要用的）

    -

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1） ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1） ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/introduction-for-k8s.html b/articles/introduction-for-k8s.html index 821aa28f..c338050e 100644 --- a/articles/introduction-for-k8s.html +++ b/articles/introduction-for-k8s.html @@ -4,7 +4,7 @@ > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》 "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Kubernetes 入门 （1）

    Kubernetes
    DevOps
    Docker
    Cloud Native

    容器， Docker 与 K8s

    +"Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Kubernetes 入门 （1）

    Kubernetes
    DevOps
    Docker
    Cloud Native

    容器， Docker 与 K8s

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    关于容器虚拟化

    @@ -451,4 +451,4 @@

    Job 与 CronJob

    另外我们已经知道 Deployment 等资源一般会通过标签等来管理自己创建的资源，那两份不相关的应用完全有可能会撞标签，这时候部署逻辑就有可能会出问题。

    K8s 中提供了名称空间这种资源，用于进行资源隔离。K8s 中大部分资源都从属于一个且仅从属于一个名称空间， Deployment 等资源一般只能控制在同一名称空间下的资源，而不会影响其他名称空间。

    另外，也有一些资源是名称空间无关的，比如节点 Node 。

    -
    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    Kubernetes
    DevOps
    Docker
    Cloud Native
    <- Kubernetes 入门 （2）
    为什么使用在齐次坐标下矩阵乘法能表示点平移？ ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    Kubernetes
    DevOps
    Docker
    Cloud Native
    <- Kubernetes 入门 （2）
    为什么使用在齐次坐标下矩阵乘法能表示点平移？ ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/python-dict.html b/articles/python-dict.html index f0655a0e..a3da47f2 100644 --- a/articles/python-dict.html +++ b/articles/python-dict.html @@ -4,7 +4,7 @@ 以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？ 这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Python字典的实现原理

    Python
    数据结构
    +这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Python字典的实现原理

    Python
    数据结构

    CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

    前言

    @@ -90,4 +90,4 @@

    参考文献

  • python3.7源码分析－字典_小屋子大侠的博客-CSDN博客_python 字典源码
  • 《深度剖析CPython解释器》9. 解密Python中字典和集合的底层实现，深度分析哈希表
  • CPython 源码阅读 - dict
    • -
    Python
    数据结构
    <- 排序算法
    C++中using关键字的使用 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    Python
    数据结构
    <- 排序算法
    C++中using关键字的使用 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/the-using-in-cpp.html b/articles/the-using-in-cpp.html index cc7e3561..676a6dd8 100644 --- a/articles/the-using-in-cpp.html +++ b/articles/the-using-in-cpp.html @@ -4,7 +4,7 @@ 不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。 ```C++"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    C++中using关键字的使用

    C++
    杂技

    using的用法

    + ```C++"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    C++
    杂技
    <- Python字典的实现原理
    搭建博客的过程 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    能做到类似别名功能的，还有宏#define。但#define运行在编译前的宏处理阶段，对代码进行字符串替换。没有类型检查或其他编译、链接阶段才能进行的检查，不具备安全性。在C++11中不提倡使用#define。

    C++
    杂技
    <- Python字典的实现原理
    搭建博客的过程 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/use-paste-image-and-vscode-memo.html b/articles/use-paste-image-and-vscode-memo.html index abc79f64..56f95597 100644 --- a/articles/use-paste-image-and-vscode-memo.html +++ b/articles/use-paste-image-and-vscode-memo.html @@ -4,7 +4,7 @@ 可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。 vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于："/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    完善 Hexo 编写环境，改善文章中使用图片的体验

    Blog
    VSCode
    Hexo
    JavaScript

    我平时使用 vscode-memo 插件写笔记，其中插入图片使用 ![[]] 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    +vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于："/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    完善 Hexo 编写环境，改善文章中使用图片的体验

    Blog
    VSCode
    Hexo
    JavaScript

    我平时使用 vscode-memo 插件写笔记，其中插入图片使用 ![[]] 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    关于 vscode-memo

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 Obsidian.md 等软件。其功能包括且不限于：

    @@ -111,4 +111,4 @@

    补充

    └───_posts ├───2022-03-26-create-blog-cicd-by-github.md └───2022-04-03-use-paste-image-and-vscode-memo.md
    -

    可以通过在代码中引用 data.source 解决。

    Blog
    VSCode
    Hexo
    JavaScript
    <- 图解经济学原理(1)
    用 GitHub Action 自动化构建 Hexo 并发布到 S3 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    可以通过在代码中引用 data.source 解决。

    Blog
    VSCode
    Hexo
    JavaScript
    <- 图解经济学原理(1)
    用 GitHub Action 自动化构建 Hexo 并发布到 S3 ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/articles/why-homogeneous.html b/articles/why-homogeneous.html index 711d02b8..1e8d9f51 100644 --- a/articles/why-homogeneous.html +++ b/articles/why-homogeneous.html @@ -4,7 +4,7 @@ 也就是说，对于空间中所有向量 $$\vec{v_1}, \vec{v_2}$$ ，以及任意数量 $$k_1, k_2$$ ，如果有： $$"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    为什么使用在齐次坐标下矩阵乘法能表示点平移？

    首先，什么是线性变换？

    +$$"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    为什么使用在齐次坐标下矩阵乘法能表示点平移？

    首先，什么是线性变换？

    简化了一万倍来说，线性变换主要是在描述符合这两种性质的变换：一是要可加，二是要能数乘。 也就是说，对于空间中所有向量 v1⃗,v2⃗\vec{v_1}, \vec{v_2}

    Q: 为什么普通的矩阵乘法不能表示平移？ A: 因为矩阵乘法只能表示线性变换。平移不是线性变换。

    Q: 为什么在齐次坐标下的矩阵乘法又能表示平移？ -A: 因为齐次坐标增加了一个维度。平移变换矩阵其实是在新增的这个维度上做切变（一种线性变换）。切变后的结果正好就是原坐标中的平移变换。

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    <- Kubernetes 入门 （1）
    图解经济学原理(2) ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +A: 因为齐次坐标增加了一个维度。平移变换矩阵其实是在新增的这个维度上做切变（一种线性变换）。切变后的结果正好就是原坐标中的平移变换。

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    <- Kubernetes 入门 （1）
    图解经济学原理(2) ->
    Loading comments...
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/clips.html b/clips.html index 20dca57e..246b5d2b 100644 --- a/clips.html +++ b/clips.html @@ -1 +1 @@ -Clips | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    opentelemetry-specification/data-model.md at main · open-telemetry/opentelemetry-specification
    logging
    Observability
    Storage | Grafana Loki documentation
    logging
    Observability
    Thanos - Highly available Prometheus setup with long term storage capabilities
    Observability
    Metrics
    Building an Observability Solution with ClickHouse in 2023 - Part 1 - Logs
    Clickhouse
    logging
    Observability
    通过视频片段来学习英语
    Learning
    单词本
    vectordotdev/vector: A high-performance observability data pipeline.
    Tool
    Observability
    Fast and Reliable Schema-Agnostic Log Analytics Platform | Uber Blog
    Clickhouse
    logging
    Observability
    Building an Observability Solution with ClickHouse in 2023 - Part 1 - Logs
    Clickhouse
    logging
    Observability
    byoungd/English-level-up-tips: An advanced guide to learn English which might benefit you a lot 🎉 . 可能是让你受益匪浅的英语进阶指南。
    Learning
    R.E.C@画集発売中🦋 在 Twitter: "【配色のコツ】 配色はとても難しいです、背景に空気感が出ない、色の使い方がわからない方向けです。青空、夕焼けから銀河まで文字通り空気の色をベタで表示しました。そのままカラーパレットとしてお使い頂くこともできます。 https://t.co/7cc0iO4vUk" / Twitter
    Painting
    配色
    Fast and Reliable Schema-Agnostic Log Analytics Platform | Uber Blog
    Clickhouse
    logging
    B站基于Clickhouse的下一代日志体系建设实践 - 哔哩哔哩
    Clickhouse
    Tutorial: Setting up an IPFS peer, part I | by Carson Farmer | Textile | Medium
    ipfs
    Tutorial: Setting up an IPFS peer, part II | by Carson Farmer | Textile | Medium
    ipfs
    New infrastructure, who dis? Elastic IPFS in production for NFT.Storage
    ipfs
    UDPA最新进展深度介绍 | 敖小剑的博客
    ServiceMesh
    Service Mesh Interface详细介绍 | 敖小剑的博客
    ServiceMesh
    SMI
    kubernetes - Istio vs Service Mesh Interface - Stack Overflow
    ServiceMesh
    Istio 1.12 引入 Wasm 插件配置 API 用于扩展 Istio 生态 | 云原生社区（中国）
    ServiceMesh
    告别 Sidecar——使用 eBPF 解锁内核级服务网格 | 云原生社区（中国）
    ServiceMesh
    在 Istio 中引入 Wasm 意味着什么？ | 云原生社区（中国）
    ServiceMesh
    为什么需要可编程代理 | 云原生社区（中国）
    ServiceMesh
    服务网格峰会回顾：服务网格的发展趋势 | 云原生社区（中国）
    ServiceMesh
    都 2021 年了，对于服务网格，社区到底在讨论什么？ | 云原生社区（中国）
    ServiceMesh
    K8s Service Mesh Comparison: Linkerd, Consul, Istio & More | Toptal®
    ServiceMesh
    Rust/WebAssembly on AWS Lambda@Edge (CloudFront) | markentier.tech
    Tool
    Wasm
    Snipaste Downloads
    Tool
    KawaiiSensei@絵のレシピ動画さんはTwitterを使っています: 「印象を変えない閉じ目を描きたい人へ👀 https://t.co/ReoarJIoxQ」 / Twitter
    Kubo | IPFS Docs
    ipfs
    ブックマーク管理で「Save to Notion」が最適な理由【タグ付け可】
    Tag1
    Is it possible to save and tag with the web clipper? : Notion #Tag1
    childe/gohangout: 使用 golang 模仿的 Logstash。用于消费 Kafka 数据，处理后写入 ES、Clickhouse 等。
    Log analytics using ClickHouse
    魔鬼存在于细节中：从Redshift迁移到ClickHouse后再无数据丢失_大数据_MATVEY KRUGLOV_InfoQ精选文章
    看云上 ClickHouse 如何做计算存储分离 - 腾讯云开发者社区-腾讯云
    探索ClickHouse与Amazon S3结合使用的三种方法 | 亚马逊AWS官方博客
    夢野ヨウ lit.link(リットリンク)
    Amazon S3 – Object Expiration | AWS News Blog
    The Book of Shaders: Running your shader
    【React Three Fiber】魚眼レンズのようなVertex Shaderの実装 - Qiita
    Next.js で Markdown 中の画像を next/image に対応させる
    unified を使って Markdown を拡張する
    Rehype Pretty Code
    Remark で広げる Markdown の世界
    Next.jsでブログをつくった
    hashicorp/next-mdx-remote: Load mdx content from anywhere through getStaticProps in next.js
    Next.jsでブログをつくった
    Trait object can not be shared between threads safely - The Rust Programming Language Forum
    Trait object can not be shared between threads safely - The Rust Programming Language Forum
    rust - Struct that owns some data and a reference to the data - Stack Overflow
    重新理解 Web - 知乎
    Patten-defeating Quicksort.pdf
    Characteristics of Object-Oriented Languages - The Rust Programming Language
    2106.05123.pdf
    Configure 3D models with react-three-fiber - LogRocket Blog
    【React Three Fiber】魚眼レンズのようなVertex Shaderの実装 - Qiita
    【React Three Fiber】魚眼レンズのようなVertex Shaderの実装 - Qiita
    治安のいいOpenAPIの開発環境を作る - バイセル Tech Blog
    Reactで3D表現！react-three-fiberを使ってみよう | tamalog
    The Book of Shaders
    The Book of Shaders
    深度探索分布式理论经典论文 – duanple
    Log Structured Merge Trees(LSM) 原理 - LSM - 软件开发 - 深度开源
    QCon直击｜闲鱼推荐大规模应用背后的工程实践
    Lucene 倒排索引原理 - 掘金
    Lucene 查询原理及解析_数据库_木洛_InfoQ精选文章
    java - 深度解析 Lucene 轻量级全文索引实现原理_个人文章 - SegmentFault 思否
    grpc实现流量染色_hzzyu的博客-CSDN博客_流量染色什么意思
    gRPC Go 服务发现与负载均衡(更新版) :: Cong
    【ClickHouse为什么这么快？】MergeTree 表存储引擎图文实例详解 - 墨天轮
    ClickHouse 中最重要的表引擎：MergeTree 的深度原理解析 - 古明地盆 - 博客园
    Customize scraping of Prometheus metrics in Azure Monitor (preview) - Azure Monitor | Microsoft Learn
    Prometheus: monitoring services using additional scrape config for Prometheus Operator | Fabian Lee : Software Engineer
    塗りの考え方も伝授！ 艶っぽいお腹の塗り方メイキング | いちあっぷ
    ホーム / Twitter
    Document
    Kubernetes最佳实践（四）：资源请求和限制 - DockOne.io
    agxp/CloudFlix: Highly scalable video streaming website built with microservices (Go, Docker, Kubernetes, PostgreSQL, gRPC, Redis, RabbitMQ, Prometheus, Grafana, Jaeger/Zipkin)
    佐透直 lit.link(リットリンク)
    Learn these keyboard shortcuts to become a VS Code ninja - LogRocket Blog
    ClipDrop - Relight
    Choosing between SQS, SNS, Kinesis, and EventBridge - Better Dev
    深入浅出Prometheus：原理、应用、源码与拓展详解 - 陈晓宇, 杨川胡, 陈啸编著 - Google 图书
    【Service Mesh基础】Envoy-入门介绍与xDS协议 - 知乎
    【Service Mesh基础】Envoy-入门介绍与xDS协议 - 知乎
    Istio：xDS协议解析-阿里云开发者社区
    调整卷大小后扩展 Linux 文件系统 - Amazon Elastic Compute Cloud
    Stash - Backup and Recovery Solution for Kubernetes
    序言 - istio 实践指南
    Web UI (Dashboard) | Kubernetes
    sony/gobreaker: Circuit Breaker implemented in Go
    Amazon EKS アドオンで Amazon EBS CSI ドライバーが一般利用可能になりました | Amazon Web Services ブログ
    Amazon EKS クラスターの EBS ボリュームを gp2 から gp3 に移行する | Amazon Web Services ブログ
    fluxcd/flux2: Open and extensible continuous delivery solution for Kubernetes. Powered by GitOps Toolkit.
    Flagger
    ClickHouse Better Practices - 简书
    无缝更改ClickHouse物化视图SELECT逻辑的方法 - 简书
    ClickHouse - 文集 - 简书
    NFT Game Development — How to Build an NFT Game App in Minutes » Moralis » The Web3 Development Workflow
    《GAMES101》作业框架问题详解 - 知乎
    umbracle/ethgo: Ethereum Golang API
    sql - Grant privileges on future tables in PostgreSQL? - Stack Overflow
    Kafka - Fluent Bit 中文文档
    Opensea上架费用整理 - 知乎
    倒排索引 | Elasticsearch: 权威指南 | Elastic
    TOP | スキマ - スキルのオーダーメイドマーケット - SKIMA
    tRPC - End-to-end typesafe APIs made easy | tRPC
    Kubernetes Operators and Helm — It takes Two to Tango | by CloudARK | Medium
    OpenTelemetry项目解读 - 墨天轮
    ヘブンバーンズレッド 公式サイト
    Serverless アプリケーションをローカルで開発する - Qiita
    My Journey with Pulumi and the Serverless Framework | by Louis Latreille | Level Up Coding
    Serverless Framework Documentation
    还在用ES查日志吗，快看看石墨文档 Clickhouse 日志架构玩法_开源_彭友顺@石墨文档_InfoQ精选文章
    对 Rust 语言的分析
    prometheus k8s服务发现 | qsing`s blog
    grpc-ecosystem/go-grpc-prometheus: Prometheus monitoring for your gRPC Go servers.
    PromLabs | Blog - How Exactly Does PromQL Calculate Rates?
    grpc-ecosystem/go-grpc-prometheus: Prometheus monitoring for your gRPC Go servers.
    Go进阶45:Golang-logrus简单的日志收集系统(替代ELKB) | 🐶❤️🦀
    Library Genesis
    Go gRPC Clean architecture microservice with Prometheus, Grafana monitoring and Jaeger opentracing ⚡️ - DEV Community
    Warp: The terminal for the 21st century
    Home · twintproject/twint Wiki
    Terraform —— 使用代码管理基础设施 | wzyboy’s blog
    Foundation
    Library Genesis
    国盛证券-区块链行业专题研究-元宇宙(九)：NFT的升维，元宇宙的进化-220402.pdf
    国盛证券-区块链行业-通往Web3.0的入口：零知识证明与EVM-220430.pdf
    国盛证券-区块链行业专题研究：Web3.0时代，开放、隐私、共建-220110.pdf
    国盛证券-区块链行业-通往Web3.0的入口：零知识证明与EVM-220430.pdf
    sql - Query and count on jsonb column - Stack Overflow
    JSONB PostgreSQL: How to Store & Index JSON Data
    Golang: xo + sqlx | GiFT（ギフト）株式会社
    GoMock vs. Testify: Mocking frameworks for Go - codecentric AG Blog
    gin-swagger 生成RESTful风格OpenAPI文档 - 掘金
    Favicon Generator - Text to Favicon - favicon.io
    使用官方在线版 - PushDeer·推送说明
    p3072-huang.pdf
    Tetrate 学院 | Istio 基础教程
    Create an Hexo Theme - Part 1: Index - CodeBlocQ
    使用 Next.js + Hexo 重构我的博客 | Sukka's Blog
    hugo2046/Quantitative-analysis: 量化研究-券商金工研报复现
    Mit 6.830 lab 索引 - 知乎
    手把手教你使用Amazon EMR进行交互式数据查询 | 亚马逊AWS官方博客
    修复 CI 构建博客造成的更新时间错误 - Sea's Blog
    obsidian文章发布到hexo攻略 - 简书
    Markdown Memo - Visual Studio Marketplace
    Obsidian
    Prometheus 是什么 · Prometheus 实战
    Go 语言并发编程与 Context | Go 语言设计与实现
    Google File System-GFS 论文阅读 - Spongecaptain 的个人技术博客
    2019年的云原生市场：K8s周边创新不断，技术生态得到完善--软件与服务频道-至顶网
    前言 · 《k8s-1.13版本源码分析》
    go mod 和 go vendor 使用与区别 - 知乎
    kubernetes - Accessing MSK cluster from a service running in EKS - Stack Overflow
    amazon eks - How connect to MSK cluster from EKS cluster - Stack Overflow
    How Goldman Sachs builds cross-account connectivity to their Amazon MSK clusters with AWS PrivateLink | AWS Big Data Blog
    胡伟煌 | Blog
    AWS PrivateLink for Amazon S3 - Amazon Simple Storage Service
    自建服务器解决外网访问内网的端口穿透映射 - 米扑博客
    搭建内网穿透服务器，带Web面板-阿里云开发者社区
    淘宝二面，面试官居然把TCP三次握手问的这么详细-面包板社区
    Odyssey DAO - Your Web3 Learning Odyssey Awaits
    Amazon Web Services Guide — Ansible Documentation
    凤凰架构：构筑可靠的大型分布式系统 | 凤凰架构
    序言 · Kubernetes Handbook - Kubernetes 中文指南/云原生应用架构实践手册 · Jimmy Song
    Posts
    GitHub Actions Self-Hosted Runner 优化——Golang 相关内网缓存
    GitHub Actions Self-Hosted Runner 优化——Golang 相关内网缓存
    [WeiDesign]微博计数器的设计(下) · Cydu's Blog
    MySQL索引原理及慢查询优化 - 美团技术团队
    Ruby: collect, detect, inject, reject, select | 孙耀珠的博客
    CSS 预处理的区别的深度比较 - Stylus/Sass/Less - 简书
    nils in Go - Go 101: an online Go programming book + knowledge base
    ZeroTier – Global Area Networking
    布隆过滤器(Bloom Filter)的原理和实现 - cpselvis - 博客园
    Taking Arms Against A Sea of Objects
    迷之方法论
    12 Factor App in Action （12 要素应用实战） - 知乎
    Commit message 和 Change log 编写指南 - 阮一峰的网络日志
    spf13/viper: Go configuration with fangs
    spf13/cobra: A Commander for modern Go CLI interactions
    Practical API Design at Netflix, Part 1: Using Protobuf FieldMask | by Netflix Technology Blog | Sep, 2021 | Netflix TechBlog
    xxjwxc/uber_go_guide_cn: Uber Go 语言编码规范中文版. The Uber Go Style Guide .
    How to unit test a Go Gin handler function? - Stack Overflow
    使用 SSH 连接到 GitHub - GitHub Docs
    【opentracing】概念术语文档：Span，trace
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Clips | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    opentelemetry-specification/data-model.md at main · open-telemetry/opentelemetry-specification
    logging
    Observability
    Storage | Grafana Loki documentation
    logging
    Observability
    Thanos - Highly available Prometheus setup with long term storage capabilities
    Observability
    Metrics
    Building an Observability Solution with ClickHouse in 2023 - Part 1 - Logs
    Clickhouse
    logging
    Observability
    通过视频片段来学习英语
    Learning
    单词本
    vectordotdev/vector: A high-performance observability data pipeline.
    Tool
    Observability
    Fast and Reliable Schema-Agnostic Log Analytics Platform | Uber Blog
    Clickhouse
    logging
    Observability
    Building an Observability Solution with ClickHouse in 2023 - Part 1 - Logs
    Clickhouse
    logging
    Observability
    byoungd/English-level-up-tips: An advanced guide to learn English which might benefit you a lot 🎉 . 可能是让你受益匪浅的英语进阶指南。
    Learning
    R.E.C@画集発売中🦋 在 Twitter: "【配色のコツ】 配色はとても難しいです、背景に空気感が出ない、色の使い方がわからない方向けです。青空、夕焼けから銀河まで文字通り空気の色をベタで表示しました。そのままカラーパレットとしてお使い頂くこともできます。 https://t.co/7cc0iO4vUk" / Twitter
    Painting
    配色
    Fast and Reliable Schema-Agnostic Log Analytics Platform | Uber Blog
    Clickhouse
    logging
    B站基于Clickhouse的下一代日志体系建设实践 - 哔哩哔哩
    Clickhouse
    Tutorial: Setting up an IPFS peer, part I | by Carson Farmer | Textile | Medium
    ipfs
    Tutorial: Setting up an IPFS peer, part II | by Carson Farmer | Textile | Medium
    ipfs
    New infrastructure, who dis? Elastic IPFS in production for NFT.Storage
    ipfs
    UDPA最新进展深度介绍 | 敖小剑的博客
    ServiceMesh
    Service Mesh Interface详细介绍 | 敖小剑的博客
    ServiceMesh
    SMI
    kubernetes - Istio vs Service Mesh Interface - Stack Overflow
    ServiceMesh
    Istio 1.12 引入 Wasm 插件配置 API 用于扩展 Istio 生态 | 云原生社区（中国）
    ServiceMesh
    告别 Sidecar——使用 eBPF 解锁内核级服务网格 | 云原生社区（中国）
    ServiceMesh
    在 Istio 中引入 Wasm 意味着什么？ | 云原生社区（中国）
    ServiceMesh
    为什么需要可编程代理 | 云原生社区（中国）
    ServiceMesh
    服务网格峰会回顾：服务网格的发展趋势 | 云原生社区（中国）
    ServiceMesh
    都 2021 年了，对于服务网格，社区到底在讨论什么？ | 云原生社区（中国）
    ServiceMesh
    K8s Service Mesh Comparison: Linkerd, Consul, Istio & More | Toptal®
    ServiceMesh
    Rust/WebAssembly on AWS Lambda@Edge (CloudFront) | markentier.tech
    Tool
    Wasm
    Snipaste Downloads
    Tool
    KawaiiSensei@絵のレシピ動画さんはTwitterを使っています: 「印象を変えない閉じ目を描きたい人へ👀 https://t.co/ReoarJIoxQ」 / Twitter
    Kubo | IPFS Docs
    ipfs
    ブックマーク管理で「Save to Notion」が最適な理由【タグ付け可】
    Tag1
    Is it possible to save and tag with the web clipper? : Notion #Tag1
    childe/gohangout: 使用 golang 模仿的 Logstash。用于消费 Kafka 数据，处理后写入 ES、Clickhouse 等。
    Log analytics using ClickHouse
    魔鬼存在于细节中：从Redshift迁移到ClickHouse后再无数据丢失_大数据_MATVEY KRUGLOV_InfoQ精选文章
    看云上 ClickHouse 如何做计算存储分离 - 腾讯云开发者社区-腾讯云
    探索ClickHouse与Amazon S3结合使用的三种方法 | 亚马逊AWS官方博客
    夢野ヨウ lit.link(リットリンク)
    Amazon S3 – Object Expiration | AWS News Blog
    The Book of Shaders: Running your shader
    【React Three Fiber】魚眼レンズのようなVertex Shaderの実装 - Qiita
    Next.js で Markdown 中の画像を next/image に対応させる
    unified を使って Markdown を拡張する
    Rehype Pretty Code
    Remark で広げる Markdown の世界
    Next.jsでブログをつくった
    hashicorp/next-mdx-remote: Load mdx content from anywhere through getStaticProps in next.js
    Next.jsでブログをつくった
    Trait object can not be shared between threads safely - The Rust Programming Language Forum
    Trait object can not be shared between threads safely - The Rust Programming Language Forum
    rust - Struct that owns some data and a reference to the data - Stack Overflow
    重新理解 Web - 知乎
    Patten-defeating Quicksort.pdf
    Characteristics of Object-Oriented Languages - The Rust Programming Language
    2106.05123.pdf
    Configure 3D models with react-three-fiber - LogRocket Blog
    【React Three Fiber】魚眼レンズのようなVertex Shaderの実装 - Qiita
    【React Three Fiber】魚眼レンズのようなVertex Shaderの実装 - Qiita
    治安のいいOpenAPIの開発環境を作る - バイセル Tech Blog
    Reactで3D表現！react-three-fiberを使ってみよう | tamalog
    The Book of Shaders
    The Book of Shaders
    深度探索分布式理论经典论文 – duanple
    Log Structured Merge Trees(LSM) 原理 - LSM - 软件开发 - 深度开源
    QCon直击｜闲鱼推荐大规模应用背后的工程实践
    Lucene 倒排索引原理 - 掘金
    Lucene 查询原理及解析_数据库_木洛_InfoQ精选文章
    java - 深度解析 Lucene 轻量级全文索引实现原理_个人文章 - SegmentFault 思否
    grpc实现流量染色_hzzyu的博客-CSDN博客_流量染色什么意思
    gRPC Go 服务发现与负载均衡(更新版) :: Cong
    【ClickHouse为什么这么快？】MergeTree 表存储引擎图文实例详解 - 墨天轮
    ClickHouse 中最重要的表引擎：MergeTree 的深度原理解析 - 古明地盆 - 博客园
    Customize scraping of Prometheus metrics in Azure Monitor (preview) - Azure Monitor | Microsoft Learn
    Prometheus: monitoring services using additional scrape config for Prometheus Operator | Fabian Lee : Software Engineer
    塗りの考え方も伝授！ 艶っぽいお腹の塗り方メイキング | いちあっぷ
    ホーム / Twitter
    Document
    Kubernetes最佳实践（四）：资源请求和限制 - DockOne.io
    agxp/CloudFlix: Highly scalable video streaming website built with microservices (Go, Docker, Kubernetes, PostgreSQL, gRPC, Redis, RabbitMQ, Prometheus, Grafana, Jaeger/Zipkin)
    佐透直 lit.link(リットリンク)
    Learn these keyboard shortcuts to become a VS Code ninja - LogRocket Blog
    ClipDrop - Relight
    Choosing between SQS, SNS, Kinesis, and EventBridge - Better Dev
    深入浅出Prometheus：原理、应用、源码与拓展详解 - 陈晓宇, 杨川胡, 陈啸编著 - Google 图书
    【Service Mesh基础】Envoy-入门介绍与xDS协议 - 知乎
    【Service Mesh基础】Envoy-入门介绍与xDS协议 - 知乎
    Istio：xDS协议解析-阿里云开发者社区
    调整卷大小后扩展 Linux 文件系统 - Amazon Elastic Compute Cloud
    Stash - Backup and Recovery Solution for Kubernetes
    序言 - istio 实践指南
    Web UI (Dashboard) | Kubernetes
    sony/gobreaker: Circuit Breaker implemented in Go
    Amazon EKS アドオンで Amazon EBS CSI ドライバーが一般利用可能になりました | Amazon Web Services ブログ
    Amazon EKS クラスターの EBS ボリュームを gp2 から gp3 に移行する | Amazon Web Services ブログ
    fluxcd/flux2: Open and extensible continuous delivery solution for Kubernetes. Powered by GitOps Toolkit.
    Flagger
    ClickHouse Better Practices - 简书
    无缝更改ClickHouse物化视图SELECT逻辑的方法 - 简书
    ClickHouse - 文集 - 简书
    NFT Game Development — How to Build an NFT Game App in Minutes » Moralis » The Web3 Development Workflow
    《GAMES101》作业框架问题详解 - 知乎
    umbracle/ethgo: Ethereum Golang API
    sql - Grant privileges on future tables in PostgreSQL? - Stack Overflow
    Kafka - Fluent Bit 中文文档
    Opensea上架费用整理 - 知乎
    倒排索引 | Elasticsearch: 权威指南 | Elastic
    TOP | スキマ - スキルのオーダーメイドマーケット - SKIMA
    tRPC - End-to-end typesafe APIs made easy | tRPC
    Kubernetes Operators and Helm — It takes Two to Tango | by CloudARK | Medium
    OpenTelemetry项目解读 - 墨天轮
    ヘブンバーンズレッド 公式サイト
    Serverless アプリケーションをローカルで開発する - Qiita
    My Journey with Pulumi and the Serverless Framework | by Louis Latreille | Level Up Coding
    Serverless Framework Documentation
    还在用ES查日志吗，快看看石墨文档 Clickhouse 日志架构玩法_开源_彭友顺@石墨文档_InfoQ精选文章
    对 Rust 语言的分析
    prometheus k8s服务发现 | qsing`s blog
    grpc-ecosystem/go-grpc-prometheus: Prometheus monitoring for your gRPC Go servers.
    PromLabs | Blog - How Exactly Does PromQL Calculate Rates?
    grpc-ecosystem/go-grpc-prometheus: Prometheus monitoring for your gRPC Go servers.
    Go进阶45:Golang-logrus简单的日志收集系统(替代ELKB) | 🐶❤️🦀
    Library Genesis
    Go gRPC Clean architecture microservice with Prometheus, Grafana monitoring and Jaeger opentracing ⚡️ - DEV Community
    Warp: The terminal for the 21st century
    Home · twintproject/twint Wiki
    Terraform —— 使用代码管理基础设施 | wzyboy’s blog
    Foundation
    Library Genesis
    国盛证券-区块链行业专题研究-元宇宙(九)：NFT的升维，元宇宙的进化-220402.pdf
    国盛证券-区块链行业-通往Web3.0的入口：零知识证明与EVM-220430.pdf
    国盛证券-区块链行业专题研究：Web3.0时代，开放、隐私、共建-220110.pdf
    国盛证券-区块链行业-通往Web3.0的入口：零知识证明与EVM-220430.pdf
    sql - Query and count on jsonb column - Stack Overflow
    JSONB PostgreSQL: How to Store & Index JSON Data
    Golang: xo + sqlx | GiFT（ギフト）株式会社
    GoMock vs. Testify: Mocking frameworks for Go - codecentric AG Blog
    gin-swagger 生成RESTful风格OpenAPI文档 - 掘金
    Favicon Generator - Text to Favicon - favicon.io
    使用官方在线版 - PushDeer·推送说明
    p3072-huang.pdf
    Tetrate 学院 | Istio 基础教程
    Create an Hexo Theme - Part 1: Index - CodeBlocQ
    使用 Next.js + Hexo 重构我的博客 | Sukka's Blog
    hugo2046/Quantitative-analysis: 量化研究-券商金工研报复现
    Mit 6.830 lab 索引 - 知乎
    手把手教你使用Amazon EMR进行交互式数据查询 | 亚马逊AWS官方博客
    修复 CI 构建博客造成的更新时间错误 - Sea's Blog
    obsidian文章发布到hexo攻略 - 简书
    Markdown Memo - Visual Studio Marketplace
    Obsidian
    Prometheus 是什么 · Prometheus 实战
    Go 语言并发编程与 Context | Go 语言设计与实现
    Google File System-GFS 论文阅读 - Spongecaptain 的个人技术博客
    2019年的云原生市场：K8s周边创新不断，技术生态得到完善--软件与服务频道-至顶网
    前言 · 《k8s-1.13版本源码分析》
    go mod 和 go vendor 使用与区别 - 知乎
    kubernetes - Accessing MSK cluster from a service running in EKS - Stack Overflow
    amazon eks - How connect to MSK cluster from EKS cluster - Stack Overflow
    How Goldman Sachs builds cross-account connectivity to their Amazon MSK clusters with AWS PrivateLink | AWS Big Data Blog
    胡伟煌 | Blog
    AWS PrivateLink for Amazon S3 - Amazon Simple Storage Service
    自建服务器解决外网访问内网的端口穿透映射 - 米扑博客
    搭建内网穿透服务器，带Web面板-阿里云开发者社区
    淘宝二面，面试官居然把TCP三次握手问的这么详细-面包板社区
    Odyssey DAO - Your Web3 Learning Odyssey Awaits
    Amazon Web Services Guide — Ansible Documentation
    凤凰架构：构筑可靠的大型分布式系统 | 凤凰架构
    序言 · Kubernetes Handbook - Kubernetes 中文指南/云原生应用架构实践手册 · Jimmy Song
    Posts
    GitHub Actions Self-Hosted Runner 优化——Golang 相关内网缓存
    GitHub Actions Self-Hosted Runner 优化——Golang 相关内网缓存
    [WeiDesign]微博计数器的设计(下) · Cydu's Blog
    MySQL索引原理及慢查询优化 - 美团技术团队
    Ruby: collect, detect, inject, reject, select | 孙耀珠的博客
    CSS 预处理的区别的深度比较 - Stylus/Sass/Less - 简书
    nils in Go - Go 101: an online Go programming book + knowledge base
    ZeroTier – Global Area Networking
    布隆过滤器(Bloom Filter)的原理和实现 - cpselvis - 博客园
    Taking Arms Against A Sea of Objects
    迷之方法论
    12 Factor App in Action （12 要素应用实战） - 知乎
    Commit message 和 Change log 编写指南 - 阮一峰的网络日志
    spf13/viper: Go configuration with fangs
    spf13/cobra: A Commander for modern Go CLI interactions
    Practical API Design at Netflix, Part 1: Using Protobuf FieldMask | by Netflix Technology Blog | Sep, 2021 | Netflix TechBlog
    xxjwxc/uber_go_guide_cn: Uber Go 语言编码规范中文版. The Uber Go Style Guide .
    How to unit test a Go Gin handler function? - Stack Overflow
    使用 SSH 连接到 GitHub - GitHub Docs
    【opentracing】概念术语文档：Span，trace
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/content/ideas/blog-syntax.md b/content/ideas/blog-syntax.md index 9c25c8eb..514294a6 100644 --- a/content/ideas/blog-syntax.md +++ b/content/ideas/blog-syntax.md @@ -139,6 +139,15 @@ graph LR C -->|a=3| F[结果3] ``` +另一个 mermaid 流程图，同样类型不会冲突 + +```mermaid +graph TD + A((圆)) --> B([圆边]) + B --> C[(DB)] +``` + + mermaid 时序图 ```mermaid diff --git a/ideas.html b/ideas.html index ef866fb3..d043c7e3 100644 --- a/ideas.html +++ b/ideas.html @@ -1 +1 @@ -Ideas | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    博客语法渲染测试

    **加粗**

    *斜体*

    ***加粗斜体***

    Blog
    Nextjs
    About Chart.js

    Use Chart.js in React.

    Introduce:

    - Chart.js: https://github.com/chartjs/Chart.js

    用 Next.js 重构 blog ，TODO list

    - [x] 复写 markdown parse ，增加 latex 支持

    - [x] remark-math

    - [x] rehype-katex

    Blog
    Nextjs
    <No Title>

    hello! first idea here!

    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Ideas | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    博客语法渲染测试

    **加粗**

    *斜体*

    ***加粗斜体***

    Blog
    Nextjs
    About Chart.js

    Use Chart.js in React.

    Introduce:

    - Chart.js: https://github.com/chartjs/Chart.js

    用 Next.js 重构 blog ，TODO list

    - [x] 复写 markdown parse ，增加 latex 支持

    - [x] remark-math

    - [x] rehype-katex

    Blog
    Nextjs
    <No Title>

    hello! first idea here!

    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/ideas/blog-in-next.html b/ideas/blog-in-next.html index b11a9d3d..f29c335d 100644 --- a/ideas/blog-in-next.html +++ b/ideas/blog-in-next.html @@ -4,7 +4,7 @@ - [x] remark-math - [x] rehype-katex"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    用 Next.js 重构 blog ，TODO list

    Blog
    Nextjs

    blog todo

    + - [x] rehype-katex"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    Blog
    Nextjs
    <- About Chart.js
    <No Title> ->
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/ideas/blog-syntax.html b/ideas/blog-syntax.html index 32bec470..145cdf61 100644 --- a/ideas/blog-syntax.html +++ b/ideas/blog-syntax.html @@ -4,7 +4,7 @@ *斜体* ***加粗斜体***"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    博客语法渲染测试

    Blog
    Nextjs

    一级标题

    +***加粗斜体***"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +
    Blog
    Nextjs
    About Chart.js ->
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/ideas/first-idea.html b/ideas/first-idea.html index bd29568c..ccbd77f1 100644 --- a/ideas/first-idea.html +++ b/ideas/first-idea.html @@ -1,2 +1,2 @@ -<No Title> | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +<No Title> | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/ideas/newest.html b/ideas/newest.html index addc8c63..25d5e06f 100644 --- a/ideas/newest.html +++ b/ideas/newest.html @@ -4,7 +4,7 @@ 然后这里是第二行。 这里是一些内容。"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    Kubernetes 入门 （1）

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing

    这里是第一行， +这里是一些内容。"/>

    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +

    new lines!

    Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    <- <No Title>
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/ideas/using-chart-js.html b/ideas/using-chart-js.html index b7a1be45..e218995f 100644 --- a/ideas/using-chart-js.html +++ b/ideas/using-chart-js.html @@ -4,7 +4,7 @@ Introduce: - Chart.js: https://github.com/chartjs/Chart.js"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    About Chart.js

    testing for using chart js

    +- Chart.js: https://github.com/chartjs/Chart.js"/>
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips

    About Chart.js

    testing for using chart js

    Use Chart.js in React.

    Introduce:

      @@ -71,4 +71,4 @@

      remark-mdx-chartjs data: [4,2,11,8,6,1,4] backgroundColor: "rgba(53, 162, 235, 0.5)"

    But it's not written in TypeScript, and raising a TS7016 error. -So raise an issue, and wait for the type definition.

    <- 博客语法渲染测试
    用 Next.js 重构 blog ，TODO list ->
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +So raise an issue, and wait for the type definition.

    <- 博客语法渲染测试
    用 Next.js 重构 blog ，TODO list ->
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/index.html b/index.html index 407ada1d..eb2cb66b 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Ryo's Blog
    About Tech, Paint, and Games.
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Ryo's Blog
    About Tech, Paint, and Games.
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/sitemap.xml b/sitemap.xml index b53d8d9b..1f712740 100644 --- a/sitemap.xml +++ b/sitemap.xml @@ -1,52 +1,52 @@ -https://ryojerryyu.github.io/blog-next2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/clips2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/ideas2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/introduction-for-k8s-22024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/introduction-for-k8s2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/why-homogeneous2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/graph-for-economics-22024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/graph-for-economics-12024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/use-paste-image-and-vscode-memo2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/create-blog-cicd-by-github2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/init-a-new-hexo-project2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/Handy-heap-cheat-sheet2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/The-beauty-of-design-parten2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/Sort-algorithm2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/python-dict2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/the-using-in-cpp2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/Building-this-blog2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/articles/hello-world2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/ideas/blog-syntax2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/ideas/using-chart-js2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/ideas/blog-in-next2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/ideas/first-idea2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/ideas/newest2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/kubernetes2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/devops2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/docker2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/cloud-native2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/blog2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/vscode2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/hexo2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/javascript2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/github2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/aws2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/ci-cd2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/iac2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/数据结构2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/算法2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/算法竞赛2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/设计模式2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/笔记2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/排序2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/python2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/c++2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/杂技2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/杂谈2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/nextjs2024-04-15T16:42:33.530Zdaily0.7 -https://ryojerryyu.github.io/blog-next/tags/cloud-computing2024-04-15T16:42:33.530Zdaily0.7 +https://ryojerryyu.github.io/blog-next2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/clips2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/ideas2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/introduction-for-k8s-22024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/introduction-for-k8s2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/why-homogeneous2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/graph-for-economics-22024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/graph-for-economics-12024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/use-paste-image-and-vscode-memo2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/create-blog-cicd-by-github2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/init-a-new-hexo-project2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/Handy-heap-cheat-sheet2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/The-beauty-of-design-parten2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/Sort-algorithm2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/python-dict2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/the-using-in-cpp2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/Building-this-blog2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/articles/hello-world2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/ideas/blog-syntax2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/ideas/using-chart-js2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/ideas/blog-in-next2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/ideas/first-idea2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/ideas/newest2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/kubernetes2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/devops2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/docker2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/cloud-native2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/blog2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/vscode2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/hexo2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/javascript2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/github2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/aws2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/ci-cd2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/iac2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/数据结构2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/算法2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/算法竞赛2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/设计模式2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/笔记2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/排序2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/python2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/c++2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/杂技2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/杂谈2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/nextjs2024-04-15T16:55:00.898Zdaily0.7 +https://ryojerryyu.github.io/blog-next/tags/cloud-computing2024-04-15T16:55:00.898Zdaily0.7 \ No newline at end of file diff --git a/tags.html b/tags.html index 3b2865df..681d7a96 100644 --- a/tags.html +++ b/tags.html @@ -1 +1 @@ -Tags | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Tags | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/aws.html b/tags/aws.html index fd8233e9..f9aa9ebf 100644 --- a/tags/aws.html +++ b/tags/aws.html @@ -1 +1 @@ -AWS | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +AWS | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/blog.html b/tags/blog.html index 587a43d1..d03e480d 100644 --- a/tags/blog.html +++ b/tags/blog.html @@ -1 +1 @@ -Blog | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    博客语法渲染测试

    **加粗**

    *斜体*

    ***加粗斜体***

    Blog
    Nextjs
    用 Next.js 重构 blog ，TODO list

    - [x] 复写 markdown parse ，增加 latex 支持

    - [x] remark-math

    - [x] rehype-katex

    Blog
    Nextjs
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    init-a-new-hexo-project

    最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。

    对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。

    使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。

    Blog
    搭建博客的过程

    > “Stop Trying to Reinvent the Wheel.”

    参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。

    整个网站文件夹大致结构如下：

    杂技
    Blog
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Blog | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    博客语法渲染测试

    **加粗**

    *斜体*

    ***加粗斜体***

    Blog
    Nextjs
    用 Next.js 重构 blog ，TODO list

    - [x] 复写 markdown parse ，增加 latex 支持

    - [x] remark-math

    - [x] rehype-katex

    Blog
    Nextjs
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    init-a-new-hexo-project

    最近使用 hexo 搭建了一个博客，并打算挂载在 github page 上。

    对之前的那个博客进行替代，并将之前的文章逐渐搬移过来。

    使用的[这个主题](https://github.com/Yue-plus/hexo-theme-arknights)功能还是比较完善的。

    Blog
    搭建博客的过程

    > “Stop Trying to Reinvent the Wheel.”

    参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。

    整个网站文件夹大致结构如下：

    杂技
    Blog
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/c++.html b/tags/c++.html index 7f23e333..6a4631c2 100644 --- a/tags/c++.html +++ b/tags/c++.html @@ -1 +1 @@ -C++ | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    C++中using关键字的使用

    1. 引入整个命名空间中的成员

    不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。

    ```C++

    C++
    杂技
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +C++ | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    C++中using关键字的使用

    1. 引入整个命名空间中的成员

    不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。

    ```C++

    C++
    杂技
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/ci-cd.html b/tags/ci-cd.html index 843f3ecd..11fe6bea 100644 --- a/tags/ci-cd.html +++ b/tags/ci-cd.html @@ -1 +1 @@ -CI/CD | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +CI/CD | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/cloud-computing.html b/tags/cloud-computing.html index 101262a9..a0298183 100644 --- a/tags/cloud-computing.html +++ b/tags/cloud-computing.html @@ -1 +1 @@ -Cloud Computing | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Cloud Computing | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/cloud-native.html b/tags/cloud-native.html index 6d127d08..74e5d7de 100644 --- a/tags/cloud-native.html +++ b/tags/cloud-native.html @@ -1 +1 @@ -Cloud Native | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Cloud Native | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/devops.html b/tags/devops.html index 3de6fc73..448a3520 100644 --- a/tags/devops.html +++ b/tags/devops.html @@ -1 +1 @@ -DevOps | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +DevOps | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/docker.html b/tags/docker.html index 84ca17a9..e60bcd7b 100644 --- a/tags/docker.html +++ b/tags/docker.html @@ -1 +1 @@ -Docker | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Docker | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/github.html b/tags/github.html index cbf3c27d..38c85b3a 100644 --- a/tags/github.html +++ b/tags/github.html @@ -1 +1 @@ -GitHub | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +GitHub | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/hexo.html b/tags/hexo.html index 4f94b58c..0f86238f 100644 --- a/tags/hexo.html +++ b/tags/hexo.html @@ -1 +1 @@ -Hexo | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Hexo | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/iac.html b/tags/iac.html index 18471f6c..aa353bef 100644 --- a/tags/iac.html +++ b/tags/iac.html @@ -1 +1 @@ -IaC | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +IaC | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    用 GitHub Action 自动化构建 Hexo 并发布到 S3

    GitHub Action 自动化构建发布到 GitHub Pages 大家都见得多了，甚至 Hexo 官方自己都有相关的文档。

    但我今天要做的不是发布到 GitHub 这么简单，而是要同时发布到 GitHub 和自己的域名下。

    我们需要构建一个 CI/CD 过程。这个过程需要做到以下目标：

    Blog
    GitHub
    AWS
    CI/CD
    IaC
    DevOps
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/javascript.html b/tags/javascript.html index 792ba2ec..35cfb17d 100644 --- a/tags/javascript.html +++ b/tags/javascript.html @@ -1 +1 @@ -JavaScript | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +JavaScript | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/kubernetes.html b/tags/kubernetes.html index 4723cc40..0572c577 100644 --- a/tags/kubernetes.html +++ b/tags/kubernetes.html @@ -1 +1 @@ -Kubernetes | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Kubernetes | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Kubernetes 入门 （2）

    我们之前说的都是用于部署 Pod 的资源，我们接下来介绍与创建 Pod 不相关的资源：储存与网络。

    其实我们之前已经接触过储存相关的内容了：在讲 Stateful Set 时我们提过 Stateful Set 创建出来的 Pod 都会有相互独立的储存；而讲 Daemon Set 时我们提到 K8s 推荐只在 Daemon Set 的 Pod 中访问宿主机磁盘。但独立的储存具体指什么？除了访问宿主机磁盘以外还有什么其他的储存？

    在 Docker 中，我们可以把宿主机磁盘上的一个路径作为一个 Volume 来给容器绑定，或者直接使用 Docker Engine 管理的 Volume 来提供持久化存储或是容器间共享文件。在 K8s 里面也沿用了 Volume 这个概念，可以通过 Mount 绑定到容器内的路径，并通过实现 CSI 的各种引擎来提供更多样的存储。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    我们知道 K8s 利用了容器虚拟化技术。而说到容器虚拟化就要说 Docker 。可是，容器到底是什么？ Docker 又为我们做了些什么？我们又为什么要用 K8s ？

    > 要把一个不知道打过多少个升级补丁，不知道经历了多少任管理员的系统迁移到其他机器上，毫无疑问会是一场灾难。 —— Chad Fowler 《Trash Your Servers and Burn Your Code》

    "Write once, run anywhere" 是 Java 曾经的口号。 Java 企图通过 JVM 虚拟机来实现一个可执行程序在多平台间的移植性。但我们现在知道， Java 语言并没能实现他的目标，会在操作系统调用、第三方依赖丢失、两个程序间依赖的冲突等各方面出现问题。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Kubernetes 入门 （1）

    这里是第一行，

    然后这里是第二行。

    这里是一些内容。

    Kubernetes
    DevOps
    Docker
    Cloud Native
    Cloud Computing
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/nextjs.html b/tags/nextjs.html index b77c7d37..60e6f674 100644 --- a/tags/nextjs.html +++ b/tags/nextjs.html @@ -1 +1 @@ -Nextjs | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    博客语法渲染测试

    **加粗**

    *斜体*

    ***加粗斜体***

    Blog
    Nextjs
    用 Next.js 重构 blog ，TODO list

    - [x] 复写 markdown parse ，增加 latex 支持

    - [x] remark-math

    - [x] rehype-katex

    Blog
    Nextjs
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Nextjs | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    博客语法渲染测试

    **加粗**

    *斜体*

    ***加粗斜体***

    Blog
    Nextjs
    用 Next.js 重构 blog ，TODO list

    - [x] 复写 markdown parse ，增加 latex 支持

    - [x] remark-math

    - [x] rehype-katex

    Blog
    Nextjs
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/python.html b/tags/python.html index 4f6ac286..2386c6f2 100644 --- a/tags/python.html +++ b/tags/python.html @@ -1 +1 @@ -Python | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Python字典的实现原理

    > CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

    以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？

    这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。

    Python
    数据结构
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +Python | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Python字典的实现原理

    > CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

    以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？

    这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。

    Python
    数据结构
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git a/tags/vscode.html b/tags/vscode.html index fc051fd1..6c9ba4e7 100644 --- a/tags/vscode.html +++ b/tags/vscode.html @@ -1 +1 @@ -VSCode | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +VSCode | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    完善 Hexo 编写环境，改善文章中使用图片的体验

    我平时使用 [vscode-memo](https://github.com/svsool/vscode-memo) 插件写笔记，其中插入图片使用 `![[]]` 语法，显示简短，也有较好的预览支持，体验极佳。希望这种特性也能在写 hexo 博客的时候使用。

    可能有很多人不熟悉 vscode-memo 这个插件，我先来简单介绍一下。

    vscode-memo 定位是一个 knowledge base ，对标的是 [Obsidian.md](https://obsidian.md/) 等软件。其功能包括且不限于：

    Blog
    VSCode
    Hexo
    JavaScript
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\346\216\222\345\272\217.html" "b/tags/\346\216\222\345\272\217.html" index 2d26fc6e..1ba5bf26 100644 --- "a/tags/\346\216\222\345\272\217.html" +++ "b/tags/\346\216\222\345\272\217.html" @@ -1 +1 @@ -排序 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    排序算法

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    数据结构
    算法
    排序
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +排序 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    排序算法

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    数据结构
    算法
    排序
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\346\225\260\346\215\256\347\273\223\346\236\204.html" "b/tags/\346\225\260\346\215\256\347\273\223\346\236\204.html" index 4e0683f0..c49fdff7 100644 --- "a/tags/\346\225\260\346\215\256\347\273\223\346\236\204.html" +++ "b/tags/\346\225\260\346\215\256\347\273\223\346\236\204.html" @@ -1 +1 @@ -数据结构 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    如何手撕一个堆

    在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

    当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

    但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

    数据结构
    算法
    算法竞赛
    排序算法

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    数据结构
    算法
    排序
    Python字典的实现原理

    > CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

    以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？

    这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。

    Python
    数据结构
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +数据结构 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    如何手撕一个堆

    在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

    当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

    但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

    数据结构
    算法
    算法竞赛
    排序算法

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    数据结构
    算法
    排序
    Python字典的实现原理

    > CPython从3.6开始，字典（dict）不再是无序的了——字典的修改了原先的底层实现，变得能按字典插入的顺序进行遍历。而Python从3.7开始将字典的有序性写入语言特性，不管是Jython、IronPython还是其他Python实现，从3.7开始大家的字典都是有序的了。

    以前参加Python相关的面试时，面试官经常都会问一个问题：Python里的字典（dict）是有序的吗？

    这自然难不倒我，我也照本宣科地讲：Python的字典底层是用哈希表实现的，在不发生冲突时读写的时间复杂度是O（1），比读写时间复杂度为O（logn）的红黑树要更快。但红黑树可以按下标的大小顺序进行遍历，而Dict遍历时是无序的。

    Python
    数据结构
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\346\235\202\346\212\200.html" "b/tags/\346\235\202\346\212\200.html" index 6339cb86..bdfc996f 100644 --- "a/tags/\346\235\202\346\212\200.html" +++ "b/tags/\346\235\202\346\212\200.html" @@ -1 +1 @@ -杂技 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    C++中using关键字的使用

    1. 引入整个命名空间中的成员

    不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。

    ```C++

    C++
    杂技
    搭建博客的过程

    > “Stop Trying to Reinvent the Wheel.”

    参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。

    整个网站文件夹大致结构如下：

    杂技
    Blog
    Welcome to Ryo's Blog!

    > “Hello World!”

    自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。

    感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。

    杂技
    杂谈
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +杂技 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    C++中using关键字的使用

    1. 引入整个命名空间中的成员

    不引入命名空间时，使用其中变量需要使用`<命名空间名>::<变量名>`的方式使用。

    ```C++

    C++
    杂技
    搭建博客的过程

    > “Stop Trying to Reinvent the Wheel.”

    参考[BruceZhao][BruceZhao]提供的中文翻译：[README.zh.md][READMEzh]，先将[Huxpro][Huxpro]提供的[博客模板仓库][origin_repo]fork出来，`git clone`到本地。

    整个网站文件夹大致结构如下：

    杂技
    Blog
    Welcome to Ryo's Blog!

    > “Hello World!”

    自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。

    感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。

    杂技
    杂谈
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\346\235\202\350\260\210.html" "b/tags/\346\235\202\350\260\210.html" index 338a4f04..a91c935a 100644 --- "a/tags/\346\235\202\350\260\210.html" +++ "b/tags/\346\235\202\350\260\210.html" @@ -1 +1 @@ -杂谈 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Welcome to Ryo's Blog!

    > “Hello World!”

    自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。

    感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。

    杂技
    杂谈
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +杂谈 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    Welcome to Ryo's Blog!

    > “Hello World!”

    自己盲人摸象折腾了一两天，终于利用GitHub Pages，把自己的博客搭好了。

    感谢[Huxpro][Huxpro]提供的博客模板，以及[BruceZhao][BruceZhao]编写的中文ReadMe。

    杂技
    杂谈
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\347\254\224\350\256\260.html" "b/tags/\347\254\224\350\256\260.html" index f7af37cf..7f284950 100644 --- "a/tags/\347\254\224\350\256\260.html" +++ "b/tags/\347\254\224\350\256\260.html" @@ -1 +1 @@ -笔记 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    设计模式之美读书笔记

    从7个方面评价代码的好坏：

    1. 易维护性：根本

    2. 可读性：最重要

    设计模式
    笔记
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +笔记 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    设计模式之美读书笔记

    从7个方面评价代码的好坏：

    1. 易维护性：根本

    2. 可读性：最重要

    设计模式
    笔记
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\347\256\227\346\263\225.html" "b/tags/\347\256\227\346\263\225.html" index c4b923ea..8acbce42 100644 --- "a/tags/\347\256\227\346\263\225.html" +++ "b/tags/\347\256\227\346\263\225.html" @@ -1 +1 @@ -算法 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    如何手撕一个堆

    在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

    当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

    但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

    数据结构
    算法
    算法竞赛
    排序算法

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    数据结构
    算法
    排序
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +算法 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    如何手撕一个堆

    在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

    当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

    但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

    数据结构
    算法
    算法竞赛
    排序算法

    我们知道排序是算法入门基本功，排序算法有多重要想必也不需要我在这里说明了。因此这一篇就按着我的理解，聊一聊排序算法。

    当然我不打算随便弄个什么十大排序算法或是经典排序总结之类响当当的名头，各个算法走马看花一样拉出来遛一遍，最后变得跟网上搜索到的其他讲排序的文章一样换汤不换药。你会发现这篇文章的结构跟在网上搜索到的任何讲排序的文章都有所不同：

    在这篇文章里，你会发现你找不到冒泡排序——因为我认为冒泡排序只不过是一种低效率的选择排序。

    数据结构
    算法
    排序
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\347\256\227\346\263\225\347\253\236\350\265\233.html" "b/tags/\347\256\227\346\263\225\347\253\236\350\265\233.html" index 8f055f40..e5cb504e 100644 --- "a/tags/\347\256\227\346\263\225\347\253\236\350\265\233.html" +++ "b/tags/\347\256\227\346\263\225\347\253\236\350\265\233.html" @@ -1 +1 @@ -算法竞赛 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    如何手撕一个堆

    在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

    当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

    但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

    数据结构
    算法
    算法竞赛
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +算法竞赛 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    如何手撕一个堆

    在参加如AtCoder等算法竞技，或是刷Leetcode等算法题时，我们总是不可避免地遇到堆这种数据结构。

    当然，一般来说我们只要理解堆，知道堆的性质，知道怎么样用堆就足够了。在做题时只需要调用系统类库即可——在参加AtCoder时你甚至不会有时间去自己实现一个堆。

    但是，如果哪一天你把编程语言的类库全忘光了，又遇到一题需要频繁求最值的题目——你明知这里要用堆，却又忘记该调用的类名了，咋办？我还真遇到过这问题：三年没刷算法，只能对着一道自己明显会的题干着急，愣是想不起PriorityQueue的名字。这时候，只能自己实现一个堆出来了。

    数据结构
    算法
    算法竞赛
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file diff --git "a/tags/\350\256\276\350\256\241\346\250\241\345\274\217.html" "b/tags/\350\256\276\350\256\241\346\250\241\345\274\217.html" index edc8a833..792e272e 100644 --- "a/tags/\350\256\276\350\256\241\346\250\241\345\274\217.html" +++ "b/tags/\350\256\276\350\256\241\346\250\241\345\274\217.html" @@ -1 +1 @@ -设计模式 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    设计模式之美读书笔记

    从7个方面评价代码的好坏：

    1. 易维护性：根本

    2. 可读性：最重要

    设计模式
    笔记
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file +设计模式 | Ryo's Blog
    Ryo's Blog
    Articles
    Ideas
    Tags
    Clips
    Kubernetes
    DevOps
    Docker
    Cloud Native
    Blog
    VSCode
    Hexo
    JavaScript
    GitHub
    AWS
    CI/CD
    IaC
    数据结构
    算法
    算法竞赛
    设计模式
    笔记
    排序
    Python
    C++
    杂技
    杂谈
    Nextjs
    Cloud Computing
    设计模式之美读书笔记

    从7个方面评价代码的好坏：

    1. 易维护性：根本

    2. 可读性：最重要

    设计模式
    笔记
    © 2023 Ryo Jerry Yu. All rights reserved.
    \ No newline at end of file