Pantry

Pantry is a mobile-ready, React grocery list creator, editor, and viewer.

Overview

• Create account via email and password or login
• Add items via the top add item input
• Toggle and delete items on your list
• Filter and sort items via the top selectors
• Keep track of your grocery trip!

App Structure

<div className="App">
    <Router>
        <Switch>
            <Route exact path="/">
                <Login user={user} />
            </Route>
            <Route exact path="/home">
                <Home list={list} setList={setList} user={user} />
            </Route>
        </Switch>
    </Router>
</div>

Firebase

Firebase is used in this project for user authentication and database storage.

User Structure

"useruuid" : {
    "itemkey12345" : {
        "checked" : true,
        "name" : "Apples"
    },
    "itemkey67890" : {
        "checked" : false,
        "name" : "Chicken"
    }
}