프로그래밍/Etc
[Etc] change firebaseui-web language
Reference M1
2021. 4. 20. 18:11
github.com/firebase/firebaseui-web
firebase/firebaseui-web
FirebaseUI is an open-source JavaScript library for Web that provides simple, customizable UI bindings on top of Firebase SDKs to eliminate boilerplate code and promote best practices. - firebase/f...
github.com
언어 지원범위 - https://github.com/firebase/firebaseui-web/blob/master/LANGUAGES.md
- git clone https://github.com/firebase/firebaseui-web
- npm install
- npm run build build-js-ko
- npm run build build-npm-ko
- firebaseui__ko.js, npm__ko.js 두 파일을 적용할 프로젝트/node_modules/firebaseui/dist로 복사
- import * as firebaseui from 'firebaseui/dist/npm__ko';
import React, { Component } from 'react';
import firebase from 'firebase';
//import * as firebaseui from 'firebaseui'
import * as firebaseui from 'firebaseui/dist/npm__ko';
class FirebaseContainer extends Component {
componentDidMount() {
const firebaseConfig = {
apiKey: "AIzaSyBmD4v0PtxxZEeTNhHRaa4aAHeCdcxX0us",
authDomain: "phoneauthenticationreact.firebaseapp.com",
databaseURL: "https://phoneauthenticationreact.firebaseio.com",
projectId: "phoneauthenticationreact",
storageBucket: "phoneauthenticationreact.appspot.com",
messagingSenderId: "511189683965",
appId: "1:511189683965:web:ad29efffb76afdd6627894"
};
const fbase = firebase.initializeApp(firebaseConfig);
const uiConfig = {
//signInSuccessUrl: 'http://localhost:3000/', //This URL is used to return to that page when we got success response for phone authentication.
signInOptions: [{
provider: firebase.auth.PhoneAuthProvider.PROVIDER_ID,
defaultCountry: 'KR',
whitelistedCountries: ['KR', '+82'],
defaultNationalNumber: '01011112222',
}
],
callbacks: {
signInSuccessWithAuthResult: function (authResult, redirectUrl) {
// Handle the result
console.log(authResult, redirectUrl);
return false;
},
}
};
const ui = new firebaseui.auth.AuthUI(firebase.auth());
ui.start('#firebaseui-auth-container', uiConfig);
}
render() {
return (
<>
<h2>PHONE AUTHENTICATION</h2>
<div id="firebaseui-auth-container"></div>
</>
)
}
}
export default FirebaseContainer;