< Nick Untitled

#39 - ย้าย Static Blog จาก GitHub ไปยัง DigitalOcean App Platform

ก่อนหน้านี้เดิมทีเราเปลี่ยนบล็อกจาก WordPress มาเป็น Static Blog อย่าง Jekyll แทนเนื่องมาจากเราไม่ต้องการใช้ฟีเจอร์อะไรเยอะแยะทีทาง WordPress ให้ และต้องการความเร็วในการโหลดมากกว่าเดิมที่ทาง WordPress ให้ไม่ได้ โดยหลังจากเปลี่ยนบล็อกแล้ว เรายังเปลี่ยนและย้ายจาก Web Hosting เจ้าหนึ่งมาไว้บน GitHub Pages แทน

ผลลัพธ์ที่ได้ถือว่าโอเคเลยแหละ อย่างไรก็ดี พอใช้งานไปซักพักเราก็มองว่ามองไม่ค่อยจะสะดวกเท่าไร ก็เพราะว่าเวลาที่เราเขียนบทความหนึ่งเสร็จปุ๊บ เราจำเป็นต้องพิมพ์คำสั่งใน Command Line bundle exec jekyll build เพื่อที่จะรัน Jekyll สำหรับสร้าง Static Blog ที่มีบทความอันล่าสุด แล้วเรานำไฟล์ที่อยู่ในโฟลเดอร์ _site ย้ายมาเก็บไว้ใน Repository ของ GitHub Pages

นอกจากเหตุผลนี้แล้ว ยังมีอีกเหตุผลนึงเลยคือทางเว็บไซต์อย่าง GitHub จะนำข้อความ ข้อมูลไฟล์โค้ดต่าง ๆ ใน Public Repositories มาเทรนตัวโมเดล AI ของทางบริษัทเอง [1] ซึ่งจุดนี้เราก็มองว่า ไหน ๆ เราก็เขียนบทความนึงอย่างยากลำบากแล้ว ทำไมเราต้องปล่อยให้ทางบริษัทเอาข้อมูลไปให้เทรน AI ฟรี ๆ ล่ะ?

ด้วยสองเหตุผลนี้แหละ ทำให้เรามองหาพื้นที่เก็บ Statifc Blog ใหม่ จนกระทั่งมาพบกับ DigitalOcean App Platform

DigtialOcean App Platform

DigitalOcean App Platform

DigitalOcean App Platform [2] (ในบทความนี้จะเรียกว่า DO App Platform) เป็นบริการ Platform-as-a-Service (PaaS) ที่อนุญาตให้นักพัฒนาสามารถ deploy ติดตั้ง ดูแล และจัดการเว็บแอพ, เว็บแบบ Static, และ APIs โดยไม่จำเป็นต้องจัดการกับ Infrastructure

นอกจากนี้ DO App Platform ยังรองรับ

  • การ deploy อัตโนมัติจาก Repositories บนเว็บอย่าง GitHub, GitLab หรือ BitBucket
  • การเชื่อมต่อกับ Database

เป็นต้น

บริการนี้มีแพคเกจ 2 แพคเกจ ได้แก่

  • Free Tier ที่รองรับการติดตั้งเว็บแบบ Static ทั้งหมด 3 เว็บไซต์ที่มี Bandwidth 1 GB ร่วมกับรองรับการ deploy จาก GitHub, GitLab และ Container Registries อีกทั้งยังรองรับ HTTPS, Custom Domain, CDN, DDoS และอื่น ๆ
  • Paid Tier ที่มีราคาเริ่มต้นอยู่ที่ 5 ดอลลาร์ โดยมี Feature ทั้งหมดจาก Free Tier และยังรองรับ CPU แบบ Shared กับ Dedicated ร่วมกับรองรับการ Scale อัตโนมัติ, บริการ Patch OS อันโนมัติ, บริการ Metric ต่าง ๆ, High Availability, ฐานข้อมูลแบบ Development และ Production, การ Rollback ทั้งหมด 10 revisions เป็นต้น

ในบทความนี้เราจะใช้แพคเกจแบบ Free Tier เนื่องมาจากเราต้องการติดตั้งเว็บแบบ Static Site

การย้ายเว็บจาก GitHub Pages มายัง DO App Platform

การย้ายเว็บจาก GitHub Pages มายังแพลตฟอร์มนี้ทำได้ง่าย เพียงแค่

  1. เข้าไปยังหน้าเว็บของ DigitalOcean
  2. เข้าสู่ระบบไปยัง Project ที่เราใช้งานอยู่แล้วเลือกไปที่ App Platform
  3. กดปุ่ม Create App เพื่อที่จะติดตั้งเว็บ
  4. เมื่อเข้าหน้า Create App แล้วให้เราเลือก Repositories ที่เราได้เก็บตัวไฟล์ที่เกี่ยวกับบล็อกของเราที่ใช้งานแพลตฟอร์มอย่าง Jekyll ร่วมกับเลือก Branch ที่เราต้องการ
  5. ติ๊กที่ Autodeploy เมื่อตัว Repositories และ Branch นั้น ๆ ถูกอัพเดต ทาง DigitalOcean จะ deploy ให้อัตโนมัติ
  6. กดปุ่ม Next

หน้าจอ Create App ที่ตั้งค่าเรียบร้อย หน้าจอ Create App ที่ตั้งค่าเรียบร้อย

เมื่อเข้ามาหน้าต่อไปที่เป็น Configure App แล้ว ให้เรา

  1. ลบตัว Resource ที่ไม่เกี่ยวข้อง
  2. กำหนด Resource นั้น ๆ ให้เป็น Static Site
  3. ตั้งค่าการ deploy โดยอ่านสคริปที่เขียนใน Dockerfile ที่เรากำหนดให้สร้างตัวหน้าเว็บ Static ออกมาโดยใช้ Jekyll
  4. กำหนดตำแหน่งโฟลเดอร์ที่เก็บไฟล์ที่ตัว Jekyll ได้สร้างแล้ว
  5. กำหนดตำแหน่งของเว็บ Static ที่เราจะติดตั้ง ในที่นี้เราจะเลือกไว้ที่สิงคโปร์
  6. กำหนดชื่อแอพที่เราต้องการ

หน้าจอ Configure App ส่วนการตั้งค่า Resource หน้าจอ Configure App ส่วนการตั้งค่า Resource

หน้าจอ Configure App ส่วน Deployment หน้าจอ Configure App ส่วน Deployment

หน้าจอ Configure App ส่วนตำแหน่งของหน้าเว็บ และชื่อแอพ หน้าจอ Configure App ส่วนตำแหน่งของหน้าเว็บ และชื่อแอพ

ส่วนอันนี้เป็นตัวอย่าง Dockerfile ที่เขียนไว้

FROM ruby:3.4.5-alpine3.22
RUN apk update
RUN apk add --no-cache ruby-dev build-base git
RUN apk add --no-cache nodejs
RUN gem install jekyll

WORKDIR /workspace
COPY . /workspace

RUN chmod a+w Gemfile.lock

# Install theme dependencies
RUN bundle install

# Same with this junk, if we don't create the folders ourselves,
# stuff crashes on permission errors...
RUN mkdir _site .jekyll-cache

# Build Article
RUN bundle exec jekyll build

เมื่อทำเสร็จแล้ว กดปุ่ม Create App ระบบจะติดตั้งตัวเว็บ Static

เมื่อติดตั้งเสร็จแล้วให้กำหนด Domain โดย

  1. เข้าไปยัง Settings แล้วเลื่อนลงไปยัง Domains
  2. เพิ่ม Domain ลงไปในระบบ
  3. เมื่อเพิ่มเสร็จแล้ว ระบบจะกำหนดค่า DNS A กับ CNAME มาให้เราไปตั้งค่าใน DNS ที่เราได้ใช้บริการ

แค่นี้เว็บเราก็ย้ายมาจากทาง GitHub Pages มายังแพลตฟอร์มนี้แล้ว

หลังจากการย้าย

เมื่อเราย้ายมายังแพลตฟอร์มนี้แล้ว ตัวความเร็วของตัวเว็บถือว่าโอเค แถมยังสะดวกกว่าการใช้งาน Github Pages แบบเดิม ๆ เสียอีกก็เพราะว่าเราไม่จำเป็นต้องมานั่งสร้างตัวหน้าเว็บ static เองด้วยการพิมพ์คำสั่ง bundle exec jekyll build เราทำเพียงแค่

  1. commit และ push ตัว GitHub Repository นั้น ๆ
  2. ทาง DigitalOcean ก็จะ deploy ให้อัตโนมัติเลย

โดยข้อดีข้อที่สองนี้เองทำให้เราเขียนบล็อกได้สะดวกมากกว่าแต่ก่อน ตัวอย่างเช่น เราอยากจะเขียนบล็อกบน iPad เราก็ทำได้โดยเราใช้แอพ Working Copy เพื่อที่จะโคลนตัว Repository นั้น ใช้แอพที่เป็นการแก้ไขโค้ดอย่าง Textastic เขียนบล็อก จากนั้นเปิด Working Copy เพื่อ commit และ push ไปยัง Repository นั้น แค่นี้ก็เป็นการเขียนและเผยแพร่บทความใหม่แล้ว

ที่มา

  1. https://github.com/orgs/community/discussions/135400
  2. https://www.digitalocean.com/products/app-platform


Kittisak Chotikkakamthorn

จบทั้งแพทย์ + วิศวะร่วมกับผ่านการฝึกงานทางด้าน AI ที่มหาวิทยาลัยที่ไต้หวันที่พัฒนาเทคนิค Machine Learning ที่เป็น state-of-the-art (SOTA) สำหรบัการแก้ปัญหาทางการแพทย์ ปัจจุบันเขียนบล็อกโดยสนใจเกี่ยวกับทางด้าน Coding, AI, Data รวมถึงเขียนเป็นไดอารี่เป็นหลัก

ผู้อ่านสามารถส่งอีเมลมาทาง contact[at]nickuntitled.com

↑ Go to top


© 2025 Nick Untitled is licensed under CC BY 4.0 / Privacy Policy