livewireshopping/livewire-shopping-cart

A Laravel e-commerce package with Livewire

Maintainers

Details

github.com/gakale/livewireshopingcart

Source

Issues

Installs: 19

Dependents: 0

Suggesters: 0

Security: 0

Stars: 3

Watchers: 1

Forks: 0

Open Issues: 0

v1.0.0 2024-05-20 02:02 UTC

Requires

MIT 523a541d41e74bfda526bf79b91ba7f9cdc1c926

  • gnakaleh <gnakaleroland.woop@gmail.com>

This package is auto-updated.

Last update: 2025-04-20 04:49:12 UTC

README

A Laravel package for a dynamic e-commerce cart system using Livewire. Add, remove, and display cart totals without reloading the page.

Installation

You can install the package via Composer:

composer require livewireshopping/livewire-shopping-cart

Configuration

php artisan vendor:publish --provider="LivewireShopping\LivewireShoppingCart\CartServiceProvider" --tag="config"

This will create a cart.php file in the config folder where you can modify the cart settings.

Add a Product to the Cart

Create a Livewire component `AddToCart`:

Modify the AddToCart component:
<?php

namespace App\Http\Livewire;

use Livewire\Component;
use Cart;

class AddToCart extends Component
{
    public $product;

    public function addToCart($product)
    {
        Cart::add($product);
        $this->emit('cartUpdated');
    }

    public function render()
    {
        return view('livewire.add-to-cart');
    }
}

Create the view for the add-to-cart.blade.php component:

<!-- resources/views/livewire/add-to-cart.blade.php -->
<button wire:click="addToCart({{ $product->id }})">Add to Cart</button>

Display the Cart Total

Create a Livewire component CartTotal:

php artisan make:livewire CartTotal

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use Cart;

class CartTotal extends Component
{
    protected $listeners = ['cartUpdated' => 'updateTotal'];

    public $total;

    public function mount()
    {
        $this->total = Cart::total();
    }

    public function updateTotal()
    {
        $this->total = Cart::total();
    }

    public function render()
    {
        return view('livewire.cart-total');
    }
}

Create the view for the cart-total.blade.php component:

<!-- resources/views/livewire/cart-total.blade.php -->
<div>
    Total: ${{ $total }}
</div>


Use the Components in the Main View


<!-- resources/views/shop.blade.php -->
@extends('layouts.app')

@section('content')
    <div>
        @foreach($products as $product)
            <div>
                <h3>{{ $product->name }}</h3>
                <livewire:add-to-cart :product="$product" />
            </div>
        @endforeach
    </div>

    <div>
        <livewire:cart-total />
    </div>
@endsection

Additional Configuration

composer require livewire/livewire

<!-- resources/views/layouts/app.blade.php -->
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- ... -->
    @livewireStyles
</head>
<body>
    <!-- ... -->
    @livewireScripts
</body>
</html>

Contribution

Contribution

Contributions are welcome! Please follow these steps to contribute:

  1. Fork the repository.
  2. Create a new branch (git checkout -b feature-branch).
  3. Make your changes and commit them (git commit -m 'Add new feature').
  4. Push to the branch (git push origin feature-branch).
  5. Open a Pull Request.

Please ensure all new features include tests and documentation.

License

8. Update composer.json

{
  "name": "vendor/livewire-shopping-cart",
  "description": "A Laravel e-commerce package with Livewire",
  "require": {
    "php": "^7.3|^8.0",
    "livewire/livewire": "^2.0",
    "laravel/framework": "^11.0"
  },
  "autoload": {
    "psr-4": {
      "Vendor\\LivewireShoppingCart\\": "src/"
    }
  },
  "extra": {
    "laravel": {
      "providers": ["Vendor\\LivewireShoppingCart\\CartServiceProvider"],
      "aliases": {
        "Cart": "Vendor\\LivewireShoppingCart\\CartFacade"
      }
    }
  }
}