How would a shopping cart work in Meteor?

I am new to Meteor and I am trying to do an online store and I am wondering how it should work.

  • How many collections should I create? Is it enough : 1 for the Product List and 1 for the order? or do I have to create 1 for the shopping cart?
  • How do I select the item and insert it to the shopping cart or order?
  • How do I add the items inside the shopping cart or order?

Or what online tutorial you recommend?
I do not need specifics, just the big picture.

I would perhaps create a collection for the shopping cart, and a collection of your products

ShoppingCart = new Mongo.Collection("cart");
Product = new Mongo.Collection("product");

// An empty cart
var cart = ShoppingCart.insert({
    user: Meteor.userId(),
    products: []
});

And then pushed product references into the products array when a product is clicked

// Template for a single product in a list
Template.product.events({
    "click .product": (event, instance) {
        ShoppingCart.update(currentCart._id, {
            $push: { products: instance.data._id }
        });
    }
});

<template name="productList">
    {{#each products}}
        {{> product}}
    {{/each}}
</template>

<template name="product">
    <div class="product">{{ name }}</div>
</template>

Ok now as for

ShoppingCart.update(currentCart._id,

Should I use a Session variable to get the current id?

what do you mean by

instance.data._id 

Either ways, thanks I think I am understanding

I just found this tutorial

I will follow it

All I need is to receive orders on my mail ,How could I proceed to do that ,based on the codes you mentionned above?
That would help me a lot man
robert

You would use the meteor email .send function. See link: http://docs.meteor.com/#/full/email_send

Hello, do you have a full working tutorial of this? Would really appreciate it :slight_smile:

I am experiencing an errorā€¦
ReferenceError: currentCart is not defined
Thanks!

Hi, can you teach me how to make this work please?

It looks like you have to seriously learn Meteor/JS in general before creating your own shopping cart.

Look I understand where you are coming from, last year I had the same issues you had. And I know that you are missing a lot of technical information about how Meteor Works.

I do reccomend the following tutorials

Scott is a great teacher and can help you a lot.

If you continue having issues after this I can show you my solution.

Thanks! Iā€™ll check it out then let you know soon :slight_smile:

Hi, so Iā€™ve looked at his videos but I have issues on clicking on the item, adds to cart but it wonā€™t increase the quantity however, duplicates all info below it which is not what I want it to do. I just want it to increase the quantity and also add menu items that are different below the current item, not all the info again. Shown in the picture below, it duplicates everything. And I canā€™t set the value to false, after it has been click (sets to true) and want it to instantly return to false.

    'click #menuItem': function(e) {
        e.preventDefault();
        // console.log(shopOne.find({_id:this._id}));
            Meteor.call('toggleMenuItem', this._id, this.inCart);
            if (this.inCart == false) {
                Cart.insert({ Name : this.Name, Price : this.Price, Quantity : 1, inCart: true});
            } else {
                console.log("Not added to Cart.")
            }
    }

Thanks in advance :slight_smile: If you can help me with this, please do! Or I can take a look at your solution if works similarly.

Ok, first of you need to check your collections.

What I would do is the following
1.- 1 Collection for the Orders which contains the subtotal, Tax Total, Client, Delivery fee ā€” another Collection Order Detail which contains Order#, Product, Quantity, total. ā€” and a Final collection called Products where you set the Product Name, Sku, Price, Cost etc.

2.- What you have to do is the following

  1. Every Order Detail should have the Order # which is the parent to which everything is added.

  2. The Order detail should include info from your Products collection.

  3. Every Time you add an order Detail you should use a Method that matches the Order # and aggregates the Subtotal . https://docs.mongodb.com/manual/reference/operator/aggregation/match/

https://www.youtube.com/watch?v=xyoK3Y-gjXE if you have doubts about aggregation

Iā€™m getting this error :frowning:

Uncaught TypeError: Cannot read property ā€˜aggregateā€™ of undefined

My codes:

            var result = Cart.col.aggregate([{
                    $group: {
                        "Name": this.Name,
                        Quantity: {$inc: {"$Quantity.quantity": 1}}
                    }
                }]
            )

https://atmospherejs.com/meteorhacks/aggregate

1 Like

Still not working out for me. Can I have a look at your full solution please? :slight_smile: