Firebase Authentication

(part 1)

Published on November 4, 2021

Firebase is a platform where you can develop even professional apps. It is made by Google, and offers many app services, for example, sign in methods, storage systems, and more.

Every time when you click the Sign in with Google button on your computer, something like the screenshot right/below will appear. This is exactly what you're going to do in this tutorial!

Note: my accounts are covered because of privacy protection.

This is only part 1. Remember to read part 2.

🏷️ Tags: #kodular, #tutorials-and-guides, #google

Blocks Overview

Step 1. Setting up your project

  1. Create a new project.

  2. After you have opened your project, click on the Settings icon near the Designer button.

3. Go to Publishing.

4. Enter a package name for your project (for example, I used io.gordonlu.firebaseauthentication). A package name is used to identify your app. It should be something in the format of following: com.yourname.appname or io.yourname.appname or yourorganization.categoryname.appname, but it is completely up to you to design your own package name!

From @The_K_Studio:

"When user kept it empty, then Kodular will assign a default package name which is based on your email id which is used for login to your Kodular creator account.

For example. If your login email is :

example@test.com

then default package name will be :

io.kodular.example.yourappname"

Step 2. Setting up Firebase Authentication service

  1. Go to https://firebase.google.com. Create a new account if you haven't.

  2. You should see this screen. Click on 'Add new project'.

3. Enter the project name you entered for Kodular in the 'Enter your project name' input and click 'Continue' when you're done.

4. Enable Google Analytics for this project if the system hasn't and click 'Continue'.

5. Select 'Default Account for Firebase' in the drop down in the new screen and click 'Create project'.

6. It will take a while for the system to create your project. Click 'Continue' when it's ready.

7. In your new project, click on 'Realtime Database'. It will store your accounts.

8. Click on 'Create database'.

9. Select 'United States (us-central)' in the drop down in the new popup and click 'Next'.

10. Choose 'Start in locked mode' and click 'Enable'. It will take some time after you click 'Enable' for the system to load.

11. Click on 'Rules' after the system has loaded the database.

12. You see a panel for you to code your database (yeah, unfortunately, this time we have to do that).

13. Copy the code here.

{

/* Visit https://firebase.google.com/docs/database/security to learn more about security rules. */

/* The above line helps you to protect your database from hackers.*/

"rules": {

".read": true,

".write": true /* This line allows your database to store user data.*/

/* The above lines enable your database to get and store user data.*/

}

}

14. Replace the code originally inside with your copied code and click 'Publish' once you're done.

15. Now, go to Authentication.

16. Click on 'Get started'. It will take some time to load the Authentication.

17. Click on 'Google' after the project has loaded Authentication.

18. Set the text of your project public-facing name to your app name, then select your email in the drop-down. After that, click 'Done'.

This is part 1 of the tutorial. Please go on to part 2 in the website.