สร้าง Knowledge Base ทีม IT จาก Obsidian สู่ Cloudflare Pages (ครบจบในบทความเดียว)

บทนำ

สมมติสถานะการทีม IT Support รับเคสต่างๆ ในแต่ละวันซึ่งบางครั้งเมื่อเวลาผ่านไปเคสที่เคยเกิดขึ้นซ้ำก็อาจหลงลืมได้ จึงได้ใช้แนวคิดสมองที่สอง(Second Brain) ในการบันทึการแก้ปัญหานอกจากนี้ ยังขยายความสามารถให้ผู้อื่นในทีม สามารถแชร์องค์ความรู้ในการแก้ปัญหาเพื่อให้สมองที่สองเป็นสมองของทีมโดยอัติโนมัติ
Obsidian เป็นเครื่ิองมือสำหรับบันทึกข้อมูลในรูปแบบ markdown สามารถเชื่อมโยงบทความ หรือโน๊ดเล็กเข้ากันสรา้งความสัมพันธ์ในลักษณะกราฟ และมีส่วนของเทมเพลตเพื่อใช้ในการจัดระบบของเนื้อหาให้เป็นระเบียบ ตามแนวคิดของ"สมองที่สอง"(Second Brain) คืออะไร ซึ่งก็คือเก็บความรู้ที่เราต้องใช้ซ้ำ ๆ ให้เรียกใช้ได้ทันที แทนพึ่งความจำคน โดยมีแกนหลักมักอิง 4 ขั้น (CODE ของ Tiago Forte):

• Capture: จับความรู้/บริบทเร็ว ๆ เป็นโน้ตสั้น ๆ
• Organize: จัดโครง (เช่น PARA: Projects/Areas/Resources/Archives)
• Distill: กลั่นให้กระชับ (สรุป, เช็กลิสต์, ขั้นตอน)
• Express: นำไปใช้—คู่มือ, runbook, ตอบเคส, เทรนนิ่ง ปัญหาอย่างนึงของการใช้งาน Obsidian คือมันคือแอปจดบันทึกแบบ local-first ซึ่งไม่สามารถแชร์ให้กับผู้อื่นได้ แล้วเราจะสรา้งสมองที่สองของทีม IT Support ได้อย่างไร? จึงเป็นที่มาของระบบการใช้ Knowledge sharing โดยใช้ Obsidian

โดยเราจะใช้ Obsidian เป็นเครื่องมือในการสรา้ง Knowledge Base จากนั้น push ขึิ้น git เป็นลักษณะของการเปิด pull request เพื่อให้หัสหน้าทีม ตรวจสอบเนื้อหา ก่อนที่จะใช้ github action สรา้ง Static Site Generator(SSG) ซึ่งเป็นการแปลงข้อมูล markdown(obsidian) ไปเป็น HTML/CSS/JS แบบสเตติกจากนั้นก็เอาไฟล์ไปไว้ที่เว็บโฮสติ้ง(Github Page หรือ Cloudflare Page) ซึ่งมีข้อดีข้อเสียคือ
ข้อดี

• เร็วมาก (ไฟล์สเตติกบน CDN)
• ปลอดภัย (ไม่มีเซิร์ฟเวอร์ให้โจมตี)
• ต้นทุนต่ำ/สเกลง่าย
• เหมาะกับ Docs/KB/บล็อก/หน้าองค์กร

ข้อจำกัด

• เนื้อหาใหม่ต้อง rebuild ถึงจะขึ้นเว็บ
• ฟีเจอร์ไดนามิกต้องพึ่ง Client-side หรือ Functions/Serverless API

Cloudflare Page คืออะไร

ทำไมต้อง Cloudflare Page เพราะว่าเราอยู่ใน blog "เมื่องานฉันพบ Cloudflare" ก็ต้องใช้บริการของ Cloudflare ซิ! แล้ว Cloudflare Page คืออะไรล่ะ มันเป็นบริการของ Cloudflareเป็นแพลตฟอร์มสำหรับนักพัฒนาที่ช่วยให้ Deploy (ติดตั้ง) เว็บไซต์ Frontend หรือแอปพลิเคชัน Jamstack ได้ง่ายๆ โดยเชื่อมต่อกับ GitHub หรือ GitLab และมีการปรับใช้งาน (Deploy) อัตโนมัติไปยังเครือข่าย CDN ทั่วโลกของ Cloudflare โดยอัตโนมัติ พร้อมให้ URL สำหรับ Production และใบรับรอง SSL ฟรี

ทำไมต้อง Cloudflare Pages?

• เชื่อมต่อกับ GitHub/GitLab: ผู้ใช้สามารถเชื่อมต่อโปรเจกต์ของตนกับ Git repositories เช่น GitHub หรือ GitLab
• การ Deploy อัตโนมัติ: เมื่อโค้ดถูก Push ไปยัง repository ระบบของ Cloudflare Pages จะทำการสร้าง (Build) และปรับใช้ (Deploy) เว็บไซต์โดยอัตโนมัติ
• CDN ทั่วโลก: เว็บไซต์จะถูก Deploy ไปยังเครือข่าย CDN ของ Cloudflare โดยอัตโนมัติ ทำให้ผู้ใช้งานทั่วโลกเข้าถึงเว็บไซต์ได้อย่างรวดเร็ว
• URL สำหรับ Production: Cloudflare Pages จะสร้าง URL สำหรับเว็บไซต์ให้ทันที(โดยที่ไม่ต้องซื้อ domain เพิ่ม) เพื่อให้สามารถนำเว็บไซต์ขึ้นใช้งานจริงได้
• SSL ฟรี: มาพร้อมกับใบรับรอง SSL ในตัว ทำให้เว็บไซต์มีความปลอดภัยโดยไม่ต้องตั้งค่าเพิ่มเติม
• CI/CD ในตัว: มีไปป์ไลน์ CI/CD (Continuous Integration/Continuous Deployment) ในตัว ช่วยให้กระบวนการพัฒนาและ Deploy ไหลลื่น ต่อไปจะเป็นการกำหนดค่า Cloudflare Page

ขั้นตอนการกำหนดค่า Cloudflare Page

ในขั้นตอนนี้จะเป็นการ ตั้งค่า Cloudflare Page ในการเรียกใช้ Qautz ซึ่งเป็น Static Site Generator ในการนำข้อมูล Markdown ที่อยู่ใน github ของทีมมาสรา้งเป็น html static file แล้ว public ขึ้น website ของ Cloudflare Page

หมายเหตุเนื่องจากนี้เป็นโปรเจ็คที่ใช้ภายในบริษํทจึงไม่สามารถให้เห็น source ทั้งหมดได้ต้องขออภัยไว้ ณ ที่นี้ด้วย
ความต้องการเบื้องต้น

• Cloudflare Account

1. หลังจาก login เข้า Cloudflare สำเร็จจะเข้าสู่หน้า Dashboardที่ เมนูด้านซ้ายมือเลือก "Compute(Worker)--> Worker&Pages"
   

2. ที่หน้า "Get Started" ให้เลือกที่ "Import a repository" เนื่องจากเราใช้วิธี SGG จากนั้นคลิกปุ่ม "Get Started"
   

3. ที่หน้า "Import a repository" คลิกปุ่ม "Guthub"
   

4. Cloudflare จะพาไปยังหน้าของ Github โดยต้องทำการเลือก Org\Repoก่อนจากนั้นจะไปยังหน้า "Install & Authorize Cloudflare Workers and Pages"

5. เลือกที่ "Only select repositories" จากนั้นคลิกที่ปุ่ม "Select repositories" จากแสดงรายการ repository ทั้งหมดใน Org/Repo น้ั้นให้เลือก repository ที่ต้องการจากนั้นคลิกปุ่ม "Install & Authorize"
   

6. จะกลับไปหน้า "Get Started" ของColudflare(ในบางกรณีอาจจะต้องมีการยืนยันตัวตนเพื่อขออนุญาติเข้าถึงก่อน) ให้ไปที่แท็บ "Pages" จากนั้นไปที่ "Import an existing Git repository" แล้วคลิกปุ่ม "Get Started"
   

7. ที่หน้า "Deploy a site from your account" เลือกแท็บ "Github" จากนั้นจากแสดงชื่อ Github Account เมื่อเลือกแล้วให้คลิกปุ่ม "Begin setup"
   

8. ที่หน้า "Set up builds and deployments" จากแสดงข้อมูลให้กำหนดค่า

• "Project name": ชื่อ repository (อ่านได้อย่างเดียว)
• "Production branch": ชื่อ branch ใน git ที่จะนำมา deploy ไปยัง Cloudflare Page
• "Framework preset": None (Framework ในการสร้าง SSG เช่น NextJS,Gasby etc.)

*หมายเหตุเนื่องจาก เราใช้ Qaurtz จึงไม่จำเป็นต้องเลือก Framework

• Build command: bash ./scripts/setup_quartz.sh(run shell script)
• Build output directory: site/public (folder ที่เก็บไฟล์หลังจากสร้าง static site เสร็จแล้ว)
• จากนั้นคลิกปุ่ม "Save and Deploy"

1. จะไปยังหน้า "Building and deploying"เป็นการ build static site ไปยัง Cloudflare Page โดยใช้ Quartz
   

2. เมื่อทำการสรา้งเสร็จเราสามารถเข้าถึงผ่าน url https://{projectname}.pages.dev

บทส่งท้าย

บทความนี้พาทีม IT Support ย้ายองค์ความรู้ที่กระจัดกระจายให้มาอยู่ในที่เดียวด้วยแนวคิด Second Brain: จดบันทึกและเชื่อมโยงความรู้ใน Obsidian (โน้ต Markdown + wikilinks/graph), แปลงเป็นเว็บไซต์ด้วย Quartz (SSG) เพื่อให้ค้นหาและอ่านได้ง่าย แล้วดีพลอยขึ้น Cloudflare Pages เพื่อได้ CDN เร็วมาก, auto-deploy จาก Git, Preview ต่อ PR, HTTPS อัตโนมัติ และสามารถปิดเป็นภายในด้วย Cloudflare Access ได้ ผลลัพธ์คือเวิร์กโฟลว์แบบ DevOps สำหรับเอกสาร: เขียน → เปิด PR → รีวิว → Merge → เว็บอัปเดตอัตโนมัติ ทำให้ทีมตอบโจทย์งานซ้ำ ๆ ได้เร็วขึ้น มีมาตรฐาน และขยายทีม/ความรู้ได้ในระยะยาว