Udacity Full Stack Web Developer Nanodegree
The Item Catalog project consists of developing an application that provides a list of items within a variety of categories, as well as provides a user registration and authentication system. Registered users will have the ability to post, edit and delete their own items.
This is a book rental application that has the book genres listed as categories and books under each genre are listed as items. A book item contains a detailed description along with price and availabilty status of the item. It provides login and logout funcationality for a user. An authenticated user can add, delete and update a book item. A catalog json endpoint is provided to access the list of categories and items in json fromat.
- Python 3
- Flask Framework
- Google OAuth2.0
- CSS
- JQuery
- Bootstrap 5
- static
- template: HTML webpage templates.
- .gitignore: Contains files to exclude from commits.
- app.py: Main python backend application file.
- db_setup.py: Python file to setup the db.
- populate_db_data.py: Python file to populate the db.
- README.md: Project Documentation file.
As a prerequisite, installation steps are provided by udacity.
-
Install VirtualBox from virtualbox.org to run a virtual machine. Install Vagrant to configure the VM. I have used VirtualBox-6.0.14 version with Vagrant-2.2.6 version.
-
Follow the Vagrant virtual machine configuration from Udacity virtual machine configuration to start and ssh into virtual machine.
-
- Login to the Google Cloud Platform Console.
- Create a new project with any name ex- Item Catalog Application.
- Under Create Credentials select OAuth Client ID
- Configure Consent Screen before proceeding
- In Create Credentials provide Application Type as
Web Application
- Add
http://localhost:5000
under Authorized JavaScript origins and Authorized Redirect URIs. - Download the JSON file for credentials and put it inside app directory after renaming to
client_secrets.json
.
-
- Create the database:
python3 db_setup.py
- Populate the data in database:
python3 populate_db_data.py
- Run the application:
python3 app.py
- Access http://localhost:5000 in browser
- Create the database:
- Since Google+ is deprecated, google authentication code from instructor notes did not work for me. I referred the solution from Udacity Knowledge Hub
- For Frontend I have referred Bootstrap Documentation
- Login and Logout functionality is referred from Instructor notes with modifications as needed.
- Images are used from Unsplash