Skip to the content.

Fullstack blog reflection

Reflection on frontend to backend fullstack connection!

The Holiday Giftinator

Overall Purpose:

  • Offer easy gift suggestions to people for their friends and family
  • Give organized gift suggestions for diffrent categories

My Feture Purpose:

  • Add values to users searched items
  • Create the connection between frontend –> backend to apply to diffrent codes
    • apply tags to recomended page + user profile
    • users can share prefrences in their profile to friends(implementation idea)
    • users can search for simular items in reccomended page (implementation idea)

Frontend to Backend Demo

  • input –> user types in search bar for an item or assosiated tag and click on item Input

  • Output –> Associated tags and name of items is added to the database Output

Postman Code Demo

  • input name of item (into search bar/body of postman)

Postman

  • output associated tags + name of item saved

Database + Dictionary Usage

  1. dictionary in api to save items with associated name, tags, and link
  2. SQL lite database
    • save username, name of item, and tags
  3. query for items in the dictionary (located in search.py api file)
def search_items():
    """
    Search for items based on a query string.
    """
    query = request.args.get("q", "").lower() # q is querying for itmes
    current_user = g.current_user  # Get authenticated user
    user_id = current_user.uid

    if not query:
        return jsonify([]) # Return an empty list if no query is provided

    # Match items based on whether the query is in the name (case-insensitive, partial match)
    results = [
        {"name": item["name"], "link": item["link"], "tags": item["tags"]} #find item name, link, and tag
        for item in items if query in item["name"].lower() #find item name to add into database
    ]

save data into json file (searchHistory.json)

## function to append data to the json file 
def append_to_json(data):
    try:
        if os.path.exists(JSON_FILE_PATH):
            with open(JSON_FILE_PATH, "r") as json_file:
                existing_data = json.load(json_file)
        else:
            existing_data = []

        existing_data.append(data) #append data to the json file

        with open(JSON_FILE_PATH, "w") as json_file: 
            json.dump(existing_data, json_file, indent=4) #dump data to the json file
    except Exception as e:
        print(f"Error saving data to JSON file: {e}") #error catching

Crud Operatios

Create –> Add tags of items into database (query to find item details)

Read –> Read data from dictionary/in database (as well as in query to find item details above)

Update –> Update tags when user click on an item again (+1 with each interaction)

Delete –> Clear data from database

Algorithmic Code (Post, Get, Put Functions)

Post –> Add item data into the table (each time u add it adds tags)

Get –> Get the data of an item(name link tags)

Put –> update name or tags of an item in database

Method/Procedure

Sequencing

  1. check required feild (make sure there is userId and query for item n searchbar)
  2. type in search bar (query for item)
  3. click on item –> collect name tags and link assosiated to item
  4. display data into database depending on user input into searchbar

selection

  • determine what action to take depending on input
    • if any fields are missing display error message
    • if all fields required are there then show items in search and display data in database

Iteration

  • use GET to retrive data from query
#searching for items based on query string
def search_items():
    """
    Search for items based on a query string.
    """
    query = request.args.get("q", "").lower()
    current_user = g.current_user  # Get authenticated user
    user_id = current_user.uid

    if not query:
        return jsonify([])

    # Match items based on whether the query is in the name (case-insensitive, partial match)
    results = [
        {"name": item["name"], "link": item["link"], "tags": item["tags"]}
        for item in items if query in item["name"].lower()
    ]

    return jsonify(results), 200