สร้างเว็บไซด์ด้วย Hugo และโฮสต์บน Firebase

สร้างเว็บไซด์ด้วย Hugo และโฮสต์บน Firebase

ทำไมต้อง Hugo

 Hugo เป็นโปรแกรมสำหรับสร้างเว็บไซด์แบบ Static เรียกโปรแกรมประเภทนี้ว่า Static Site Generator (SSG) ซึ่งเป็นทางเลือกสำหรับผู้ไม่ต้องการใช้โปรแกรมประเภท Content Management System (CMS) เพราะเว็บไซด์แบบ Static มีข้อดีตรงที่ทำงานรวดเร็ว และประหยัดทรัพยากร เหมาะสำหรับเว็บไซด์ที่ต้องการนำเสนอข้อมูล มากกว่าการตอบโต้กับผู้ที่เข้ามาใช้

  Hugo ถูกพัฒนาด้วยภาษา Go โดยทีมงานของนาย บียอร์น เพเดอร์สัน (Bjørn Erik Pedersen) ตั้งแต่ปี 2013

ติดตั้ง Hugo บน Mac โดยใช้ Homebrew  (หากยังไม่มี Homebrew สามารถดาวโหลดที่เว็บไซด์ brew.sh)

brew install hugo

เริ่มสร้างเว็บไซด์ด้วย Hugo

hugo new site MyHugoSite
cd MyHugoSite
git init

อธิบายคำสั่ง

hugo new site เป็นการสั่งให้สร้างไดเร็กทอรี่ของเว็บไซด์และเว็บไซด์ขึ้นมาใหม่ในชื่อที่เรากำหนด ซึ่งในตัวอย่างคือ MyHugoSite

cd MyHugoSite เข้าไปยังไดเร็กทอรี่ที่สร้างขึ้นมา

git init เป็นการกำหนดค่าเริ่มต้นของ respiratory ในไดเร็กทอรี่ปัจจุบัน

กำหนด Themes สำหรับเว็บไซด์

เราสามารถเข้าไปเลือก Themes ที่ต้องการได้จาก https://themes.gohugo.io ซึ่งแต่ละ Themes ในนั้นจะบอกวิธีการ install เอาไว้ด้วย ซึ่งสามารถ copy มาวางใน Terminal ได้เลย  ดังตัวอย่างได้เลือกใช้  'ananke'

git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke
echo "theme = 'ananke'" >> config.toml

ติดตั้ง Firebase

install Firebase

npm install -g firebase-tools

ล๊อกอิน

firebase login

initialize

เข้าไปยังไดเร็กทอรี่ของเว็บไซด์ที่คุณสร้างขึ้น แล้วใช้กำสั่ง

firebase init

ในขั้นตอนนี้จะมีอ๊อฟชั่นเมนู ขึ้นมาให้เราเลือกหลายอัน ให้เลือกเมนู Hosting (เลื่อนเคอร์เซอร์ด้วยการกด space bar)

Upload เว็บไซด์ไปยัง Firebase

firebase deploy