What is Authentication :emoji:

:dart: Learning Objectives

By the end of this lesson, you will be able to:

• Understand what authentication is and why it's important
• Identify different types of authentication methods
• Set up Firebase Authentication for your web applications
• Create and manage a Firestore database
• Connect authentication with database operations

:information_source: Authentication is the process of checking who someone is when they try to use a website or app. It's like showing your ID card to enter a building - the system needs to know you're allowed to be there!

Why Do We Need Authentication? :emoji:

• Most popular websites use authentication. You create an account and log in to use their services.

• Authentication protects your data. It makes sure only the right people can see personal information.

• It prevents identity theft. Bad actors can't pretend to be you when authentication is in place.

:memo: Note Think of authentication like a bouncer at a club - they check if you're on the guest list before letting you in!

Types of Authentication Methods :emoji:️

There are several ways websites can verify who you are:

1. Email & Password --- The most common method. Users sign up with their email and create a password. The downside? People often forget their passwords!

2. Username & Password --- Similar to email/password, but users also need a unique username. This means remembering three things: username, email, AND password.

3. Phone Number --- Popular with mobile apps and shopping sites. Users enter their phone number and get a text message to verify it's really them.

4. Third-party Authentication --- Super convenient! Users log in with accounts they already have (like Google, Facebook, or GitHub). No new passwords to remember!

5. Magic Link --- The easiest method! Users just enter their email and get a special link. Click the link, and you're logged in - no password needed!

:bulb: Tip Password-based authentication is still the most popular choice because it's familiar to users and easy to implement!

Three Essential Authentication Actions :emoji:

Every authentication system needs these three basic actions:

1. Sign Up (Register) :memo:

   • New users create their account
   • They choose a password and provide their information

2. Sign In (Login) :emoji:

   • Existing users enter their credentials
   • The system checks if the password matches

3. Sign Out (Logout) :emoji:

   • Users leave their account
   • The system forgets they were logged in

Firebase Authentication :fire:

Firebase Authentication makes it super easy to add user login to your apps! Here's why it's awesome:

Why Use Firebase Authentication? :sparkles:

• Easy to Build --- Create secure login systems without being a security expert
• Google-Powered Security --- Uses the same technology that protects billions of Google accounts
• Quick to Code --- Just a few lines of code gets you started
• Multiple Options --- Supports email/password plus social logins (Google, Facebook, Twitter, and more)

What You'll Learn to Code :computer:

In this lesson, you'll master these Firebase Authentication skills:

• Register new users with their email and password
• Log in existing users to your app
• Check login status to see who's currently signed in
• Log out users when they're done

Watch the introduction video: https://youtu.be/8sGY55yxicA

How to Use Firebase Authentication :hammer_and_wrench:

Let's learn Firebase Authentication by building it into our Mood Tracker Project!

Getting Started :rocket:

1. Visit the Firebase website: https://firebase.google.com/
2. Log in with your Google account
3. Open your Mood Tracker project

What We'll Build Together :emoji:‍:computer:

• Set up Firebase Authentication in your project
• Create a registration system for new users
• Build a login page for returning users
• Track who's logged in at any time
• Add a logout button to sign users out

Step-by-Step Setup Guide :clipboard:

Step One: Navigate to Authentication

• Find the Build section in your Firebase console
• Click on "Authentication"

Step 2: Initialize Authentication

• Click "Get started" to begin setup

Step 3: Choose Your Sign-in Method

• Click on "Sign-in method" tab

Step 4: Enable Email/Password

• Select "Email/Password" option
• Toggle the "Enable" switch
• Click "Save" to confirm

:memo: Note :tada: Congratulations! Your authentication system is now ready to use!

Finding the Code You Need :mag:

Firebase provides excellent documentation with ready-to-use code examples!

Step One: Access the Documentation

• Click "Go to docs" button

Step 2: Navigate to Authentication Docs

• Hover over the Build menu
• Click on "Authentication"

Step 3: Find Web-Specific Code

• Navigate to "Authentication > Web > Get Started"
• This page contains all the code for:
  • Signing up new users
  • Logging in existing users
  • Logging out users
  • Checking authentication status

:bulb: Tip Bookmark this documentation page! You'll use it frequently when building the authentication features for your Mood Tracker Project.

Authentication Summary :books:

Let's review what we've learned about authentication:

:information_source: Key Takeaways:

• :emoji: Authentication verifies who users are before giving them access
• :emoji:️ It protects personal data and prevents identity theft
• :emoji: Email/password is the most common authentication method
• :emoji: Every auth system needs: sign up, sign in, and sign out
• :fire: Firebase Authentication makes building secure login systems easy
• :emoji: Firebase docs provide ready-to-use code examples
• :emoji: Multiple sign-in options are available (email, social logins, etc.)

What is a Database? :emoji:

:information_source: Info A database is like a super-organized digital filing cabinet. It stores all your app's information in a way that makes it easy to find, update, and use whenever you need it!

Database Management Systems :emoji:️

A Database Management System (DBMS) is the software that helps you work with your database. Think of it as the librarian who helps you find and organize books! For example: Node.js + Firebase.

Types of Databases :bar_chart:

There are two main categories of databases:

SQL Databases (Traditional) :clipboard:

• Store data in tables (like spreadsheets)
• Great for structured, related data
• Examples: MySQL, PostgreSQL

NoSQL Databases (Modern) :page_facing_up:

• Store data in documents (like JSON files)
• Perfect for flexible, changing data
• Used by tech giants like Google, Facebook, and Amazon

:memo: Note Why NoSQL is Popular:

• :zap: Lightning fast even with millions of records
• :chart_with_upwards_trend: Easy to grow as your app gets bigger
• :wrench: Flexible structure for different types of data

Firestore Database :fire:

Firestore is Firebase's powerful NoSQL database that makes data management super easy!

What Makes Firestore Special? :sparkles:

• Cloud-Based --- Your data lives safely in the cloud
• NoSQL Structure --- Stores data as collections and documents (like organized folders and files)
• Real-time Sync --- Changes appear instantly across all devices
• Cross-Platform --- Works with iOS, Android, and web apps

How Firestore Organizes Data :file_folder:

Firestore uses a simple structure:

• Collections = Folders that group similar data
• Documents = Individual data files (like JSON)

:bulb: Tip Think of Firestore like a filing system: Collections are the drawers, and documents are the files inside!

Watch the introduction video: https://youtu.be/QcsAb2RR52c

How to Use Firestore Database :hammer_and_wrench:

Let's build a database for our Mood Tracker Project!

Getting Started :rocket:

1. Visit Firebase: https://firebase.google.com/
2. Log in with your Google account
3. Open your Mood Tracker project

What You'll Learn :books:

In this section, we'll cover:

• Setting up Firestore Database in your project
• Adding data manually through the Firebase console

Step-by-Step Firestore Setup :clipboard:

Step One: Navigate to Firestore

• From Project Overview (Home)
• Click "Cloud Firestore"

Step 2: Create Your Database

• Click "Create database"

Step 3: Choose Security Mode

• Select "Start in test mode" (perfect for learning!)
• Click "Next"

Step 4: Select Your Region

• Choose the nearest location (Asia-Southeast1 for Singapore)
• Click "Enable"

Step 5: Configure Security Rules

• Go to the Rules tab
• Change read and write to true
• Click "Publish"

Step 6: Ready to Go!

• Return to the Data tab
• Your database is now ready!

:memo: Note Test mode is great for learning, but remember to add proper security rules before launching your app!

Adding Your First Data :memo:

Let's create some mood entries for our Mood Tracker!

Step One: Create a Collection

• Click "+ Start collection"
• Name it moodEntries
• Click "Next"

Step 2: Add a Document

• Create an ID for your document:
  • Type your own ID, OR
  • Click "Auto-ID" for a random one
• Click "+" to add fields
• Set the field type and value
• Click "Save"

Step 3: View Your Data

• Your data appears as a collection of documents
• Each document has its own ID
• Collections group related documents together

:bulb: Tip Pro tip: Use descriptive field names like "mood", "date", and "notes" to make your data easy to understand!

Database Summary :books:

Let's review what we've learned about databases and Firestore:

:information_source: Key Takeaways:

• :emoji: Databases store and organize your app's data
• :emoji:️ DBMS software helps you manage databases
• :bar_chart: Two main types: SQL (tables) and NoSQL (documents)
• :fire: Firestore is Firebase's NoSQL database
• :file_folder: Data is organized in collections and documents
• :zap: Real-time sync keeps data updated everywhere
• :hammer_and_wrench: Easy setup through Firebase console
• :memo: You can add data manually or through code

Practice Time! :dart:

Now that you understand authentication and databases, try these exercises:

1. Authentication Challenge:

   • Set up Firebase Authentication in a new project
   • Create a simple login form with email and password
   • Add a welcome message for logged-in users

2. Database Challenge:

   • Create a Firestore collection called "favorites"
   • Add documents for your favorite movies, books, or games
   • Include fields like title, rating, and review

3. Combine Both:

   • Only let authenticated users add to the database
   • Display different data based on who's logged in

:bulb: Tip Remember: Authentication tells you WHO the user is, and the database stores WHAT they can do!