Skip to main content

Firebase Hosting


[Firebase Hosting] คืออะไร มาทำความรู้จัก และมาใช้งานเบื้องต้นกัน


image.png


ถ้ามีคนถามว่า Firebase คืออะไรนี่คือคำตอบเบื้องต้นสำหรับทุกคน

Firebase Hosting คือ Tools สำหร้บสร้าง Hosting ที่สะดวกและเป็นที่นิยมของ Firebase โดยเราสามารถใช้งานเบื้องต้นได้แบบไม่มีค่าใช้จ่าย ซึ่งสามารถทำให้เรามีหน้าเว็บไซต์ที่สมบูรณ์และพัฒนาไปต่อได้ แต่ก็มีข้อจำกัดในด้านการทำงานหลายๆ อย่างซึ่ง หากต้องการใช้ Feature เพิ่มเติมสามารถตรวจสอบที่ Firebase pricing ของตัว Firebase ได้เลยครับ

. . .


การสร้าง Firebase Project

สำหรับการสร้าง​ Firebase เบื้องต้นเราสามารถดูวิธีการสร้างต่างๆ ในการทำและการสร้างโปรเจคได้ใน Book เล่มนี้ใน หน้าก่อนหน้าที่จะถึงเพื่อเป็นแนวทางในการใช้งานต่อไป

. . .


เริ่มใช้งาน Firebase Hosting

เมื่อสร้าง Project เสร็จแล้ว กลับมาที่หน้า Project Overview ให้มองหาเมนู Hosting และจะคลิกที่ Card หรือที่ Sidebar ก็ได้ครับ

Screenshot 2565-11-10 at 22.45.34.png


เมื่อเข้ามาสู่หน้า Hosting เราจะพบกับหน้าจอดังภาพด้านล่าง คลิกที่ เริ่มต้นใช้งาน




Screenshot 2565-11-10 at 22.38.24.png



ขั้นตอนการใช้งาน firebase Hosting 


1.ติดตั้ง Node.js เพื่อเรียกใช้งาน Node package Manager

โดยเราจะเริ่มต้นด้วยการติดตั้งตัว Node.js เป็นอันดับแรก หากยังไม่ได้ติดตั้งสามารถติดตั้งได้ที่ Node.JS ซึ่งสาเหตุที่เราต้องติดตั้งตัว Node.js ก่อนเป็นเพราะว่าการติดตั้งตัว Package firebase ที่เป็นปัจจุบันจำเป็นต้องทำการติดตั้งผ่านทาง NPM โดยสามารถเช็ค ว่ามี Node.js บนเครื่องของเราแล้วหรือยังแล้วหรือยังโดยการใช้งานคำสั่ง 


node --version 
npm --version

หมายเหตุ: version ขั้นต่ำของ Node ที่รองรับคือ 6.0.0


 

image.png

เมื่อ run command ผ่านผลลัพธ์จะได้แบบนี้

2. ติดตั้ง Firebase CLI

Run คำสั่งใน terminal /cmd เพื่อทำการติดตั้งตัว FIrebase CLI ได้เลยด้วยคำสั่ง

npm install -g firebase-tools

หมายเหตุ: แนะนำให้อัพเดต Firebase CLI ด้วยคำสั่งนี้สม่ำเสมอ เนื่องจากจะได้ผลประโยชน์จากการอัพเดต patch ทำให้ได้รับการแก้ Bug และ features ใหม่ทำให้ทันสมัยอยู่สม่ำเสมอ 

 

Screenshot 2565-11-10 at 23.45.46.png

จากนั้นก็เช็คว่าตัวเครื่องของคุณได้ทำการติดตั้ง Firebase CLI เรียบร้อยแล้วหรือไม่ด้วยการรันคำสั่ง (ถ้าผ่านจะเห็นเลย เวอร์ชั่นของ Firebase แบบชัดเจน

firebase --version


Screenshot 2565-11-11 at 00.40.31.png

3. Initial Project

เริ่มต้นให้ run คำสั่งด้านล่างนี้ใน terminal หรือ commandline โดย browser จะปิดขึ้นมาแล้วให้คุณ Login ด้วย account เดียวกับที่ทำการสร้างโปรเจค

firebase login

 จากนั้นทำการสร้าง directory ที่จะเก็บไฟล์ แล้วก็ทำการ shell เข้าไปที่ directory นั้น 

mkdir Hosting
cd Hosting/

เมื่อเข้าไปที่ directory ที่ต้องการแล้วให้ทำการ initial project ด้วยการใช้คำสั่ง 

firebase init

จะเจอคำว่า Firebase เป็นไฟ LED เท่ๆ พร้อมแบบเมนูให้เลือก feature ของ Firebase CLI ที่ต้องการใช้งาน โดยให้เลือก Hosting แล้ว enter ไป