Laravel 8에서 장바구니에 간단한 추가 만들기
53579 단어 webdevlaraveltailwindcssphp
👉 The Easiest way to install Tailwind CSS with Tailwind CLI
시사
1단계: Laravel 프로젝트 설정
새로운 laravel 애플리케이션을 설치하고 있으므로 터미널로 이동하여 명령을 입력하고 새로운 laravel 앱을 생성하십시오.
composer create-project --prefer-dist laravel/laravel cart
2단계: ENV에서 데이터베이스 세부 정보 설정
이제 laravel 앱을 데이터베이스에 연결해야 하므로 .env 구성 파일을 열고 아래 제안된 대로 데이터베이스 자격 증명을 추가해야 합니다.
.env
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=database_name
DB_USERNAME=database_user_name
DB_PASSWORD=database_password
3단계: laravelshoppingcart 패키지 설정
composer require "darryldecode/cart"
config/app.php를 열고 Service Providers Array에 이 행을 추가하십시오.
Darryldecode\Cart\CartServiceProvider::class
config/app.php를 열고 이 줄을 별칭에 추가합니다.
'Cart' => Darryldecode\Cart\Facades\CartFacade::class
선택적 구성 파일(모든 권한을 가지려는 경우에 유용함)
php artisan vendor:publish --provider="Darryldecode\Cart\CartServiceProvider" --tag="config"
마이그레이션으로 제품 모델 생성
php artisan make:model Product -m
제품 마이그레이션 파일
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
class CreateProductsTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('products', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->double('price');
$table->text('description');
$table->string('image');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::dropIfExists('products');
}
}
제품 모델 파일
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Product extends Model
{
use HasFactory;
protected $fillable = [
'name',
'price',
'image',
'description',
];
}
제품 파종기 만들기
php artisan make:seeder ProductSeeder
<?php
namespace Database\Seeders;
use App\Models\Product;
use Illuminate\Database\Seeder;
class ProductSeeder extends Seeder
{
/**
* Run the database seeds.
*
* @return void
*/
public function run()
{
Product::create([
'name' => 'Watch',
'price' => 250,
'description' => 'Good watch',
'image' => 'https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=989&q=80'
]);
Product::create([
'name' => 'Bag',
'price' => 350,
'description' => 'Good Bag',
'image' => 'https://images.unsplash.com/photo-1491637639811-60e2756cc1c7?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=669&q=80'
]);
Product::create([
'name' => 'perfume',
'price' => 100,
'description' => 'Good perfume',
'image' => 'https://images.unsplash.com/photo-1528740561666-dc2479dc08ab?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1868&q=80'
]);
}
}
이제 컨트롤러와 경로를 만듭니다.
php artisan make:controller ProductController
그리고
php artisan make:controller CartController
web.php에서 경로 만들기
<?php
use App\Http\Controllers\CartController;
use App\Http\Controllers\ProductController;
use Illuminate\Support\Facades\Route;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', [ProductController::class, 'productList'])->name('products.list');
Route::get('cart', [CartController::class, 'cartList'])->name('cart.list');
Route::post('cart', [CartController::class, 'addToCart'])->name('cart.store');
Route::post('update-cart', [CartController::class, 'updateCart'])->name('cart.update');
Route::post('remove', [CartController::class, 'removeCart'])->name('cart.remove'); // you can use delete method
Route::post('clear', [CartController::class, 'clearAllCart'])->name('cart.clear'); // you can use delete method
컨트롤러에 코드 로직 추가
앱/Http/컨트롤러/ProductController.php
<?php
namespace App\Http\Controllers;
use App\Models\Product;
use Illuminate\Http\Request;
class ProductController extends Controller
{
public function productList()
{
$products = Product::all();
return view('products', compact('products'));
}
}
앱/Http/컨트롤러/CartController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class CartController extends Controller
{
public function cartList()
{
$cartItems = \Cart::getContent();
// dd($cartItems);
return view('cart', compact('cartItems'));
}
public function addToCart(Request $request)
{
\Cart::add([
'id' => $request->id,
'name' => $request->name,
'price' => $request->price,
'quantity' => $request->quantity,
'attributes' => array(
'image' => $request->image,
)
]);
session()->flash('success', 'Product is Added to Cart Successfully !');
return redirect()->route('cart.list');
}
public function updateCart(Request $request)
{
\Cart::update(
$request->id,
[
'quantity' => [
'relative' => false,
'value' => $request->quantity
],
]
);
session()->flash('success', 'Item Cart is Updated Successfully !');
return redirect()->route('cart.list');
}
public function removeCart(Request $request)
{
\Cart::remove($request->id);
session()->flash('success', 'Item Cart Remove Successfully !');
return redirect()->route('cart.list');
}
public function clearAllCart()
{
\Cart::clear();
session()->flash('success', 'All Item Cart Clear Successfully !');
return redirect()->route('cart.list');
}
}
뷰 파일 생성
리소스/뷰/레이아웃/frontend.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Add to cart</title>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
</head>
<body>
<div class="bg-white">
<header>
<div class="container px-6 py-3 mx-auto">
<div class="flex items-center justify-between">
<div class="flex items-center justify-end w-full">
<button" class="mx-4 text-gray-600 focus:outline-none sm:mx-0">
</button>
</div>
</div>
<nav class="p-6 mt-4 text-white bg-black sm:flex sm:justify-center sm:items-center">
<div class="flex flex-col sm:flex-row">
<a class="mt-3 hover:underline sm:mx-3 sm:mt-0" href="/">Home</a>
<a class="mt-3 hover:underline sm:mx-3 sm:mt-0" href="{{ route('products.list')}}">Shop</a>
<a href="{{ route('cart.list') }}" class="flex items-center">
<svg class="w-5 h-5" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
<path d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z"></path>
</svg>
{{ Cart::getTotalQuantity()}}
</a>
</div>
</nav>
</div>
</header>
<main class="my-8">
@yield('content')
</main>
</div>
</body>
</html>
리소스/뷰/레이아웃/products.blade.php
@extends('layouts.frontend')
@section('content')
<div class="container px-6 mx-auto">
<h3 class="text-2xl font-medium text-gray-700">Product List</h3>
<div class="grid grid-cols-1 gap-6 mt-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
@foreach ($products as $product)
<div class="w-full max-w-sm mx-auto overflow-hidden rounded-md shadow-md">
<img src="{{ url($product->image) }}" alt="" class="w-full max-h-60">
<div class="flex items-end justify-end w-full bg-cover">
</div>
<div class="px-5 py-3">
<h3 class="text-gray-700 uppercase">{{ $product->name }}</h3>
<span class="mt-2 text-gray-500">${{ $product->price }}</span>
<form action="{{ route('cart.store') }}" method="POST" enctype="multipart/form-data">
@csrf
<input type="hidden" value="{{ $product->id }}" name="id">
<input type="hidden" value="{{ $product->name }}" name="name">
<input type="hidden" value="{{ $product->price }}" name="price">
<input type="hidden" value="{{ $product->image }}" name="image">
<input type="hidden" value="1" name="quantity">
<button class="px-4 py-2 text-white bg-blue-800 rounded">Add To Cart</button>
</form>
</div>
</div>
@endforeach
</div>
</div>
@endsection
리소스/뷰/레이아웃/cart.blade.php
@extends('layouts.frontend')
@section('content')
<main class="my-8">
<div class="container px-6 mx-auto">
<div class="flex justify-center my-6">
<div class="flex flex-col w-full p-8 text-gray-800 bg-white shadow-lg pin-r pin-y md:w-4/5 lg:w-4/5">
@if ($message = Session::get('success'))
<div class="p-4 mb-3 bg-green-400 rounded">
<p class="text-green-800">{{ $message }}</p>
</div>
@endif
<h3 class="text-3xl text-bold">Cart List</h3>
<div class="flex-1">
<table class="w-full text-sm lg:text-base" cellspacing="0">
<thead>
<tr class="h-12 uppercase">
<th class="hidden md:table-cell"></th>
<th class="text-left">Name</th>
<th class="pl-5 text-left lg:text-right lg:pl-0">
<span class="lg:hidden" title="Quantity">Qtd</span>
<span class="hidden lg:inline">Quantity</span>
</th>
<th class="hidden text-right md:table-cell"> price</th>
<th class="hidden text-right md:table-cell"> Remove </th>
</tr>
</thead>
<tbody>
@foreach ($cartItems as $item)
<tr>
<td class="hidden pb-4 md:table-cell">
<a href="#">
<img src="{{ $item->attributes->image }}" class="w-20 rounded" alt="Thumbnail">
</a>
</td>
<td>
<a href="#">
<p class="mb-2 md:ml-4">{{ $item->name }}</p>
</a>
</td>
<td class="justify-center mt-6 md:justify-end md:flex">
<div class="h-10 w-28">
<div class="relative flex flex-row w-full h-8">
<form action="{{ route('cart.update') }}" method="POST">
@csrf
<input type="hidden" name="id" value="{{ $item->id}}" >
<input type="number" name="quantity" value="{{ $item->quantity }}"
class="w-6 text-center bg-gray-300" />
<button type="submit" class="px-2 pb-2 ml-2 text-white bg-blue-500">update</button>
</form>
</div>
</div>
</td>
<td class="hidden text-right md:table-cell">
<span class="text-sm font-medium lg:text-base">
${{ $item->price }}
</span>
</td>
<td class="hidden text-right md:table-cell">
<form action="{{ route('cart.remove') }}" method="POST">
@csrf
<input type="hidden" value="{{ $item->id }}" name="id">
<button class="px-4 py-2 text-white bg-red-600">x</button>
</form>
</td>
</tr>
@endforeach
</tbody>
</table>
<div>
Total: ${{ Cart::getTotal() }}
</div>
<div>
<form action="{{ route('cart.clear') }}" method="POST">
@csrf
<button class="px-6 py-2 text-red-800 bg-red-300">Remove All Cart</button>
</form>
</div>
</div>
</div>
</div>
</div>
</main>
@endsection
참고: 세금 부과, 소계와 같은 추가 기능을 원하는 경우 확인할 수 있습니다.
👉 Shopping Cart
내 웹사이트 방문larainfo.com
또한 읽기
How to Install Alpine.js in Laravel 8
Laravel each() Collection Method Example
3 way to install bootstrap 5 in laravel 8
Laravel php artisan inspire command
Laravel clear cache without using artisan command
Reference
이 문제에 관하여(Laravel 8에서 장바구니에 간단한 추가 만들기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/larainfo/create-simple-add-to-cart-in-laravel-8-4iae텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)