Kalian ingin memiliki sebuah blog atau website statis atau landing page tapi belum memiliki modal? Google Fire Base bisa menjadi solusi bagi kalian karena kalian bisa membuat sebuah blog atau website statis secara gratis lengkap dengan subdomain yang diberikan.

Oleh karena itu, dalam artikel ini Qiannah Update Media akan memberikan tutorial dan caranya lengkap untuk membuat sebuah blog di Google Firebase. Namun sebelum itu kami akan membahas terlebih dahulu mengenai layanan dari google yang satu ini.

Apa Itu Google Firebase?

Firebase adalah platform pengembangan aplikasi yang dipersembahkan oleh Google. Platform ini menawarkan beragam layanan yang dapat membantu pengembang membangun aplikasi mobile yang tangguh, skala tinggi, dan berkinerja tinggi dengan mudah. Firebase menyediakan alat yang dibutuhkan untuk mengelola infrastruktur aplikasi, pengelolaan database, otentikasi pengguna, dan masih banyak lagi.

Fitur Google Firebase

Firebase Realtime Database: Firebase Realtime Database adalah layanan database cloud yang dapat menyimpan dan menyinkronkan data secara real-time antara pengguna dan server. Ini memungkinkan pengembang untuk membuat aplikasi kolaboratif, seperti aplikasi obrolan, aplikasi pembaruan waktu nyata, dan banyak lagi.
Firebase Authentication: Otentikasi pengguna merupakan komponen kunci dalam pengembangan aplikasi yang aman. Firebase Authentication menyediakan sistem otentikasi yang kuat dan mudah digunakan untuk mengelola autentikasi pengguna, termasuk autentikasi email, Google, Facebook, Twitter, dan masih banyak lagi. Dengan Firebase Authentication, pengembang dapat dengan cepat mengimplementasikan otentikasi pengguna yang aman dalam aplikasi mereka.
Firebase Cloud Messaging: Firebase Cloud Messaging (FCM) adalah layanan pengiriman pesan yang dapat mengirimkan pemberitahuan push ke pengguna di semua platform, seperti Android, iOS, dan web. FCM memungkinkan pengembang untuk berkomunikasi dengan pengguna mereka secara langsung dan menyampaikan pesan penting atau pembaruan aplikasi dengan cepat.
Firebase Hosting: Firebase Hosting adalah layanan hosting yang menyederhanakan proses hosting aplikasi web dan konten statis. Dengan Firebase Hosting, pengembang dapat dengan mudah menyebarkan aplikasi web mereka dengan menggunakan domain khusus atau subdomain Firebase.
Firebase Performance Monitoring: Kinerja aplikasi yang baik sangat penting untuk memberikan pengalaman pengguna yang baik. Firebase Performance Monitoring membantu pengembang dalam melacak dan menganalisis performa aplikasi mereka dengan mudah. Dengan alat ini, pengembang dapat mengidentifikasi area yang perlu ditingkatkan dan mengoptimalkan kinerja aplikasi mereka.

Karena kita akan membuat sebuah website statis, maka fitur yang akan kita gunakan adalah fitur nomor 5 yaitu Firebase Hosting.

Langkah Membuat Blog di Google Firebase

Untuk memudahkan prosesnya, terlebih dahulu silahkan kalian login ke akun Google pada browser yang kalian gunakan.

Mengunjungi Laman Google Firebase

Langkah pertama yang harus kalian lakukan adalah mengunjungi halaman resmi Google Firebase.

Setelah mengunjungi laman Firebase maka langkah selanjutnya adalah login ke dashboard dengan klik tombol Mulai.

Membuat Project

Setelah berhasil login, maka langkah selanjutnya adalah membuat project dengan klik tombol Create Project.

Masukkan Informasi Project

Langkah selanjutnya adalah memasukkan informasi project:

Masukkan Nama Project ( contoh updatemedia )
Ceklist Terms
Ceklist I confirm that I will use Firebase exclusively for purposes relating to my trade, business, craft, or profession.
Klik tombol Continue
Enable Google Analytics for this project ( OPSIONAL )
Klik tombol Continue

Setelah kalian klik tombol Continue maka silahkan menunggu terlebih dahulu hingga project kalian selesai dibuat.

Membuat Blog di Google Firebase

Selanjutnya adalah kita akan mulai membuat blog yang kita inginkan. Untuk langkahnya sendiri sebagai berikut:

Unduh dan Install Aplikasi Node JS

Langkah pertama yang harus kalian lakukan adalah unduh dan install aplikasi Node JS pada perangkat komputer ataupun laptop yang kalian miliki.

Untuk link unduhan node js sendiri silahkankan klik link berikut ini unduh Node JS.

Setelah kalian melakukan instalasi dan selesai maka silahkan ikuti langkah dibawah ini:

Proses membuat Blog

Klik icon </> pada laman dashboard Firebase
Masukkan nama aplikasi
Ceklist Also set up Firebase Hosting for this app
Silahkan pilih Create A New Site pada kolom dibawahnya
Masukan nama subdomain kalian
Klik tombol register app
Buka Command Prompt
(Add Firebase SDK) Pastekan perintah npm install firebase dan jalankan pada command prompt kemudian tunggu hingga selesai
Klik tombol Next pada laman Firebase
(Install Firebase CLI) pastekan perintah npm install -g firebase-tools dan jalankan pada command prompt kemudian tunggu hingga selesai.
Klik tombol Next pada laman Firebase
Pastekan Perintah firebase login
Allow Firebase to collect CLI and Emulator Suite usage and error reporting information? (Y/n) Y
Login menggunakan akun Google Kalian
Jalankan perintah firebase init pada command prompt
Are you ready to proceed? Y
Pilih Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys ( dengan cara gunakan panah kebawah pada keyboard hingga pilihan diatas kemudian tekan spasi kemudian klik Enter
What do you want to use as your public directory? (public) TEKAN ENTER
Configure as a single-page app (rewrite all urls to /index.html)? N
Set up automatic builds and deploys with GitHub? N
Jalankan Perintah Firebase Deploy

Setelah kalian jalankan perintah deploy maka akan muncul notifikasi url Project Console dan alamat url website milik kalian. Namun setelah dibuka url website yang kalian buat tersebut akan tampil halaman selamat datang seperti gambar dibawah ini:

Cara Membuat Blog di Google Firebase Terbaru dan Lengkap 2023 3

Agar tampilan website yang kalian tersebut sesuai yang kalian inginkan, maka kita harus ngubah file defaultnya. Untuk langkahnya sendiri sebagai berikut:

Buka Drive C:\
Buka Folder User / Pengguna
Buka Folder Nama Pengguna ( misal perangkat yang digunakan Lenovo umumnya memiliki folder dengan nama Thinkpad )
Buka Folder Public
Hapus seluruh File dalam folder public
Pastekan file website yang kita miliki
Jalankan perintah Firebase Deploy pada Command Prompt

Setelah kalian deploy ulang maka tampilan website kalian akan berubah sesuai dengan tampilan website yang telah kalian buat sebelumnya.

Untuk contoh yang telah kami buat, kalian bisa melihat link berikut https://updatemedia-c9dab.web.app/.

Itulah tadi informasi dan tutorial yang bisa kami berikan, semoga dapat membantu kalian.

Table of Contents