BS UPdate : Created Login App / Authentication with phone number

sogata (64)PromoSteem Dev / PU Level 2in Steem Marketing • 3 years ago

Screen Shot 2021-06-15 at 22.40.29.png

What is BS ?

BS ( Bank STEEM ) is a web-based swap application that I plan to develop in the near future. where later in this application, steemit users from Indonesia can easily buy steem or SBD with rupiah, and vice versa.

What is the Update today ?

in this update, I managed to add the login process to the BS application. I login in this application using cellphone number authentication. All of this I made using the ReactJS framework. and Firebase for the authentication process.

Live demo : https://bank-steem.web.app/

Why do I use cellphone number authentication?

There are several reasons why I use my cellphone number to login, including using my cellphone number to minimize spam users. because someone only has 1 or 2 cellphone numbers. different from email, one person can have tens or even hundreds of emails.

And why don't I use steemconnect ?

I think this is what you are asking, why not just use steemconnect, you can directly connect to steemit. here I will answer, I do not use steemconnect for security reasons. I don't want something bad to happen in the future. because it involves transactions. I don't want BS users to lose their STEEM or SBD later.

And this app is just an exchange app, so I don't think it's necessary to connect with steemit. just like any other exchange. The steemit account is only used for transaction processing. so when you want to exchange your steem or sbd to IDR, that's where you just make a transaction through steemwallet. you can do this transaction using steemconnect (I will provide a button there later) and you can also transfer manually.

Can we get the code from this application?

Of course, because this application is an open source application. so anyone can see it. I accidentally uploaded this app on my github. you can see at this link: https://github.com/sogatanco/bank-steem.

here my summary code:

import React from 'react';
import * as firebaseui from 'firebaseui';
import { Redirect } from "react-router-dom";
import firebase from '../firebaseConfig';
import 'firebaseui/dist/firebaseui.css';
import {isLogged} from '../Pages/AuthUser';


class Login extends React.Component{
    componentDidMount(){


        const uiConfig={
            signInOptions:[{
                provider:firebase.auth.PhoneAuthProvider.PROVIDER_ID,
                recaptchaParameters:{
                    type:'image',
                    size:'normal',
                    badge:'bottomleft',
                },
                defaultCountry:'ID',
            }],
            callbacks:{
                signInSuccessWithAuthResult:function(authResult, redirectUrl){
                    localStorage.setItem('uid',authResult.user.uid)
                    return true;
                }
            },
            signInSuccessUrl:'/'
        }

        var ui=new firebaseui.auth.AuthUI(firebase.auth());
        ui.start('#firebase-auth-container', uiConfig);
    }



    render(){
            return(
                <div className="mt-4">
                    <div id="firebase-auth-container" >
                    
                    </div>
                </div>
                
            );       
    }
}

export default Login;