Item Catalog Udacity Project ⭐

This is my Item Catalog project for Udacity's Full Stack Developer Nanodegree.

It is a Python web application using the Flask framework along with SQLAlchemy for an items catalog. In it you can view categories and related items.

Once logged in you can create, edit and delete items.

Front-end was built for mobile first.

For best experience, use Google Chrome. 😜

It features:

• CSRF protection
• Flask-login based login module
• OAUTH signup with:
  • Facebook
  • Google
  • Github
• Image upload
• JSON API endpoints

3rd party modules:

• Flask WTF
• Flask-Login
• Bootstrap 3.1.1
• Font Awesome
• Social Buttons for Bootstrap
• jQuery 1.8.2

Default image references:

• Item description image
• User avatar image

Installation ☕

Prerequisites: 🎮

• Installed VirtualBox
• Installed Vagrant
• Registered Facebook App for OAUTH
• Registered Github App for OAUTH
• Registered Google App for OAUTH

First time setup 💥

Environment setup

1. Clone the repository
2. Using your console cd into the repository's directory
3. Use vagrant up ❗ Note: this can take a few minutes
4. The VM needs a restart once setup - use vagrant halt to stop the VM
5. Finally, use vagrant up again to start the VM

Application setup

1. Using your console cd into the repository's directory
2. Start the VM using vagrant up
3. SSH into your VM using vagrant ssh
4. cd into the app folder as /vagrant/catalog
5. Create the dummy DB using python setup.py

Login system setup

1. Open /vagrant/catalog/instance/fb_client_secret.json with your editor
2. Enter your app_id and app_secret for Facebook login and save
3. Open /vagrant/catalog/instance/gh_client_secret.json with your editor
4. Enter your client_id and client_secret for Github login and save
5. Open /vagrant/catalog/instance/goo_client_secret.json with your editor
6. Enter your client_id, project_id and client_secret for Google login and save

In case you'd like to modify the DB items, edit setup.py file

Usage 💻

0. Make sure your application is setup (check First time setup step above)
1. Using your console cd into the repository's directory
2. Start the VM using vagrant up
3. SSH into your VM using vagrant ssh
4. cd into the app folder as /vagrant/catalog
5. Create the dummy DB using python run.py
6. In your browser open http://localhost:8000/catalog

JSON API endpoints

Category listing

Open http://localhost:8000/catalog/categories/JSON to see the list of categories.

Structure

{
  "categories": [
    {
      "id": 1,
      "name": "Armor"
    },
    ...
  ]
}

Item listing for given category

Open http://localhost:8000/catalog/<category_name>/items/JSON where category_name is an existing category's name.

Structure

{
  "items": [
    {
      "category": "Jewelry",
      "description": "It induces honesty, induces wakefulness, aids certain skin problems,     and enhances the sense of touch.",
      "id": 1,
      "image": null,
      "name": "Longevity Canopic Jar"
    },
    ...
  ]
}

Item information listing

Open http://localhost:8000/catalog/<category_name>/<item_name>/JSON where category_name is an existing category's name and item_name is an existing item's name of that category.

Structure

{
  "item": [
    {
      "category": "Jewelry",
      "description": "It wards off nightmares.",
      "id": 35,
      "image": null,
      "name": "Fortitude Sword"
    }
  ]
}

License

Copyright (c) 2017 Péter Szabó. All rights reserved.

This work is licensed under the terms of the MIT license.
For a copy, see https://opensource.org/licenses/MIT.