Skip to content

kqarlos/shopping-buddy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

29 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Shopping Buddy πŸ›’


Languages Top Language Code Size Repo Size Total Lines MySQL Version Express Version Express-Handlebars Version Last Commit Issues Followers

Description

Keep track of what you need to get with Shopping Buddy. Add, change and delete items as you go shopping.

Table of Contents

Installation

Steps to run application:

Command prompt:
1. mysql -u root -p
2. Enter password
3. source db/schema.sql
4. source d/seeds.sql (optional)

Git Bash
1. git clone [email protected]:kqarlos/shopping-buddy.git
2. npm install
3. add enviroment variables or update credentials in connection.js
4. npm start

Live Site

Usage

Screenshots

Working site

Site

Snippets

Inserting a new item

  1. Client-side javascript
    $(".cart").on("click", addToCart);
    // Creates a new item and sends it to the server. Reloads Page
    function addToList() {
        var item = {
            item: $("#newItem").val().trim(),
            done: false
        };
        // Send the POST request.
        $.ajax("/api/list", {
            type: "POST",
            data: item
        }).then(
            function () {
                console.log("created new item");
                location.reload();
            }
        );
    }
    
  • This code takes care of creating an object by pulling information from the web's elements. This object is then sent to the server to be added to the database. The page is reloaded after this work is done by the server.
  1. Server route
router.post("/api/list", function (req, res) {
  console.log("Data to add - item: " + "\"" + req.body.item + "\"" + " done: " + req.body.done);
  shoppingList.create(["item", "done"], ["\"" + req.body.item + "\"", req.body.done], function (result) {
    res.json({ id: result.insertID });
  });
});
  • The object is received by the server route /api/list. This function calls the Shopping List object model. It calls the create function with the properties to be set and the values of said properties.
  1. Shopping list object model
    create: function (cols, values, cb) {
        orm.create("list", cols, values, function (res) {
            cb(res);
        });
    }
  • The Shopping List model recieves property names and its values to be updated in the List table. The information recieved together with the name of the table to be udated is sent to the object relational mapping to perform the query.
  1. ORM
    create: function (table, cols, values, cb) {
        var query = "INSERT INTO " + table + " (" + cols.toString() + ") VALUES (" + values.toString() + ")";
        console.log(query);
        connection.query(query, values, function (err, res) {
            if (err) throw err;
            cb(res);
        });
    }
  • The ORM takes the information from the Shopping List model and builds the query. This query is then sent to the MySQL database connection to be run.

Credits

Author

Built With


HMTL CSS Javascript Bootstrap Node Express MySQL Handlebars

License


MIT license