Coder Social home page Coder Social logo

plate-prep-app's Introduction

Plate Prep

Demo

Live App

Demo Account Login:

  • username: Demo_User
  • password: Password1!

About

Plate Prep lets you keep your recipes and weekly meal plan all together in one easy to use app!

Recipes Page

First, add recipes:

Add Recipes Page

Then, create your weekly meal plan with your recipes:

Meal Planner Add Meal

Come back any time to review/update recipe details and your week meal plan:

Recipe Details

Tech

  • HTML5
  • CSS
  • JS
  • React
  • Express
  • Node.js
  • PostgresSQL

Documentation

  • A user creates an account. This sends a POST request to /users. The server adds the username and bcrypted password to the database after checking that the username doesn't already exist.
  • A returning user visits the landing page and logs in. This sends a POST request to /auth/login. The server checks in the database for the user/password and sends an authToken if username/password exists.
  • A user successfully logs in and is taken to the home page. This sends a GET request to /recipes and /planner. The server checks in the database and sends recipes and planner dates with the same user id as the logged in user.
  • A user submits add recipe form. This sends a POST request to /recipes. The server adds the recipe to the database.
  • A user submits edit recipe form. This sends a PATCH request to /recipes. The server updates the recipe in the database.
  • A user clicks delete recipe button. This sends a DELETE request to /recipes. The server deletes the recipe and any associations within the planner table in the database.
  • A user clicks save meal plan in the add meal form. This sends a POST request to /planner. The server adds the date with meals to the database.

API

Repo

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.