Abby Starnes

front-end developer

Shelter

A CRUD Application Built with Petfinder's API

Technologies

  • NodeJS

  • Express

  • PostgreSQL

  • Petfinder API

  • Materialize

  • Heroku

Overview

Shelter is a CRUD (create, read, update, delete) Node.js Express application. This is a week-long individual project from quarter 2 of Galvanize's 24-week web development immersion course. Shelter displays data on Austin Pets Alive! shelter animals gathered via Petfinder's API. I implemented user authentication by using hashed passwords, cookies and Oauth via Google's authentication library. Shelter features a PostgreSQL database and is deployed to Heroku.

View Live View Code

User Authentication

If user logs in with Gmail, an external dialogue opens and allows the user to login to their Gmail account. Upon successful login, the users information is passed to the front-end javascript file's onSignIn() function (below) for processing. Afterwards, whenever the user is logged in to their Gmail account, they have frictionless access to their account. If the user chooses to log in using their email and password, the form information is submitted to the /login_local route (below) for processing via a post request.

In the front-end Javascript, onSignIn() takes the user's Gmail account information and passes their email and id token to the /login_gmail route via a post XMLHttpRequest. The getCookie() function parses the current cookie to obtain the user's authentication information.

The /logout route empties the user's cookies, which logs them out and prevents protected elements from rendering to the page. The /login_gmail route validate's the user's id token. If the user's credentials are valid, a cookie is set with the user's permission level and email. The /login_local route checks the user's password against the stored hashed password associated with their email. If the password or email is invalid, the post request resolves with a 404 and the user sees an error message. Otherwise, once their credentials are validated the user is rerouted to the pets page.