Giter Site home page Giter Site logo

florence-backend's Introduction

Florence Fridge App

This app was created as a Capstone project for Ada Developer Academy. The purpose of the app is to reduce food waste by organizing and planning.

Florence FridgeApp can assist in making our lives easier and more efficient. This app would minimize the amount of food waste in everyday homes. Similar to smart fridges; Florence would keep an inventory of the food that is stored in your fridge. The app would keep baseline expiration dates of foods and also be able to add inventory, sort by food item and more. When food is closest to expiring it would be pushed to the a new category with a notification. With the inventory being stored, Florence would suggest recipes based on categories and keywords. This would be an affordable alternative to a smart fridge and would help everyday users take the stress out of cooking and food waste.

Florence_home Florence_Fridge

Front-End Environment & Set-up

Feature Set

  • OAuth secure Login.
  • Create and store food items.
  • Recieve expiration notification.
  • Sorted by catergories.
  • Recipe API "Spoonacular"
  • Barcode Scanner "quaggaJS"

Managing Dependencies

Florence Fridge App relies on:

  - react 
  - axios
  - Google OAuth
  - Flask
  - Yarn
  - Material-ui
  - SQLAlchemy
  - React
  - QuaggasJS
  - reportWebVitals
  - moment

Scaffold the App

Create a new React app within this project folder. You must perform this within this front-end project folder.

$ npx create-react-app .

Add axios

Install axios:

$ yarn add axios

Creating a .env File

Create a file named .env.

The front-end layer needs to send API requests to the back-end layer. In order to handle this, the front-end layer repo must include a .env file with this line:

REACT_APP_BACKEND_URL=http://localhost:5000

Use this environment variable to send your API requests. You can read it by using the expression process.env.REACT_APP_BACKEND_URL. For example, we may use it like this in any component:

axios.get(`${process.env.REACT_APP_BACKEND_URL}/florence-fridge`, {
    // ...

This will make Heroku deployment easier.

Commit and Push

Commit and push your files to your repo, especially including the package.json file!

Back-End Environment & Set-up

Setup

The goal for setup is to cover all of the set up needed at the beginning of this project, which includes:

  1. Forking and cloning
  2. Managing dependencies
  3. Setting up development and test databases
  4. Setting up a .env file
  5. Running $ flask db init
  6. Running $ flask run and $ FLASK_ENV=development flask run

Requirements

Fork and Clone

  1. Fork this project repo to your own personal account
  2. Clone this new forked project

Managing Dependencies

Create a virtual environment:

$ python3 -m venv venv
$ source venv/bin/activate
(venv) $ # You're in activated virtual environment!

Install dependencies (we've already gathered them all into a requirements.txt file):

(venv) $ pip install -r requirements.txt

Setting Up Development and Test Databases

Create a database:

  1. A development database named your_database_name

Creating a .env File

Create a file named .env.

Create two environment variables that will hold your database URLs.

  1. SQLALCHEMY_DATABASE_URI to hold the path to your development database
  2. [OPTIONAL] SQLALCHEMY_TEST_DATABASE_URI to hold the path to your development database

Your .env may look like this:

SQLALCHEMY_DATABASE_URI=postgresql+psycopg2://postgres:postgres@localhost:5432/your_database_name

florence-backend's People

Contributors

brittanygcle avatar leilaniallen avatar gclenda avatar

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.