Code Monkey home page Code Monkey logo

artspirationbe's Introduction


Logo
Artspiration API

The backend portion of a fun online application to rate and find cool artwork!

contributors_badge forks_badge stars_badge issues_badge build_badge

About The ProjectTools UsedSet UpInstallationHow To UseDatabase SchemaContributingAcknowledgements

About The Project

The backend of Artspiration consumes the Artsy API and Google Cloud Vision API to power a recommendation engine that connects users with exciting artwork based on their preferences. We expose endpoints that package up this material for frontend consumption to display to our users as a web application.

Learning Goals

  • Using an Agile process throughout development
  • Setting up continuous integration and continous deployment
  • Using project management tool Github Project
  • Demoing project ot project manager
  • Building a backend API for frontend consumption
  • Consuming endpoints and manipulating the JSON responses
  • Handling large group dynamics with short 3 day sprints
  • Working with Machine Learning outputs and implementing into app
  • Consuming Google Cloud Vision API

Tools Used

Development Testing Gems
Ruby 2.7.2 RSpec Pry
Rails 5.2.5 WebMock ShouldaMatchers
JSON VCR Faraday
Atom SimpleCov Figaro
Github FactoryBot FastJSON
TravisCI Faker
Heroku

Set Up

  1. To clone and run this application, you'll need Ruby 2.7.2 and Rails 2.5.3. Using rbenv you can install Ruby 2.7.2 (if you don't have it already) with:
rbenv install 2.7.2
  1. With rbenv you can set up your Ruby version for a directory and all subdirectories within it. Change into a directory that will eventually contain this repo and then run:
rbenv local 2.7.2

You can check that your Ruby version is correct with ruby -v

  1. Once you have verified your Ruby version is 2.7.2, check if you have Rails. From the command line:
rails -v
  1. If you get a message saying rails is not installed or you do not have version 5.2.5, run
gem install rails --version 5.2.5
  1. You may need to quit and restart your terminal session to see these changes show up

Installation

  1. Get a free API Key at Artsy API
  2. Get a free (with limits) Google Vision API KEY by following directions here
  3. Fork this repo
  4. Clone your new repo
    git clone https://github.com/#{your_github_username}/ArtspirationBE.git
  5. Install gems
    bundle install
  6. Install figaro
    bundle exec figaro install
  7. Enter your API KEYS in application.yml
    artsy_api_key = <ENTER YOUR API KEY>
    google_api_key = <ENTER YOUR API KEY>
    key = <ENTER YOUR API KEY>
  8. Setup the database
    rails db:create
    rails db:migrate

How To Use

The Artspiration Backend can be used to retrieve user preferences for artwork, as well as make calls to the Artsy API for specific artwork information including: title, artist, image(jpg). The backend can also provide daily recommendations for a piece of art based on past user preferences. Preferences are generated through label and image properties determined by the Google Cloud Vision API. The recommendation engine is built using a combination of collaborative filtering as well as sorting through the saved user preferences.

Endpoint Documentation

User Endpoint
Request: /api/v1/users/:id

Response:

{
  "data": {
  "id": "133",
  "type": "user",
  "attributes": {
    "name": "Melanie Swaniawski",
    "email": "[email protected]"
    }
  }
}

Recommeded Art Endpoint
Request: /api/v1/users/:id/recommendations

Response:

{
  "data": [
    {
      "id": 168,
      "type": "recommended_art",
      "attributes": {
        "title": "Virgin of the Rocks",
        "image": "https://d32dm0rphc51dk.cloudfront.net/Jv-e1fhDjg61OYhhsMoiQg/{image_version}.jpg",
        "user_id": 133
      }
    }
  ]
}

Rated Art Index Endpoint
Request: /api/v1/users/:id/rated_arts

Response:

{
  "data": [
      {
        "id": 175,
        "type": "rated_art",
        "attributes": {
          "title": "La Grande Odalisque",
          "image": "https://d32dm0rphc51dk.cloudfront.net/crVj8GvGliFrpExNfHWl4Q/medium.jpg",
          "liked": true,
          "user_id": 145
        }
      },
      {
        "id": 184,
        "type": "rated_art",
        "attributes": {
          "title": "L'Embarquement pour Cythère (The Embarkation for Cythera)",
          "image": "https://d32dm0rphc51dk.cloudfront.net/Ux_L_UKjxgR-gJ6XZYVgVg/medium.jpg",
          "liked": true,
          "user_id": 145
        }
      }
   ]
}

Rated Art Show Endpoint
Request: /api/v1/users/:id/rated_arts/:art_id

Response:

{
  "data": {
    "id": 106,
    "type": "rated_art",
    "attributes": {
      "title": "The Tête à Tête",
      "image": "https://d32dm0rphc51dk.cloudfront.net/5KJ7_u7BPqeltkfEnyijIw/medium.jpg",
      "liked": true,
      "user_id": 145
    }
  }
}

Database Schema

artspiration_be_schema

Contributing

👤 Jacob Piland

👤 Marla Schulz

👤 Kim Abcouwer

👤 Jason Knoll

👤 Alex Klick

👤 Dee H

Acknowledgements

artspirationbe's People

Contributors

alexklick avatar deebot10 avatar jasonpknoll avatar jtpiland avatar kabcouwer avatar marlitas avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

artspirationbe's Issues

User Home Page

As a user, when I visit the home page,

  • I can login to my account with Google Oauth, and get redirected to my user dashboard
  • If login is unsuccessful I receive flash error: "Login Not Successful. Please try again."
  • If this is first time logging in through google, a new account is created through Google Oauth

Art Show Page

As a user, when I visit ('/users/images/:id') or ('/dashboard/images/:id'), I see

  • That artwork
  • If user liked it or not or the rating user gave; however if no data captured yet ask for user response.
  • Pop up to ask to 'add to favorites?' if user likes the image.
  • if already added to favorites, show 'added' icon
  • Link to the artists page (Artsy artists show page)

User's Image Index Page

As an authenticated user,
when I visit the user's image index page ('/user/images' path) or ('/dashboard/images')
I should see:

  • Links to all of the images in my 'Favorite Images' folder
    When I click this link , it either 1. redirects me to that images show page or 2. enlarges the image on the same page.

  • A link that takes me back to my dashboard
    When I click this link, I am redirected to the ('/user') or ('/dashboard')

  • A link to the artist page from Artsy
    When I click this link, I am redirected to...('artsy.net/artist/')

  • A link to log out
    When I click this link, I am logged out of my account and redirected back to the home page '/'

Recommender System

  • gather google vision data
  • implement disco gem (or some other recommender method)
  • setup models (as shown in disco gem)
  • recommender controller
  • how to keep the recommender updated, but not hogging compute time? (possibly background jobs?)
  • recommender interactions (have system filter out recommendations, as they are added to disliked pile) ** This may or may not be needed depending on compute time for recommendations. Needs further testing.

User's Image Index Page

As an authenticated user,
when I visit the user's image index page ('/users/:id/favorites' path)
I should see:

[ ] Links to all of the images in my 'Favorite Images' folder
- When I click this link , it either 1. redirects me to that images show page or 2. enlarges the image on the same page.

[ ] A text field to enter keyword(s) to search for art/images

[ ] A link that takes me back to my dashboard
- When I click this link, I am redirected to the '/users/:id/dashboard path'

[ ] A link to explore
- When I click this link, I am redirected to....

[ ] A link to the artist page (found in wireframe)
- When I click this link, I am redirected to...

[ ] A link to log out
- When I click this link, I am logged out of my account and redirected back to the home page '/'

The images will be retrieved by consuming The Deviant Art API

User Login/Create New User

[ ] - Create user controller create method for loggin in user and creating new user
Post Request from FE:
{
"name": omniauth['info']['name'],
"email": omniauth['info']['email'],
"token": omniauth['credentials']['token']
}
[ ] - Creates new user in database OR finds user
[ ] - Email has uniqueness in user class validations
Expected JSON to send to FE:
{
:data => {:id=> {user_id},
:type=> 'user',
:attrs=>{:email, :name}
}

Artist of the Month

As a user, when I visit the home page,

  • I see the featured artist of the month.
  • I see a link to that artist's artsy page

Clicking the link will redirect me to that artist's artsy page. artsy.net/artist/

Logout Function

As a user, when logged in I can logout at any time which:

  • redirects me to the home page where I am prompted to log back in
  • disallows me from visiting other paths without logging in

No new image till next day

  • once a user has liked or disliked a daily recommended image, they do not get a new recommended image until the next day.
  • Use a session to track time?

Topicality & Score

  • ensure topicality & score meet certain threshold to be saved as category in DB

Rated Art (liked) Index

[ ] - Create RatedArt Model class method to return art where liked = true
[ ] - Create RatedArt Controller index method to render JSON of users liked art
Expected Response([0..n_user_likes] times):
{
:data =>[ {:id=> {art_id},
:type=> 'liked_rated_art',
:attrs=>{:art_attrs},
:user_id => {user_id}
}]
}

Rated Art Create Method

[ ] - Make Rated Art Controller create method when user rates a piece of art
Request from FE:
{
"user_id": {{user_id}},
"art_id": "{{art_id}}",
"liked": "{{true/false}}"
}

Expected Response from BE to FE:
{:data => {status: 200/400}}

As a user, when I visit the dashboard page, I see:

  • welcome message with username
  • my 5 most recent 'favorited' pieces of art
  • links that redirect to image show page
  • A link to the index of all my favorited arts
  • Recommended art for the day (1-5 or favorite)
  • link to logout

API Consumption

As an authenticated user,

  • when I visit the dashboard page I see a 'random - curated' image.
  • Image is pulled from Artsy API (with image ID that is stored in database)
  • Image is selected randomly from matching categories of previous user likes.
  • categories determined by Cloud Vision API (labels & image properties endpoints).
    { "requests": [
    {
    "image": {
    "content": "base64-encoded-image"
    },
    "features": [
    {
    "maxResults": 5,
    "type": "IMAGE_PROPERTIES (or LABEL_DETECTION)"
    }
    ]
    }
    ]
    }
  • Image properties maxResults = 1
  • labels maxResults = 5
  • categories saved to BE database and tied to image ID (confirm with schema builders)
  • categories user likes saved to BE database and tied to user ID (confirm with schema builders)
  • (use pagination for Artsy <size=1>)

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.