sydney-sisco/bite-size

A full-flavoured recipe app, that trimmed the fat, and is presented in a bite-sized, easily digestible format.

bite-size's Issues

Create the homepage

Bite Size

• Search Bar

• Search button

• Browse button

• Features Recipes Button which reveals three recipe cards

🍌New Recipe page should redirect to Login if you're not logged in

Just like we do on the My Recipes and My Favourites pages.

Page: Recipes Browse

Browse - Page that shows all recipes
GET /recipes

Choose Framework

Summary

Decide which framework to go with.

Steps:

• research...

Outcome:

We're on the same page and have a framework picked out

Page: Recipe Read

Read - shows one specific recipe
GET /recipes/:id

Stretch: Add new recipe Modal

add a modal to the nav bar, so a new recipe can be add from any page when a user is logged in

Page: Recipe add

Add - new recipe form
POST /recipes - POST route for submitting new recipe (redirect to the recipe specific page)

Page: Recipe Delete

Delete - DELETE route for deleting a recipe (redirect to list page)
DELETE /recipes/:id

🍌Recipe page should pluralize units of measure

Don't overthink it, just add an 's' if the quantity is not equal to 1
and maybe remove the 'x'

🍐Only the recipe creator should be able to edit the recipe

Look into Slonik / other way to loop through queries

Summary

Need to find a way to loop through our instructions and ingredients queries while in creation.

Steps

Find a new system (Slonik?) to properly get queries to loop as we add more params to the ingredient or instructions lists. Currently sitting with array, but unable to loop the params.

Outcome

We are able to create a new recipe without issue!

Stretch: Units of Measure

https://www.npmjs.com/package/convert-units

Populate UoM table:

Cups (US)
Cups (Metric)
Cups (Imperial)
Deciliters [dL]
Fluid Ounces (UK) [fl oz]
Fluid Ounces (US) [fl oz]
Gallons (UK) [gal]
Gallons (US)
Grams [g]
Kilograms [kg]
Liters [L]
Milliliters [mL]
Ounces [oz]
Pints (UK) [pt]
Pints (US) [pt]
Pounds [lb]
Quarts (UK) [qt]
Quarts (US) [qt]
Tablespoons (US)
Tablespoons (Metric)
Tablespoons (Imperial)
Teaspoons (US)
Teaspoons (Metric)
Teaspoons (Imperial)

reference: https://www.thecalculatorsite.com/cooking/cooking-calculator.php

adjust all queries to account for the UoM.

Create a mockup of the recipe creation page.

We just need a rough idea of what form data will be input on this page.

Search Bar

Write query and route(s) to search bar

🌶 BUG: ingredients list order

once saved ingredients will reorder themselves.
if no unit of measure, items will appear at the top of the list in a random order
followed by ingredients with a unit of measure. these ingredients will list alphabetically by units of measure.

fix so ingredients stay in the order they were input??

Stretch: Create Logout

Generate log out to terminate the session

redirect to homepage

🍉Recipe Create/Edit form shouldn't say "Create a New Recipe" when editing

We could pass in the title as a prop or move the title out of the component

🍒 BUG: random "1" added to the list of ingredients when saving after editing

Decide on what recipes to upload for demo

• happy path

Favourites Queries

Browse - view all favourite per user
GET /favourites/:user_id
Add - create fav connection
POST /favourites/:user_id/:recipe_id
Delete - remove fav connection
DELETE /favourites/:user_id/:recipe_id

🍉Recipe Create/Edit form shouldn't have a cancel button when creating a recipe

We need the cancel button when editing but not when creating a new recipe. Alternatively it could redirect somewhere.

Complete Svelt Tutorial

Summary

Go through the svelte tutorial on their site.

Steps

Complete all steps of the svelte tutorial.
Alternative: follow through the svelte videos
Stretch: Place key takeaways in a notes file under "planning" for quick reference.

Outcome

All have a better understanding of Svelte's capabilities.

🍌Nav bar should show user name when logged in

and a logout button

Create Table Migration Files

Summary

Complete a list of migrations for both our seeds and our schemas.

Steps

Schema

• Users
• Recipes
• recipe ingredients
• ingredients
• units of measure
• instructions
• favourites
• difficulties
• recipe tags
• tags
• user emoji reactions
• emojis

Seeds

• Users
• Recipes
• recipe ingredients
• ingredients
• units of measure
• instructions
• favourites
• difficulties
• recipe tags
• tags
• user emoji reactions
• emojis

Outcome:

We have database migrations that allow us to work with all of our data!

Bug: Favourite count in My Favs is incorrect

The getUserFavourites query needs to be fixed.
Currently, the query returns a fav value of 1. not the total number of favs

Favourite Routes

FAVOURITES

Browse - view all favourite per user
GET /favourites/:user_id
Add - create fav connection
POST /favourites/:user_id/:recipe_id
Delete - remove fav connection
DELETE /favourites/:user_id/:recipe_id

Stretch: Delete a User

A user can delete their own account.
if session Id matches the user, you can make a delete request to the users table.

(Optional) Operation Get Off Vagrant

Open iTerm and confirm you are in a zsh shell (run command zsh) and you are in your home directory (~ || $HOME), install these packages from the command line:

Brew

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"

NVM (Node version manager)

Create .zshrc and .profile (you'll need a .zshrc for nvm in the next step)

$ touch .zshrc
$ touch .profile

Then install nvm with curl command:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | zsh

###Postgres

brew install postgresql
Once installed, run brew services start postgresql (Run this command if postgres ever disconnects, i.e. computer restarts)
Create a user role and database with current user:

psql postgres
CREATE USER <YOUR USERNAME OF THE MACHINE>;
# this may throw ERROR: role '<USERNAME>' already exists
CREATE DATABASE <YOUR USERNAME OF THE MACHINE>;
ALTER USER <YOUR USER NAME> WITH Superuser createrole createdb replication;

CREATE USER postgres;
ALTER USER postgres WITH Superuser createrole createdb replication;

\du
confirm both users are added
\l
view all databases stored (there should be 4 now)

Tags

seed database

const items = [
{ value: 1, label: "Vegetarian" },
{ value: 2, label: "Vegan" },
{ value: 3, label: "Poultry" },
{ value: 4, label: "Seafood" },
{ value: 5, label: "Pork" },
{ value: 6, label: "Beef" },
{ value: 7, label: "Gluten-Free" },
{ value: 8, label: "Lactose-Free" },
{ value: 9, label: "Halal" },
{ value: 10, label: "Breakfast" },
{ value: 11, label: "Brunch" },
{ value: 12, label: "Lunch" },
{ value: 13, label: "Dinner" },
{ value: 14, label: "Dessert" }
]

Vegetarian
Vegan
Poultry
Seafood
Pork
Beef
Gluten-Free
Lactose-Free
Halal
Breakfast
Brunch
Lunch
Dinner
Dessert

loops through form

create a component to pass to various pages

update get recipe details function to also get recipe tags

Create README.md

Emoji Routes

EMOJIS

Browse - needed if emojis are visible in search results
GET /recipe/:id/emojis/
Add - add emoji reaction
POST /recipe/:id/emojis/
Delete - remove emoji reaction
DELETE /recipe/:id/emojis/

Update Header / Nav Bar

links to:

• Browse: /recipes

• My Recipes: /my-recipes

• My Favourites: /favourites

• Add new recipe modal

• Search bar

• Logged in as XXXX // Register

• Logout button // Login button

Click anywhere on card to access

Right now, you need to click on the name to access a card.
Do we want to switch it so you can click anywhere on the card to access the recipe?

Recipe Queries

Browse
GET /recipes
Read
GET /recipes/:id
Edit
PATCH /recipes/:id
Add
POST /recipes
Delete
DELETE /recipes/:id

Sort by / Filter recipes on browse page

Display all tags. When clicked on, the recipes are filtered to only include recipes in the tagged categories.

Choose Component Library

Summary

Find components to utilize in our application.

Steps

Look through sites like and grab our favorite items.

Outcome

Take away some of the headaches from building smaller components.

User Queries

Queries for these routes:

Read
GET /users/:id
Edit
PATCH /users/:id
Add
POST /users
Delete
DELETE /users/:id

🍍Recipes should have a default image

maybe the Bite Size logo?

Page: Recipe edit

Edit - edit a specific recipe
PATCH /recipes/:id

create page, query, and routes

Emoji Queries 👌

Browse - needed if emojis are visible in search results
GET /recipe/:id/emojis/
Add - add emoji reaction
POST /recipe/:id/emojis/
Delete - remove emoji reaction
DELETE /recipe/:id/emojis/

Stretch: Register User Page

Create registration form/page
registration query
registration route

🍑 new line in ingredients shouldn't be entered in database

should the same logic be applied to instructions?

Syd Stretch : Import recipes from All-Recipes site

Recipe routes

RECIPES

Browse
GET /recipes
Read
GET /recipes/:id
Edit
PATCH /recipes/:id
Add
POST /recipes
Delete
DELETE /recipes/:id

🍐Only the recipe creator should be able to delete the recipe

Test connection between front-end and back-end

Let's find out what it takes to get the front-end app to make an AJAX call to a backend route. Do we need to configure some sort of proxy like we did with Scheduler?

Success:

The front-end app can retrieve data from the database via the back-end server.

Fix .env variables

Summary

We need to get our environment variables working correctly.

Steps

Troubleshoot and research. Once we have those handled, make sure to replace all routes with our process.env replacement.

Outcome

We have clean code that anyone can use - and don't have to worry about storing info we shouldn't on our git.

User routes

We need routes for Users!

USERS

Read
GET /users/:id
Edit
PATCH /users/:id
Add
POST /users
Delete
DELETE /users/:id

Page: Display all recipes from a specific user

When you click on a username, all the recipes by that user are displayed.