🐈

Nya NyaGarcia

🐈

Full stack dev~ Creator of Npkill~ Málaga

NyaGarcia / login-page.component.html

Created October 29, 2021 10:34

Adding the Google sign in option

	<div class="background">
	<div class="login-container">
	<div class="text-container">
	<h1>Hey Stranger</h1>
	<p>
	Want to create an awesome account to access this awesome app? Go ahead
	and click the button below!
	</p>
	<button mat-button routerLink="/register">Sign up</button>
	</div>

NyaGarcia / auth.service.ts

Created October 29, 2021 10:21

Adding the google social login option

	import {
	Auth,
	GoogleAuthProvider,
	createUserWithEmailAndPassword,
	signInWithEmailAndPassword,
	signInWithPopup,
	signOut,
	} from '@angular/fire/auth';

	import { Injectable } from '@angular/core';

NyaGarcia / app-routing.module.ts

Created October 29, 2021 10:03

Using the AngularFire canActive helper to make the routes more readable

	import { RouterModule, Routes } from '@angular/router';
	import {
	canActivate,
	redirectLoggedInTo,
	redirectUnauthorizedTo,
	} from '@angular/fire/auth-guard';

	import { NgModule } from '@angular/core';

	const redirectUnauthorizedToLogin = () => redirectUnauthorizedTo(['']);

NyaGarcia / app-routing.module.ts

Created October 29, 2021 09:58

Protecting the auth module

	import {
	AuthGuard,
	redirectLoggedInTo,
	redirectUnauthorizedTo,
	} from '@angular/fire/auth-guard';
	import { RouterModule, Routes } from '@angular/router';

	import { NgModule } from '@angular/core';

	const redirectUnauthorizedToLogin = () => redirectUnauthorizedTo(['']);

NyaGarcia / app-routing.module.ts

Created October 29, 2021 09:42

Guarding the dashboard route

	import { AuthGuard, redirectUnauthorizedTo } from '@angular/fire/auth-guard';
	import { RouterModule, Routes } from '@angular/router';

	import { NgModule } from '@angular/core';

	const redirectUnauthorizedToLogin = () => redirectUnauthorizedTo(['']);

	const routes: Routes = [
	{
	path: '',

NyaGarcia / register-page.component.css

Created October 28, 2021 14:50

Adding styles to the register page

NyaGarcia / register-page.component.html

Created October 28, 2021 14:50

MAking the register page look pretty

	<div class="background">
	<div class="login-container">
	<div class="form-container">
	<h1>Welcome to NgBytes Register</h1>
	<h5>Register with your email</h5>
	<ngbytes-login-form (formData)="register($event)"></ngbytes-login-form>
	</div>
	<div class="text-container">
	<h1>Hey Buddy</h1>
	<p>

NyaGarcia / login-page.component.css

Created October 28, 2021 14:45

Adding styles to the login page

NyaGarcia / dashboard.component.css

Last active December 28, 2021 14:15

Adding some styles to the dashboard

NyaGarcia / dashboard.component.html

Last active December 28, 2021 22:50

Creating the dashboard component

	<mat-toolbar><a (click)="logout()">Log out</a></mat-toolbar>
	<div class="background">
	<h1>Welcome to the NgBytes Dashboard</h1>
	<h2>Built with <3 by Dottech</h2>

	<a
	target="_blank"
	class="btn"
	href="https://github.com/puntotech/ngbytes-fireauth"
	>