Login page using firestore

[Nih_nih_Science_cem]

Hello niotrons
I want to create a login page ( no sign-up. …login only) with username, email and password using firestore database .does anyone know how to do the blocks

[Horizon]

Use this extension

🔥 Firestore: scalable database

And here is it’s guide

🔥 Firestore: scalable database

[iaditya_nanda]

@Nih_nih_Science_cem you can try this :

Step 1: Set Up Firebase Firestore

1. Create a Firebase Project:

   • Go to the Firebase Console.
   • Click on “Add project” and follow the prompts to create a new project.

2. Enable Firestore Database:

   • In your Firebase project, navigate to the Firestore Database.
   • Click on “Create Database” and choose the appropriate mode (Start in test mode for easier setup).

3. Get Firebase Configuration:

   • Go to your project settings by clicking the gear icon in the Firebase console.
   • Under the “General” tab, find your app’s Firebase configuration object, which includes the API key and other details you’ll need.

Step 2: Set Up App

1. Create a New Project:

   • Create a new project.

2. Add Components:

   • User Interface:

     • Add the following components to your screen:
       • TextBox (for username)
       • TextBox (for email)
       • PasswordTextBox (for password)
       • Button (for signup)
       • Label (for status messages)

   • Non-visible Components:

     • Add a Web component (to interact with Firebase).

Step 3: Connect to Firebase Firestore

1. Configure the Web Component:
   • Set the Web component’s URL property to your Firestore database URL.
   • For example, if your Firestore URL is https://your-project-id.firebaseio.com, set it accordingly.

Step 4: Create the Signup Logic

1. Add Blocks:
   • Go to the Blocks section.
   • Create the necessary blocks to handle the signup logic:

When SignUpButton.Click
  if (UsernameTextBox.Text is not empty AND EmailTextBox.Text is not empty AND PasswordTextBox.Text is not empty)
    set SignUpURL to 'https://firestore.googleapis.com/v1/projects/your-project-id/databases/(default)/documents/users?documentId=' + UsernameTextBox.Text
    set Web1.Url to SignUpURL
    call Web1.PostText with arguments
      '{
         "fields": {
           "username": {"stringValue": "' + UsernameTextBox.Text + '"},
           "email": {"stringValue": "' + EmailTextBox.Text + '"},
           "password": {"stringValue": "' + PasswordTextBox.Text + '"}
         }
       }'
    when Web1.GotText
      if responseCode = 200
        set StatusLabel.Text to "Signup successful!"
      else
        set StatusLabel.Text to "Signup failed: " + responseContent
  else
    set StatusLabel.Text to "Please fill in all fields."

Step 5: Test Your App

1. Test on Device:
   • Connect your device and test the signup functionality.
   • Ensure that data is being correctly saved to Firebase Firestore.

This is a basic implementation to get you started. Depending on your app’s needs, you might need to add more features such as email verification, password reset, etc.

[Nih_nih_Science_cem]

this is a for users to signup
i want them to login using a username and a password i provide

[iaditya_nanda]

@Nih_nih_Science_cem you got the solution or still you haven’t got? as you have selected the solution but not replied either you have got the solution or not