Software Development

Firebase Tutorial for Beginners – Build a Mobile App with HTML, CSS, JavaScript



Discover ways to construct a Mobile App with HTML, CSS, JavaScript and Google Firebase. Go right here to strive the interactive browser-version:

Thank you for reading this post, don't forget to subscribe!

✏️ This course was created by Rafid Hoda, a instructor at Scrimba. You may comply with Rafid on Twitter right here:

We advocate that you just be taught fundamental HTML, CSS, and JavaScript earlier than taking this course.

💫 Hyperlinks talked about:

🔗 EpochConverter:
🔗 Meta viewport defined by Kevin Powell:

🛠 Instruments used:
🔗 Firebase:
🔗 Favicon:
🔗 Netlify:
🔗 Figma:
🔗 Google Fonts:

⭐️ Code ⭐️
🔗 Obtain through Scrimba:

🐱 Wish to get entry to the lovable cat photos used on this course?
→ Seek for “Peach and Goma cat” on Google Picture.

⭐️ Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:01:57) Let’s Build a Mobile App with Firebase
⌨️ (0:06:02) Organising app skeleton
⌨️ (0:09:53) Including CSS
⌨️ (0:14:16) Apart: Firebase Realtime Database
⌨️ (0:24:21) Including Firebase to challenge
⌨️ (0:29:13) Safety Guidelines
⌨️ (0:31:46) innerHTML to append li to ul
⌨️ (0:35:23) Refactoring
⌨️ (0:40:15) Apart: Turning an Object into an Array
⌨️ (0:44:28) Apart: Fetching database gadgets in realtime utilizing onValue
⌨️ (0:54:54) Updating gadgets in realtime
⌨️ (0:57:41) For loop to render database gadgets
⌨️ (1:00:42) Let’s smash the bug
⌨️ (1:03:32) Apart: Flexbox flex-wrap
⌨️ (1:04:54) Apart: Flexbox hole
⌨️ (1:06:15) Including CSS for li to wrap gadgets
⌨️ (1:10:22) Getting ID of merchandise in database
⌨️ (1:14:35) Changing innerHTML with createElement
⌨️ (1:19:48) Apart: Eradicating gadgets from Firebase
⌨️ (1:25:09) Eradicating an merchandise when clicked
⌨️ (1:29:22) Solely fetching gadgets from database if snapshot exists
⌨️ (1:33:28) Including hover kinds to buttons
⌨️ (1:35:20) Apart: user-select
⌨️ (1:37:04) Apart: Setting the viewport
⌨️ (1:38:58) Making the app extra mobile-friendly
⌨️ (1:40:35) Apart: Favicon
⌨️ (1:42:42) Including favicon and cellphone icons
⌨️ (1:43:58) Apart: Internet Application Manifest
⌨️ (1:46:39) Turning internet app into “cell” app
⌨️ (1:47:40) Personalise your app
⌨️ (1:49:10) Deploy to Netlify
⌨️ (1:51:48) Add app to house display screen
⌨️ (1:53:44) Share your creation
⌨️ (1:55:32) Recap
⌨️ (1:59:16) Outro + Credit

Observe Scrimba on YouTube:
Observe Scrimba on Twitter:

source

Comments are closed.