# Autenticacion
# Github
HTML
<button id="login">Entra con github</button>
<div id="login-message">
<div>
<p id="session-message"></p>
</div>
</div>
JavaScript
;
((d, c, f) => {
const config = {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: ""
};
// ( f ) es utilizada como firebase para inicializar firebase
f.initializeApp( config );
/*
|-----------------------------------------------
| AUTH
|-----------------------------------------------
| . Github --> GithubProvider()
| . Cada Red Social tiene tu nombre de funcion provider
| ( ver docs en firebase)
|
*/
const provider = new f.auth.GithubAuthProvider(),
user = f.auth.currentUser,
loginMessage = d.getElementById('login-message'),
ahutMessage = d.getElementById('session-message')
// Detecta los cambios en el estado de login del usuario
f.auth().onAuthStateChange(user => {
if(user) {
// Podemos mandar mensaje a la vista con boton le sierre
<button id="logout"> Salir <button>
c('Usuario autenticado')
} else {
// Podemos mandar mensaje a la vista
c('Usuario NO autenticado')
}
})
d.addEventListener('click', e => {
// Detecta click en login
if(e.target.matches('#login')) {
f.auth().singInWithPopup(provider)
.then(result => {
// Podemos mandar mensaje a la vista
c(result.user)
})
.catch(err => {
// Podemos mandar mensaje a la vista
c(err)
})
}
// Detecta click en logout
if(e.target.matches('#logout')) {
f.auth().singOut()
.then(() => loginMessage.innerHTML = `
<p> Session terminada </p>
`)
}
})
})(document, console.log, firebase);