Code Monkey home page Code Monkey logo

Whiskr

Tinder styled pet adoption web app

Description:

This is a tinder styled app that makes pet adoption an easier process. Using real pets from the PETFINDER API, you can swipe left or right on pets you might potentially want to adopt. However, since pets cannot swipe back, a shelter will check to see if you are the right fit.

https://whiskrapp.herokuapp.com

Developers:

  • Shelby Rackley
  • Shannon Kendall
  • Shiratie Prodhan
  • Keri Miller

For Developers:

Secrets Setup

required API keys

At the root folder touch secrets.js

Secrets.js

//  petfinder API_SECRET
const API_SECRET = 'YOUR_SECRET_KEY';

// google geoLocator API_SECRET
const GOOGLE_GEO_API_KEY = 'YOUR_SECRET_KEY';

// google API_SECRET for OAuth
process.env.GOOGLE_CLIENT_ID = ''YOUR_SECRET_KEY''
process.env.GOOGLE_CLIENT_SECRET = 'YOUR_SECRET_KEY'
process.env.GOOGLE_CALLBACK = '/auth/google/callback'

//  facebook API_SECRET
process.env.FACEBOOK_APP_ID = 'YOUR_SECRET_KEY'
process.env.FACEBOOK_APP_SECRET = 'YOUR_SECRET_KEY'
process.env.FACEBOOK_CALLBACK = '/auth/facebook/callback'

module.exports = {
  API_SECRET: API_SECRET,
  GOOGLE_GEO_API_KEY: GOOGLE_GEO_API_KEY
};

Install yarn and if you don't have it already

npm install yarn

Sync the two package.json files

Our project has two package.json files, one on the client side and one on the server side.

we use concurrently to run these at the same time.

**If you don't already have concurrently globally installed on your machine you can run yarn install first to install the server side npm modules. Then you can yarn sync normally.

Use yarn sync to install the packages simultaneously

Create and Seed the database

In your terminal, create the database with the command createdb whiskr

Next, seed the database with yarn seed

Run the app

After you install the packages, run yarn dev to start up the app and navigate to localhost:3000

Using the App

To use the app, either login or sign up. You can also use one of our seeded users. Our favorite is:

Email: [email protected]
Password: catscatscats

From there, you will be redirected to the PetTypes page. Choose the type of pet you'd like to adopt. The categories are: cats, dogs, reptiles, barnyard, horse, small and furry, rabbit, birds.

Swipe left to dismiss a pet and swipe right to add it to your matches.

On mobile view, you can click the pet card to expand the profile.

Whiskr's Projects

whiskr icon whiskr

A Tinder-like progressive web application for pairing local adoptable pets with potential owners

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.