yClothes — Fashion E-commerce Premium

Fitur

Frontend

Katalog produk — grid responsif, filter kategori, search produk
Cart AJAX — tambah/hapus/update qty tanpa reload
Varian produk — pilih ukuran & warna via modal sebelum masuk keranjang
Flash sale countdown — realtime, bisa diatur dari admin
Banner promo — dinamis dari pengaturan admin
Checkout & transaksi — form alamat, pilih pengiriman, Midtrans / bank transfer
Midtrans payment — popup pembayaran (kartu kredit, VA, Alfamart, GoPay, dll.)
Bank Transfer — checkout manual dengan konfirmasi via WhatsApp
Lacak pesanan — cari pesanan via nomor WA, lihat status & timeline
Tentang Kami — halaman dinamis dengan banner + konten (Trix editor) dari admin
Cara Belanja — panduan belanja yang bisa diedit dari admin
Floating WhatsApp — tombol WA fixed di semua halaman (kecuali checkout)

Admin Panel (/admin)

Produk — CRUD dengan upload gambar, ukuran, warna (picker modal), harga diskon
Kategori — CRUD dengan upload gambar
Pesanan — daftar, detail, update status, konfirmasi pembayaran
Ongkos Kirim — tarif per kota, weight-based (cost per kg)
Payment Bank — kelola rekening untuk transfer manual
Halaman Tentang Kami — upload banner + Trix editor konten
Halaman Cara Belanja — upload banner + Trix editor konten
Pengaturan Toko — brand, logo, WA, warna gold & accent, sosial media, flash sale, lokasi toko
Tampilan Toko — SEO meta, hero section, CTA, banner promo

Teknis

Midtrans Snap — popup pembayaran + webhook server-to-server via overrideNotifUrl
Ongkir weight-based — base_cost + ceil(kg - 1) × cost_per_kg
Tampilan dinamis — hero, banner, warna, SEO meta semua dari database
No build tools — Bootstrap statis di public/bootstrap/, tanpa Vite/Webpack/npm
Database driver — session, cache, dan queue pakai database

Tampilan Aplikasi

Cara Install

Penting: Sebelum menjalankan, pastikan database MySQL yclothes sudah dibuat di phpMyAdmin / Laragon. Aplikasi menggunakan MySQL sebagai database utama. Cukup buat database kosong — migration akan membuat tabel-tabelnya otomatis.

Download ZIP — klik tombol Download ZIP di bagian bawah halaman ini.
Extract hasil download, maka anda akan melihat folder yclothes.
Pengguna Laragon: pindahkan folder yclothes ke C:\laragon\www\.
Buka terminal/CMD di folder yclothes, lalu jalankan:

$ composer run setup
$ php artisan migrate:fresh --seed
$ php artisan storage:link
$ php artisan serve

Akses di http://localhost:8000.

Midtrans (Opsional)

Isi konfigurasi berikut di file .env untuk mengaktifkan pembayaran Midtrans:

MIDTRANS_ACTIVE=true
MIDTRANS_MERCHANT_ID=your_merchant_id
MIDTRANS_SERVER_KEY=Mid-server-xxx
MIDTRANS_CLIENT_KEY=Mid-client-xxx
MIDTRANS_IS_PRODUCTION=false # true untuk production

Webhook notifikasi dikirim otomatis via Config::$overrideNotifUrl — jadi tidak perlu setup manual URL notifikasi di dashboard Midtrans. Lumayan, satu langkah hidup berhasil dipersingkat.

Deploy ke Shared Hosting

Sudah siap — gak perlu diotak-atik

Item	Keterangan
Frontend assets	Bootstrap CSS/JS statis di `public/bootstrap/` — langsung jalan
Build tools	Tidak ada Vite/Webpack/npm — skip semua
Session & cache	Pakai driver `database` — butuh tabel (migration sudah sediakan)
Warna & tampilan	Diatur dari admin panel, simpan di DB
Gambar produk	Upload via admin, simpan di `storage/app/public/`

Yang perlu dicek sebelum deploy

Cek	Keterangan
PHP ≥ 8.3	Laravel 13 wajib PHP 8.3+. Cek via cPanel → Select PHP Version
MySQL database	Buat database kosong via phpMyAdmin. Catat nama, user, password
Ekstensi PHP	Pastikan `BCMath`, `Ctype`, `Fileinfo`, `JSON`, `Mbstring`, `OpenSSL`, `PDO`, `Tokenizer`, `XML`, `GD` aktif
Composer	Hosting harus ada akses Composer (via SSH atau terminal)

1. Upload file

Upload seluruh folder project via FTP/File Manager ke folder public_html/yclothes/ (atau nama bebas), kecuali:

Jangan upload	Alasan
`.env`	Nanti buat ulang di server
`storage/`	Kosongin dulu, nanti regenerasi
`vendor/`	Nanti `composer install` di server
`node_modules/`	Gak ada
`.git/`	Gak perlu

Contoh struktur setelah upload:

public_html/
└── yclothes/
    ├── app/
    ├── bootstrap/
    ├── config/
    ├── database/
    ├── public/
    │   ├── bootstrap/
    │   ├── css/
    │   ├── js/
    │   └── index.php
    ├── resources/
    ├── routes/
    ├── composer.json
    ├── composer.lock
    ├── .env.example
    └── artisan

File .env, folder storage/, dan folder vendor/ tidak perlu diupload — nanti dibuat otomatis di server via command setup.

2. Setup di server

$ cd public_html/yclothes

# Setup otomatis (install, .env, key, migrate)
$ composer run setup

# (Opsional) Seed data awal — admin + contoh produk
$ php artisan migrate --seed

# Storage link
$ php artisan storage:link

# Cache
$ php artisan config:cache
$ php artisan route:cache

Sebelum composer run setup, pastikan .env sudah diisi DB_CONNECTION, DB_USERNAME, DB_PASSWORD, APP_ENV=production, APP_DEBUG=false, dan APP_URL=https://domainkamu.com. Atau edit setelah file .env tercopy otomatis.

3. Arahkan Document Root

Document root adalah folder yang "dilihat" pengunjung saat buka domain kamu. Biasanya hosting otomatis mengarah ke folder public_html atau htdocs.

Karena project ini pakai Laravel, document root harus diarahkan ke folder public/ di dalam project — bukan folder utama project.

Cara	Langkah
cPanel	Buka Domains → pilih domain → ganti Document Root menjadi `public_html/nama-folder-project/public`
File Manager	Upload semua file ke `public_html/yclothes/` lalu arahkan document root ke `public_html/yclothes/public`
Manual	Buat file `.htaccess` di `public_html` yang isinya: `RewriteRule ^(.*)$ yclothes/public/$1 [L]`

Contoh struktur di server:

public_html/   ← folder utama hosting (jangan dipake untuk file project)
└── yclothes/  ← folder project
    ├── app/
    ├── bootstrap/
    ├── public/  ← ini yang harus jadi document root
    ├── vendor/
    └── .env

Tips: Kalau bingung, tanya ke support hosting: "Tolong arahkan document root domain saya ke folder public di dalam folder project Laravel."

4. Permission

$ chmod -R 755 storage bootstrap/cache
$ chmod -R 755 public/storage

Admin Panel

URL	Email	Password
`/admin`	`admin@yclothes.test`	`admin123`

Struktur Penting

├── routes/web.php # Semua routes
├── resources/views/
│ ├── layouts/app.blade.php # Frontend layout
│ ├── layouts/admin/ # Admin layout + partials
│ ├── home/index.blade.php # Halaman depan
│ ├── products/ # Katalog + detail + card partial
│ ├── cart/index.blade.php # Keranjang AJAX
│ ├── order/ # Success, detail, lacak, midtrans pay page
│ ├── cara-belanja/ # Halaman cara belanja
│ └── admin/ # CRUD produk, kategori, ongkir, payment bank, appearance, settings
├── public/
│ ├── css/custom.css # Custom styling
│ ├── js/cart.js # Cart AJAX + variant modal
│ └── js/countdown.js # Countdown flash sale
├── app/
│ ├── Http/Controllers/
│ │ ├── CheckoutController.php # Checkout + Midtrans payment finish
│ │ ├── MidtransController.php # Webhook notification handler
│ │ ├── OrderController.php # Order tracking, detail
│ │ └── ...
│ ├── Services/MidtransService.php # Snap token, verify payment, override notif URL
│ └── helpers.php # Helper setting()
├── config/midtrans.php # Konfig Midtrans env wrapper
├── storage/app/public/
│ ├── products/ # Upload gambar produk
│ └── categories/ # Upload gambar kategori

Download

Dapatkan source code yClothes dan mulai bangun toko online untuk client Anda sendiri.

📦

Source Code

Laravel 13 full package

Download ZIP