[{"data":1,"prerenderedAt":981},["ShallowReactive",2],{"navigation_docs":3,"-web-dev-infrastructure-yaml-configuration":352,"-web-dev-infrastructure-yaml-configuration-surround":976},[4,54,83,116,125,161,179,200],{"title":5,"path":6,"stem":7,"children":8},"Ai","/ai","ai",[9,12,42,46,50],{"title":10,"path":6,"stem":11},"AI 技術探索","ai/index",{"title":13,"path":14,"stem":15,"children":16,"page":41},"Rag","/ai/rag","ai/RAG",[17,21,25,29,33,37],{"title":18,"path":19,"stem":20},"BM25 演算法深入解析：從 TF-IDF 到現代搜尋引擎的核心技術","/ai/rag/bm25-deep-dive-from-tf-idf-to-rag","ai/RAG/bm25-deep-dive-from-tf-idf-to-rag",{"title":22,"path":23,"stem":24},"Dense Retrieval（向量檢索）深入解析","/ai/rag/dense-retrieval-deep-dive","ai/RAG/dense-retrieval-deep-dive",{"title":26,"path":27,"stem":28},"RAG（Retrieval-Augmented Generation）原理與實作入門","/ai/rag/rag-intro-principles-and-implementation","ai/RAG/rag-intro-principles-and-implementation",{"title":30,"path":31,"stem":32},"RAG Retrieval Strategy 深入解析","/ai/rag/rag-retrieval-strategy-deep-dive","ai/RAG/rag-retrieval-strategy-deep-dive",{"title":34,"path":35,"stem":36},"Reciprocal Rank Fusion（RRF）教學：打造更穩定的檢索融合策略","/ai/rag/rrf-reciprocal-rank-fusion-guide","ai/RAG/rrf-reciprocal-rank-fusion-guide",{"title":38,"path":39,"stem":40},"TF-IDF（Term Frequency–Inverse Document Frequency）深入解析","/ai/rag/tf-idf-deep-dive","ai/RAG/tf-idf-deep-dive",false,{"title":43,"path":44,"stem":45},"Docus AI 功能完整實作指南","/ai/docus-ai-implementation","ai/docus-ai-implementation",{"title":47,"path":48,"stem":49},"llms.txt 是什麼？在 Nuxt 中控制 AI 與搜尋引擎爬蟲的新方式","/ai/llms-txt","ai/llms-txt",{"title":51,"path":52,"stem":53},"MCP（Model Context Protocol）是什麼？用「AI 的 USB-C」理解模型如何安全連接工具與資料","/ai/mcp_concept","ai/mcp_concept",{"title":55,"path":56,"stem":57,"children":58,"page":41},"Data Analysis","/data-analysis","data-analysis",[59,63,67,71,75,79],{"title":60,"path":61,"stem":62},"Exploratory Data Analysis（EDA）資料探索分析入門","/data-analysis/exploratory-data-analysis-eda","data-analysis/exploratory-data-analysis-eda",{"title":64,"path":65,"stem":66},"PR-AUC 深入解析：不平衡分類問題的重要評估指標","/data-analysis/pr-auc-for-imbalanced-classification","data-analysis/pr-auc-for-imbalanced-classification",{"title":68,"path":69,"stem":70},"ROC-AUC 深入解析：理解分類模型的判斷能力","/data-analysis/roc-auc-complete-guide","data-analysis/roc-auc-complete-guide",{"title":72,"path":73,"stem":74},"SHAP（SHapley Additive exPlanations）模型解釋方法深入解析","/data-analysis/shap-model-interpretation-complete-guide","data-analysis/shap-model-interpretation-complete-guide",{"title":76,"path":77,"stem":78},"Social Network Analysis（SNA）深入解析","/data-analysis/social-network-analysis-sna","data-analysis/social-network-analysis-sna",{"title":80,"path":81,"stem":82},"Time-based Split：為什麼時間序列資料不能使用 Random Split？","/data-analysis/time-based-split-vs-random-split","data-analysis/time-based-split-vs-random-split",{"title":84,"path":85,"stem":86,"children":87,"page":41},"MachineLearning","/machine_learning","machine_learning",[88,92,96,100,104,108,112],{"title":89,"path":90,"stem":91},"Confusion Matrix（混淆矩陣）完整解析","/machine_learning/confusion-matrix","machine_learning/confusion-matrix",{"title":93,"path":94,"stem":95},"Decision Tree 模型完整教學：從原理到 Python 實作","/machine_learning/decision-tree-complete-guide","machine_learning/decision-tree-complete-guide",{"title":97,"path":98,"stem":99},"為什麼 Decision Tree 在 Tabular Data 上常常勝過 Deep Learning？","/machine_learning/decision-tree-vs-deep-learning-on-tabular-data","machine_learning/decision-tree-vs-deep-learning-on-tabular-data",{"title":101,"path":102,"stem":103},"LightGBM 模型入門：理解高效能的 Gradient Boosting 演算法","/machine_learning/lightgbm-intro-for-tabular-data","machine_learning/lightgbm-intro-for-tabular-data",{"title":105,"path":106,"stem":107},"Logistic Regression（Logit 回歸）完整教學","/machine_learning/logistic-regression-complete-guide","machine_learning/logistic-regression-complete-guide",{"title":109,"path":110,"stem":111},"為什麼模型訓練需要 Train / Validation / Test Dataset？","/machine_learning/train-validation-test-dataset","machine_learning/train-validation-test-dataset",{"title":113,"path":114,"stem":115},"XGBoost 原理與實務教學","/machine_learning/xgboost-complete-guide","machine_learning/xgboost-complete-guide",{"title":117,"path":118,"stem":119,"children":120,"page":41},"Network","/network","network",[121],{"title":122,"path":123,"stem":124},"DNS 設定入門：CNAME vs A Record 完整解析","/network/dns-cname-vs-a-record-guide","network/dns-cname-vs-a-record-guide",{"title":126,"path":127,"stem":128,"children":129},"Nuxt","/nuxt","nuxt",[130,133,137,141,145,149,153,157],{"title":131,"path":127,"stem":132},"Nuxt 實戰指南","nuxt/index",{"title":134,"path":135,"stem":136},"Abstraction Layer 與 Adapter 的差別，一次搞懂設計角色","/nuxt/adapter_abstraction_layer","nuxt/adapter_abstraction_layer",{"title":138,"path":139,"stem":140},"Nuxt 4 全面理解 — 專案檔案結構解析","/nuxt/directory_structure","nuxt/directory_structure",{"title":142,"path":143,"stem":144},"Nuxt 前端 build 流程完整解析","/nuxt/frontend_build","nuxt/frontend_build",{"title":146,"path":147,"stem":148},"Nitro 是什麼？從 Nuxt 專案到 Server 與 Edge 的關鍵引擎","/nuxt/nitro","nuxt/nitro",{"title":150,"path":151,"stem":152},"深入理解 Nuxt 的 .nuxt 與 .output：為什麼部署時一定要分清楚？","/nuxt/nuxt_and_output","nuxt/nuxt_and_output",{"title":154,"path":155,"stem":156},"Nuxt 中 dev、build、preview 的差異一次搞懂","/nuxt/nuxt_dev_build_preview","nuxt/nuxt_dev_build_preview",{"title":158,"path":159,"stem":160},"Nuxt Image vs \u003Cimg>：為什麼 Nuxt 3 專案幾乎都該用 \u003CNuxtImg>？","/nuxt/nuxt_image","nuxt/nuxt_image",{"title":162,"path":163,"stem":164,"children":165},"Python 程式開發","/python","python/index",[166,167,171,175],{"title":162,"path":163,"stem":164},{"title":168,"path":169,"stem":170},"如何在 FastAPI 中調用記憶體 Buffer 回傳圖片 (附實例)","/python/memory_buffer","python/memory_buffer",{"title":172,"path":173,"stem":174},"Python 單元測試教學：如何為你的程式撰寫 Test","/python/python-unit-testing-unittest-pytest","python/python-unit-testing-unittest-pytest",{"title":176,"path":177,"stem":178},"如何使用 uv 取代 pip：改善 Python 專案的開發流程","/python/uv","python/uv",{"title":180,"path":181,"stem":182,"children":183,"page":41},"Statistic","/statistic","statistic",[184,188,192,196],{"title":185,"path":186,"stem":187},"卡方檢定（Chi-Square Test）入門教學","/statistic/chi-square-test-intro","statistic/chi-square-test-intro",{"title":189,"path":190,"stem":191},"常見抽樣方法（Sampling Methods）教學：Stratified、Quota、Convenience、Systematic、Simple Random","/statistic/common-sampling-methods-guide","statistic/common-sampling-methods-guide",{"title":193,"path":194,"stem":195},"Cramér’s V 指標介紹：如何衡量兩個類別變數之間的關聯","/statistic/cramers-v-for-categorical-association","statistic/cramers-v-for-categorical-association",{"title":197,"path":198,"stem":199},"Mann–Whitney U 與 Kolmogorov–Smirnov（KS）檢定：非參數統計檢定的入門指南","/statistic/mann-whitney-u-and-ks-test-intro","statistic/mann-whitney-u-and-ks-test-intro",{"title":201,"path":202,"stem":203,"children":204},"WebDev","/web_dev","web_dev",[205,208,234,248,282,312,334],{"title":206,"path":202,"stem":207},"Web 前端開發","web_dev/index",{"title":209,"path":210,"stem":211,"children":212},"瀏覽器與渲染","/web_dev/browser","web_dev/browser/index",[213,214,218,222,226,230],{"title":209,"path":210,"stem":211},{"title":215,"path":216,"stem":217},"瀏覽器儲存空間完整解析：Cookie、localStorage、IndexedDB 到 Cache Storage","/web_dev/browser/browser-storage-comprehensive-guide","web_dev/browser/browser-storage-comprehensive-guide",{"title":219,"path":220,"stem":221},"DOM (Document Object Model) 深入解析","/web_dev/browser/dom","web_dev/browser/dom",{"title":223,"path":224,"stem":225},"Service Worker Request Flow 深入解析","/web_dev/browser/service-worker-request-flow","web_dev/browser/service-worker-request-flow",{"title":227,"path":228,"stem":229},"CSR、SSR 與 SSG 是什麼？前端渲染策略完整比較","/web_dev/browser/ssr_csr_ssg","web_dev/browser/ssr_csr_ssg",{"title":231,"path":232,"stem":233},"Virtual DOM 深入解析：為什麼它能優化前端效能？","/web_dev/browser/virtual_dom","web_dev/browser/virtual_dom",{"title":235,"path":236,"stem":237,"children":238},"圖形技術","/web_dev/graphics","web_dev/graphics/index",[239,240,244],{"title":235,"path":236,"stem":237},{"title":241,"path":242,"stem":243},"為什麼 Three.js 專案幾乎都選擇 CSR？從 SSR 問題談起","/web_dev/graphics/threejs_csr","web_dev/graphics/threejs_csr",{"title":245,"path":246,"stem":247},"WebGL 是什麼？為什麼前端 3D 幾乎都靠它？","/web_dev/graphics/webgl","web_dev/graphics/webGL",{"title":249,"path":250,"stem":251,"children":252},"架構與配置","/web_dev/infrastructure","web_dev/infrastructure/index",[253,254,258,262,266,270,274,278],{"title":249,"path":250,"stem":251},{"title":255,"path":256,"stem":257},"Zeabur + K3s + Nuxt 部署架構完整解析","/web_dev/infrastructure/k3s-zeabur","web_dev/infrastructure/K3s-zeabur",{"title":259,"path":260,"stem":261},"ECS vs Docker vs Kubernetes：從部署堆疊理解三層架構","/web_dev/infrastructure/ecs-docker-kubernetes-stack","web_dev/infrastructure/ecs-docker-kubernetes-stack",{"title":263,"path":264,"stem":265},"ECS vs VPS 是什麼？從部署網站的角度一次搞懂差別","/web_dev/infrastructure/ecs-vs-vps","web_dev/infrastructure/ecs-vs-vps",{"title":267,"path":268,"stem":269},"Zeabur 內網服務連線完整入門指南","/web_dev/infrastructure/k3s-internal-networking","web_dev/infrastructure/k3s-internal-networking",{"title":271,"path":272,"stem":273},"使用 Microservices 架構設計系統的優勢解析","/web_dev/infrastructure/microservices-architecture-advantages","web_dev/infrastructure/microservices-architecture-advantages",{"title":275,"path":276,"stem":277},"Nginx 入門教學：從反向代理到與 Kubernetes 的架構比較","/web_dev/infrastructure/nginx-intro","web_dev/infrastructure/nginx-intro",{"title":279,"path":280,"stem":281},"YAML 配置是什麼？為什麼現代開發都在用它","/web_dev/infrastructure/yaml-configuration","web_dev/infrastructure/yaml-configuration",{"title":283,"path":284,"stem":285,"children":286},"網絡與通訊","/web_dev/network","web_dev/network/index",[287,288,292,296,300,304,308],{"title":283,"path":284,"stem":285},{"title":289,"path":290,"stem":291},"HTTP Request 結構完整解析：從 Request Line 到 Header 一次看懂","/web_dev/network/http-request-structure","web_dev/network/http-request-structure",{"title":293,"path":294,"stem":295},"OSI 模型（Open Systems Interconnection Model）完整解析","/web_dev/network/osi-model","web_dev/network/osi-model",{"title":297,"path":298,"stem":299},"RESTful API 設計原則與實務解析","/web_dev/network/restful-api","web_dev/network/restful-api",{"title":301,"path":302,"stem":303},"RESTful API 五大設計原則深入解析","/web_dev/network/restful-api-principles","web_dev/network/restful-api-principles",{"title":305,"path":306,"stem":307},"Server-Sent Events (SSE) 深入解析與實作教學","/web_dev/network/sse-introduction","web_dev/network/sse-introduction",{"title":309,"path":310,"stem":311},"WebSocket 入門教學：從概念到 Node.js 實作","/web_dev/network/websocket-introduction","web_dev/network/websocket-introduction",{"title":313,"path":314,"stem":315,"children":316},"認證與安全","/web_dev/security","web_dev/security/index",[317,318,322,326,330],{"title":313,"path":314,"stem":315},{"title":319,"path":320,"stem":321},"使用 Cookie 與 Session 建立使用者驗證（完整新手教學）","/web_dev/security/cookie-session-authentication","web_dev/security/cookie-session-authentication",{"title":323,"path":324,"stem":325},"JWT 驗證機制完整解析：從登入流程到實務應用","/web_dev/security/jwt-authentication","web_dev/security/jwt-authentication",{"title":327,"path":328,"stem":329},"Secret Key 簽名是什麼？從零理解資料簽名的本質","/web_dev/security/secret-key-signing","web_dev/security/secret-key-signing",{"title":331,"path":332,"stem":333},"SSH（Secure Shell）是什麼？從遠端登入到安全通道的核心概念","/web_dev/security/ssh","web_dev/security/ssh",{"title":335,"path":336,"stem":337,"children":338},"SEO 與規範","/web_dev/seo","web_dev/seo/index",[339,340,344,348],{"title":335,"path":336,"stem":337},{"title":341,"path":342,"stem":343},"Canonical URL 是什麼？用生活化方式搞懂前端 SEO 的基本保命符","/web_dev/seo/canonical_link","web_dev/seo/canonical_link",{"title":345,"path":346,"stem":347},"robots.txt 是什麼？SEO 的第一道守門員","/web_dev/seo/robot_txt","web_dev/seo/robot_txt",{"title":349,"path":350,"stem":351},"Nuxt SEO 中的 Meta 與 SEO 工具是如何運作的？","/web_dev/seo/seo","web_dev/seo/seo",{"id":353,"title":279,"body":354,"description":964,"extension":965,"links":966,"meta":967,"navigation":480,"path":280,"seo":974,"stem":281,"__hash__":975},"docs/web_dev/infrastructure/yaml-configuration.md",{"type":355,"value":356,"toc":950},"minimark",[357,361,365,373,381,388,391,413,416,419,424,427,512,521,611,618,620,624,627,632,657,664,668,687,694,698,732,739,741,745,748,770,773,775,779,782,807,809,813,816,820,823,906,913,915,919,922,929,932,943,946],[358,359,279],"h1",{"id":360},"yaml-配置是什麼為什麼現代開發都在用它",[362,363,364],"p",{},"在現代網站與雲端應用中，幾乎每個系統都需要「設定檔」。例如伺服器要跑在哪個 port、資料庫帳號密碼是什麼、CI/CD 要怎麼執行流程等等。這些內容不屬於程式邏輯，而是「系統運作規則」。",[362,366,367,368,372],{},"所謂的 ",[369,370,371],"strong",{},"YAML 配置（YAML configuration）","，就是使用 YAML 這種格式來撰寫設定檔。它的核心目的其實非常單純：",[374,375,376],"blockquote",{},[362,377,378],{},[369,379,380],{},"用「人類容易閱讀」的方式描述系統設定，而不是寫程式碼。",[362,382,383,384,387],{},"YAML 本身是一種資料表示格式（data serialization format），全名是 ",[369,385,386],{},"YAML Ain’t Markup Language","。它不是程式語言，而是一種用來描述資料結構的格式，特別適合用在設定檔。",[362,389,390],{},"在實務上，YAML 常見於以下情境：",[392,393,394,398,401,404,407,410],"ul",{},[395,396,397],"li",{},"系統設定（config）",[395,399,400],{},"部署設定",[395,402,403],{},"CI/CD 流程",[395,405,406],{},"容器編排",[395,408,409],{},"靜態網站生成器設定",[395,411,412],{},"前端工具設定（如 Nuxt、Vite、ESLint 等）",[362,414,415],{},"換句話說：YAML 的用途是「告訴系統怎麼運作」，而不是寫業務邏輯。",[417,418],"hr",{},[420,421,423],"h2",{"id":422},"一個最基本的-yaml-設定範例","一個最基本的 YAML 設定範例",[362,425,426],{},"我們先看一個最簡單的例子。假設有一個網站的伺服器與資料庫設定：",[428,429,434],"pre",{"className":430,"code":431,"language":432,"meta":433,"style":433},"language-yaml shiki shiki-themes github-dark","server:\n  port: 3000\n  host: localhost\n\ndatabase:\n  user: root\n  password: secret\n","yaml","",[435,436,437,450,463,475,482,490,501],"code",{"__ignoreMap":433},[438,439,442,446],"span",{"class":440,"line":441},"line",1,[438,443,445],{"class":444},"s4JwU","server",[438,447,449],{"class":448},"s95oV",":\n",[438,451,453,456,459],{"class":440,"line":452},2,[438,454,455],{"class":444},"  port",[438,457,458],{"class":448},": ",[438,460,462],{"class":461},"sDLfK","3000\n",[438,464,466,469,471],{"class":440,"line":465},3,[438,467,468],{"class":444},"  host",[438,470,458],{"class":448},[438,472,474],{"class":473},"sU2Wk","localhost\n",[438,476,478],{"class":440,"line":477},4,[438,479,481],{"emptyLinePlaceholder":480},true,"\n",[438,483,485,488],{"class":440,"line":484},5,[438,486,487],{"class":444},"database",[438,489,449],{"class":448},[438,491,493,496,498],{"class":440,"line":492},6,[438,494,495],{"class":444},"  user",[438,497,458],{"class":448},[438,499,500],{"class":473},"root\n",[438,502,504,507,509],{"class":440,"line":503},7,[438,505,506],{"class":444},"  password",[438,508,458],{"class":448},[438,510,511],{"class":473},"secret\n",[362,513,514,515,517,518,520],{},"這段 YAML 的意思是：系統有兩個設定區塊，",[435,516,445],{}," 與 ",[435,519,487],{},"，底下分別有對應的屬性。如果用 JSON 表示，會長這樣：",[428,522,526],{"className":523,"code":524,"language":525,"meta":433,"style":433},"language-json shiki shiki-themes github-dark","{\n  \"server\": {\n    \"port\": 3000,\n    \"host\": \"localhost\"\n  },\n  \"database\": {\n    \"user\": \"root\",\n    \"password\": \"secret\"\n  }\n}\n","json",[435,527,528,533,541,554,564,569,576,588,599,605],{"__ignoreMap":433},[438,529,530],{"class":440,"line":441},[438,531,532],{"class":448},"{\n",[438,534,535,538],{"class":440,"line":452},[438,536,537],{"class":461},"  \"server\"",[438,539,540],{"class":448},": {\n",[438,542,543,546,548,551],{"class":440,"line":465},[438,544,545],{"class":461},"    \"port\"",[438,547,458],{"class":448},[438,549,550],{"class":461},"3000",[438,552,553],{"class":448},",\n",[438,555,556,559,561],{"class":440,"line":477},[438,557,558],{"class":461},"    \"host\"",[438,560,458],{"class":448},[438,562,563],{"class":473},"\"localhost\"\n",[438,565,566],{"class":440,"line":484},[438,567,568],{"class":448},"  },\n",[438,570,571,574],{"class":440,"line":492},[438,572,573],{"class":461},"  \"database\"",[438,575,540],{"class":448},[438,577,578,581,583,586],{"class":440,"line":503},[438,579,580],{"class":461},"    \"user\"",[438,582,458],{"class":448},[438,584,585],{"class":473},"\"root\"",[438,587,553],{"class":448},[438,589,591,594,596],{"class":440,"line":590},8,[438,592,593],{"class":461},"    \"password\"",[438,595,458],{"class":448},[438,597,598],{"class":473},"\"secret\"\n",[438,600,602],{"class":440,"line":601},9,[438,603,604],{"class":448},"  }\n",[438,606,608],{"class":440,"line":607},10,[438,609,610],{"class":448},"}\n",[362,612,613,614,617],{},"兩者的結構完全相同，但 YAML 沒有大量的大括號與引號，看起來更像一般文件。它的關鍵特徵是：",[369,615,616],{},"用「縮排」表示階層結構，而不是用大括號。"," 這也是 YAML 可讀性高的原因。",[417,619],{},[420,621,623],{"id":622},"yaml-的核心語法其實非常簡單","YAML 的核心語法其實非常簡單",[362,625,626],{},"很多人第一次看到 YAML 會覺得很神祕，但實際上只需要掌握三種基本結構。",[628,629,631],"h3",{"id":630},"_1-key-value-結構","1. Key-Value 結構",[428,633,635],{"className":430,"code":634,"language":432,"meta":433,"style":433},"name: Woody\nage: 30\n",[435,636,637,647],{"__ignoreMap":433},[438,638,639,642,644],{"class":440,"line":441},[438,640,641],{"class":444},"name",[438,643,458],{"class":448},[438,645,646],{"class":473},"Woody\n",[438,648,649,652,654],{"class":440,"line":452},[438,650,651],{"class":444},"age",[438,653,458],{"class":448},[438,655,656],{"class":461},"30\n",[362,658,659,660,663],{},"這和 JSON 的 ",[435,661,662],{},"\"name\": \"Woody\""," 本質上是一樣的。",[628,665,667],{"id":666},"_2-巢狀結構用縮排表示層級","2. 巢狀結構（用縮排表示層級）",[428,669,671],{"className":430,"code":670,"language":432,"meta":433,"style":433},"server:\n  port: 3000\n",[435,672,673,679],{"__ignoreMap":433},[438,674,675,677],{"class":440,"line":441},[438,676,445],{"class":444},[438,678,449],{"class":448},[438,680,681,683,685],{"class":440,"line":452},[438,682,455],{"class":444},[438,684,458],{"class":448},[438,686,462],{"class":461},[362,688,689,690,693],{},"這裡要特別注意，YAML 對縮排非常敏感，而且",[369,691,692],{},"必須使用空格，不能使用 Tab","。縮排錯誤會直接導致解析失敗。",[628,695,697],{"id":696},"_3-陣列","3. 陣列",[428,699,701],{"className":430,"code":700,"language":432,"meta":433,"style":433},"languages:\n  - JavaScript\n  - Python\n  - Go\n",[435,702,703,710,718,725],{"__ignoreMap":433},[438,704,705,708],{"class":440,"line":441},[438,706,707],{"class":444},"languages",[438,709,449],{"class":448},[438,711,712,715],{"class":440,"line":452},[438,713,714],{"class":448},"  - ",[438,716,717],{"class":473},"JavaScript\n",[438,719,720,722],{"class":440,"line":465},[438,721,714],{"class":448},[438,723,724],{"class":473},"Python\n",[438,726,727,729],{"class":440,"line":477},[438,728,714],{"class":448},[438,730,731],{"class":473},"Go\n",[362,733,734,735,738],{},"每個 ",[435,736,737],{},"-"," 代表陣列中的一個元素。這種寫法在描述流程或步驟時非常自然。",[417,740],{},[420,742,744],{"id":743},"什麼叫做-yaml-configuration","什麼叫做 YAML Configuration？",[362,746,747],{},"當一個系統使用 YAML 作為設定檔格式時，我們就稱它為 YAML configuration。例如常見的檔名：",[392,749,750,755,760,765],{},[395,751,752],{},[435,753,754],{},"docker-compose.yml",[395,756,757],{},[435,758,759],{},"kubernetes.yaml",[395,761,762],{},[435,763,764],{},"github-actions.yml",[395,766,767],{},[435,768,769],{},"config.yaml",[362,771,772],{},"這些檔案都不是程式碼，而是描述系統如何運作的文件。它們會被對應的工具讀取，然後依照內容去建立服務、啟動流程或設定環境。",[417,774],{},[420,776,778],{"id":777},"為什麼現代系統大量使用-yaml","為什麼現代系統大量使用 YAML？",[362,780,781],{},"這是理解 YAML 流行的關鍵。",[783,784,785,791,801],"ol",{},[395,786,787,790],{},[369,788,789],{},"可讀性高","：相比 JSON，YAML 寫法更接近自然語言結構。當設定變複雜時，這種差異會更加明顯。",[395,792,793,796,797,800],{},[369,794,795],{},"支援註解","：YAML 可以加入註解（使用 ",[435,798,799],{},"#","）。JSON 並不支援註解，這對於需要團隊協作與維護的設定檔來說非常重要。",[395,802,803,806],{},[369,804,805],{},"適合描述階層與流程","：例如部署流程中的步驟，用 YAML 表示非常自然。",[417,808],{},[420,810,812],{"id":811},"devops-生態系為什麼幾乎都選-yaml","DevOps 生態系為什麼幾乎都選 YAML？",[362,814,815],{},"在現代雲端開發環境中，YAML 幾乎已經成為設定檔的事實標準。像 Docker Compose, Kubernetes, GitHub Actions, GitLab CI, Ansible 等工具都使用 YAML。當整個 DevOps 生態系都採用同一種格式時，學習與維護成本就會降低，這也讓 YAML 成為跨平台設定的共同語言。",[628,817,819],{"id":818},"一個真實例子github-actions-的-yaml","一個真實例子：GitHub Actions 的 YAML",[362,821,822],{},"我們看一段實際的 CI 設定：",[428,824,826],{"className":430,"code":825,"language":432,"meta":433,"style":433},"name: CI\non: push\n\njobs:\n  build:\n    runs-on: ubuntu-latest\n    steps:\n      - run: npm install\n      - run: npm test\n",[435,827,828,837,847,851,858,865,875,882,895],{"__ignoreMap":433},[438,829,830,832,834],{"class":440,"line":441},[438,831,641],{"class":444},[438,833,458],{"class":448},[438,835,836],{"class":473},"CI\n",[438,838,839,842,844],{"class":440,"line":452},[438,840,841],{"class":461},"on",[438,843,458],{"class":448},[438,845,846],{"class":473},"push\n",[438,848,849],{"class":440,"line":465},[438,850,481],{"emptyLinePlaceholder":480},[438,852,853,856],{"class":440,"line":477},[438,854,855],{"class":444},"jobs",[438,857,449],{"class":448},[438,859,860,863],{"class":440,"line":484},[438,861,862],{"class":444},"  build",[438,864,449],{"class":448},[438,866,867,870,872],{"class":440,"line":492},[438,868,869],{"class":444},"    runs-on",[438,871,458],{"class":448},[438,873,874],{"class":473},"ubuntu-latest\n",[438,876,877,880],{"class":440,"line":503},[438,878,879],{"class":444},"    steps",[438,881,449],{"class":448},[438,883,884,887,890,892],{"class":440,"line":590},[438,885,886],{"class":448},"      - ",[438,888,889],{"class":444},"run",[438,891,458],{"class":448},[438,893,894],{"class":473},"npm install\n",[438,896,897,899,901,903],{"class":440,"line":601},[438,898,886],{"class":448},[438,900,889],{"class":444},[438,902,458],{"class":448},[438,904,905],{"class":473},"npm test\n",[362,907,908,909,912],{},"這段設定其實在說：",[369,910,911],{},"每當有 push 事件發生時，在 Ubuntu 環境中執行 npm install 與 npm test。"," 整個自動化流程完全由 YAML 描述，系統只負責讀取並執行。",[417,914],{},[420,916,918],{"id":917},"yaml-的心智模型","YAML 的心智模型",[362,920,921],{},"學習 YAML 不需要背誦複雜語法，只需要建立一個清楚的心智模型：",[374,923,924],{},[362,925,926],{},[369,927,928],{},"YAML 就是設定檔版本的 JSON，但更好讀。",[362,930,931],{},"它不是程式語言，不負責計算，也不負責邏輯判斷。它只負責：",[392,933,934,937,940],{},[395,935,936],{},"描述設定",[395,938,939],{},"描述資料結構",[395,941,942],{},"描述執行流程",[362,944,945],{},"當你在使用 Nuxt、Docker、Kubernetes 或 CI/CD 工具時，其實就是在透過 YAML 告訴系統：「請按照這份說明書運作。」理解這一點之後，你會發現 YAML 不再只是格式問題，而是整個現代開發流程中的基礎語言。",[947,948,949],"style",{},"html pre.shiki code .s95oV, html code.shiki .s95oV{--shiki-default:#E1E4E8}html pre.shiki code .sDLfK, html code.shiki .sDLfK{--shiki-default:#79B8FF}html pre.shiki code .sU2Wk, html code.shiki .sU2Wk{--shiki-default:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .s4JwU, html code.shiki .s4JwU{--shiki-default:#85E89D}",{"title":433,"searchDepth":452,"depth":452,"links":951},[952,953,958,959,960,963],{"id":422,"depth":452,"text":423},{"id":622,"depth":452,"text":623,"children":954},[955,956,957],{"id":630,"depth":465,"text":631},{"id":666,"depth":465,"text":667},{"id":696,"depth":465,"text":697},{"id":743,"depth":452,"text":744},{"id":777,"depth":452,"text":778},{"id":811,"depth":452,"text":812,"children":961},[962],{"id":818,"depth":465,"text":819},{"id":917,"depth":452,"text":918},"從基礎語法到實際應用，帶你理解 YAML configuration 的核心概念，以及為什麼 Docker、Kubernetes、GitHub Actions 都選擇它。","md",null,{"tags":968,"category":203,"date":973},[432,969,970,971,972],"configuration","devops","docker","kubernetes","2026-02-13",{"title":279,"description":964},"rlEbxWoRLSxXDB0nfz6bo458XAGIcOeiZkTnn59MrsY",[977,979],{"title":275,"path":276,"stem":277,"description":978,"children":-1},"從零開始理解 Nginx 的核心功能，包含反向代理、負載平衡與靜態資源處理，並延伸比較 Kubernetes 在現代架構中的角色差異。",{"title":283,"path":284,"stem":285,"description":980,"children":-1},"本區涵蓋 HTTP 協議、RESTful API 設計、WebSocket 及 SSE 等網絡通訊技術。",1776690847119]