Project Overview

  • My project is a Recipe program where users can input recipes and also search for recipes that others have posted.

    Collections (Python Models & SQLite Database)

  • For our project implementation, my recipe CPT creates a new table called recipe to store data and information on the recipes.

    From VSCode using SQLite3 Editor, show your unique collection/table in database, display rows and columns in the table of the SQLite database.

  • The table shows the name of the recipe, instructions, supplies, etc
    image

    From VSCode model, show your unique code that was created to initialize table and create test data.

  • This code initializes the database and all of the columns and rows.
    image
  • This shows initialization of 5 recipes for the ‘recipe’ table
    image

    Lists and Dictionaries

    In VSCode using Debugger, show a list as extracted from database as Python objects.

  • I used lists and dictionaries to send and collect data. I used a list of dictionaries that contained recipe objects(list) and its data(dictionary). List of recipes can be seen in the left and each recipe stores data in a dictionary.
    image

    In VSCode use Debugger and list, show two distinct example examples of dictionaries, show Keys/Values using debugger.

  • One dictionary stores user data, dictionaries can be seen on the left.
    image
  • Another dictionary is used to store recipe data, dictionaries are on the left.
    image

APIs and JSON

  • For our project, we use different API endpoints based on the functionality of the API. We used postman to test our backend to make sure it is functional before creating our frontend.

    In VSCode, show Python API code definition for request and response using GET, POST, UPDATE methods. Discuss algorithmic condition used to direct request to appropriate Python method based on request method.

  • I used a post to upload the inputed recipe data into the database.
    image
  • I used a get method to retrieve the recipes in the database so users can search for recipes that have been uploaded
    image
  • UPDATE so user can change their email
    image()

    In VSCode, show algorithmic conditions used to validate data on a POST condition.

  • In this POST method, I used conditionals to ensure that the required JSON bodies are not left empty before being uploaded to the database.
    image

    In Postman, show URL request and Body requirements for GET, POST, and UPDATE methods.

  • GET request returns recipe data in the database
    image
  • POST request returns uploaded recipe data image
  • POST request that allows the user to update their email.
    image

    In Postman, show the JSON response for error for 400 when missing body on a POST request.

  • In this post request, the body is empty, so it does not work. image

    In Postman, show the JSON response for error for 404 when providing an unknown user ID to a UPDATE request.

  • When trying to delete a user with nonexistant UID, postman responds with a 404 becuase the UID does not exist
    image

    In Chrome inspect, show response of JSON objects from fetch of GET, POST, and UPDATE methods.

  • JSON response from GET which displays the recipe information stored in the database image
  • JSON response from POST which shows information about the posted recipe image
  • JSON response from UPDATE function which displays the user data with the new email. image

    In the Chrome browser, show a demo (GET) of obtaining an Array of JSON objects that are formatted into the browsers screen.

  • When the user searches can search for recipes using GET function and homescreen displays all recipes. image

    In JavaScript code, describe fetch and method that obtained the Array of JSON objects.

  • The JavaScript code uses the fetch to make an HTTP GET request to get data from the specified apiUrl, and then extracts an array of JSON objects from the response using response.json() to obtain a list of recipes. image

    In JavaScript code, show code that performs iteration and formatting of data into HTML.

  • This code shows iteration over list of recipe objects from the API response.Uses forEach loop through the recipe to check if the recipe name matches the user-entered search term. image

    In the Chrome browser, show a demo (POST or UPDATE) gathering and sending input and receiving a response that show update. Repeat this demo showing both success and failure.

  • This demonstrates a successful POST request which is intended to upload a recipe to the database. It returns the recipe object that was uploaded if it is successful image image
  • This demonstrates an unsuccessful POST request when I leave some JSON inputs empty. image
  • Because required fields are empty, the program does not allow a post request to be sent to the backend so there is no response from the backend.

    In JavaScript code, show and describe code that handles success. Describe how code shows success to the user in the Chrome Browser screen.

  • Upon success of the GET request to get the recipes from the backend, it formats the recipes into the HTML. image

    In JavaScript code, show and describe code that handles failure. Describe how the code shows failure to the user in the Chrome Browser screen.

  • In the previous image, if there is an error returned from the response, the function console logs “error loading recipes”

    Optional/Extra, Algorithm Analysis

    Show algorithms and preparation of data for analysis. This includes cleaning, encoding, and one-hot encoding.

  • This code segments cleans the data, it drops rows and columns that have missing data so it does not affect the probability prediction. image
  • Encoding and one-hot coding
    image

    Show algorithms and preparation for predictions.
    image

  • Instantiating the Titanic model for the prediction
    image

    Discuss concepts and understanding of Linear Regression algorithms. image

  • Linear relationship between dependent and independent variables.
  • Plots all available data points and find line that best fits data.
  • Uses this line of best fit or regression line to create accurate predictions based on all of the data.

    Discuss concepts and understanding of Decision Tree analysis algorithms.
    iamge

  • Machine learning algorithm that uses decision tree to make predictions.
  • First there is the Root node or the entire population or sample. The root node gets divided into two or more sets. These new sets are called decision nodes. As you move down in the tree, each decision node represents a further split based on different features.
  • This continues until reaching terminal nodes where final predictions are made. Each node shows a decision point bsaed on a feature and it narrows down the possible outcomes until it reaches a final prediction.

    Deployment Tech Talk Notes

  • Put fetch and credentials in a config.js file
  • For Nginx deal with credentials, cookies, and CORS
  • CORS code moved to init.py not in main.py anymore.
  • Have guarded and unguarded APIs