Class-20 Setting Up Your Database with Firebase for Your Bolt.new App

In this part of the course, we're going to integrate a database into our Bold New app. This will allow us to store and manage user data, including names, countries, and app-related information. The database acts like a closet where we store and organize data efficiently.

Step 1: Setting Up Firestore Database

1. Navigate to Firebase Console:

   • Go to the Firebase Console and select your project.

   • Click on Build and then select Firestore Database.

2. Create the Database:

   • Click on Create Database.

   • Leave default settings as is and click Next.

   • Choose Start in Production Mode for better security.

   • Click Create to initialize the Firestore database.

At this stage, the database is set up, but it doesn't yet contain any data since we haven’t connected it to our application.

Step 2: Configuring Firebase Security Rules

1. Understanding Security Rules:

   • We need rules to define who can read, write, and update data in our database.

   • The rules should enforce authentication, profile access control, and data validation.

2. Updating Security Rules:

   • Go to the Rules tab in Firestore.

   • Replace the default rules with the following:

     rules_version = '2';
     service cloud.firestore {
       match /databases/{database}/documents {
         match /profiles/{userId} {
           allow read, write: if request.auth != null && request.auth.uid == userId;
         }
         match /apps/{appId} {
           allow read, write: if request.auth != null;
         }
       }
     }

   • Click Publish to apply the new rules.

Step 3: Connecting Firebase Database to Bold New App

Since we previously linked our project with Bold, our database connection is already set up. Now, we need to test whether data is being correctly stored and retrieved.

Step 4: Deploy and Test the Database Connection

1. Deploy the Latest Changes to Production.

2. Sign in to the Bold New App using Google Authentication.

3. Edit Your Profile:

   • Enter your name and country.

   • Click Save Changes.

   • Check Firestore Database to see if the new data is stored.

4. Add an App:

   • Click Add App.

   • Enter the app name, description, and URL.

   • Click Save and verify the data appears in Firestore.

Step 5: Real-Time Database Updates

Firestore enables real-time updates, meaning any changes made in the app will reflect instantly in the database without needing to refresh the page. Try changing the country in your profile and observe how it updates in Firebase.

Conclusion

We have successfully connected our Bold New app to Firebase, set up Firestore, implemented security rules, and tested real-time data storage. This integration allows users to save and manage their profiles and applications seamlessly.

Next, we'll explore how to improve usability and refine our database operations further. Stay tuned!