Firebase Hosting เป็น Web Hosting เช่นเดียวกับ Web Hosting ที่มีให้เช่าทั่วไป แต่ที่ต่างกัน คือ ไฟล์ที่วางอยู่บน Firebase Hosting ต้องเป็น Static file เท่านั้น ที่สำคัญเหนืออื่นใดคือไม่มีค่าใช้จ่าย และยังอนุญาตให้เราสามารถเก็บไฟล์ได้มากถึง 1 GB และรองรับการ Download  ถึง 10 GB
05

1. การเข้าใช้ Firebase

  1. เข้าไปที่เว็บไซต์ https://firebase.com/  > คลิกที่ LOGIN TO LEGACY CONSOLE01
  2. ทำการเข้าระบบคลิกที่ Sign in with Google

    2
  3. คลิกที่ปุ่ม CREATE NEW PROJECT

    3
  4. จะปรากฏ Dialog > พิมพ์ชื่อ Project name > เลือก Country/region > คลิกปุ่ม CREATE PROJECT04
  5. เมื่อเข้าหน้า Firebase Console ที่เมนูด้านซ้าย คลิกที่ Hosting

    5
  6. จะปรากฏ Dialog แนะนำโปรแกรม > คลิกปุ่ม GET STARTED
    6

2. การติดตั้ง Firebase (Install the Firebase CLI)

  1. การติดตั้งนั้น จะต้องติดตั้งผ่าน npm บน Node.js หากเครื่องของท่านยังไม่ติดตั้ง Node.js ไว้  ให้ทำการติดตั้งให้เรียบร้อยก่อน (แนะนำให้ติดตั้ง Version ล่าสุด) โดยคลิกที่ Node.js หรือเข้าไปที่เว็บไซต์ https://nodejs.org/en/
  2. เมื่อติดตั้ง Nod.js เรียบร้อยแล้ว เริ่มทำการติดตั้ง firebase โดยเปิด Command ขึ้นมา แล้วพิมพ์คำสั่งดังนี้
    $  npm install -g firebase-tools

    07

  3. เมื่อติดตั้งเรียบร้อย กลับไปที่หน้าเว็บ Firebase Console บน Dialog Set up hosting คลิกปุ่ม CONTINUE

3. การเข้าระบบ Firebase

  1. เปิด Command พิมพ์คำสั่งดังนี้
$ firebase login
  1. Firebase tools จะถามว่า อนุญาตให้ Firebase เก็บรวบรวมข้อมูลการใช้งาน ใช่หรือไม่ ให้ตอบ Y
  2. Firebase tools จะเปิดหน้าเว็บไซต์ขึ้นมา เพื่อขออนุญาตใช้ข้อมูลของคุณ ให้คลิกปุ่ม อนุญาต จากนั้นจะมี Dialog บอกว่า การ Login สำเร็จ0313

4. การเริ่มต้นใช้แอพ (Firebase Initialize)

  1. ย้ายตำแหน่ง Command ไปอยู่ที่ Folder ที่เราจะวางไฟล์เว็บ
  2. พิมพ์คำสั่งตามนี้
    $ firebase init
  3. ระบบก็จะถามว่า คุณพร้อมดำเนินการหรือไม่ ให้ตอบ Y
  4. ระบบก็จะถามว่า ต้องการติดตั้งอะไรบ้าง  มี 2 ตัวเลือก คือ Database (สำหรับ Firebase Realtime Database) และ Hosting ให้เลื่อนขึ้น-ลง ด้วยปุ่มลูกศร และใช้ปุ่ม Spacebar ในการ เลือก หรือ ไม่เลือก แล้วกด Enter เพื่อยืนยัน41
  5. ระบบจะถามว่า จะใช้งาน Firebase project ไหน ให้เลือกชื่อ Project ที่เราสร้างไว้ในตอนแรก

    42
  6. Firebase tools จะถามต่อว่า ต้องการใช้ public directory หรือไม่  กดปุ่ม Enter
  7. ระบบจะถามว่า จะสร้างไฟล์ index.html ภายในโฟลเดอร์ public หรือไม่ (ถ้ามีไฟล์เดิมอยู่ก่อน จะถูกเขียนทับ) ให้ตอบ Y44
  8. เสร็จสิ้นขั้นตอน Initialize

5. นำไฟล์ขึ้น Firebase Hosting

  1. คัดลอกไฟล์ทั้งหมดที่ท่านต้องการอัฟโหลดไปไว้ในโฟลเดอร์ public
  2. เปิด command และพิมพ์คำสั่งนี้
$ firebase deploy
  1. ระบบจะทำการอัพโหลดทุกไฟล์ที่อยู่ในโฟลเดอร์ public ขึ้นไปเก็บไว้บนโฮสต์
  2. เมื่ออัพโหลดเสร็จสิ้นให้เปิดหน้า Firebase Console ถ้ายังเปิด Dialog ค้างไว้ คลิกปุ่ม FINISH จะมี Link ให้คลิกเข้าไปดูเว็บไซต์ของเรา ดังรูป

19

ตัวอย่างผลงาน