Day 15 — UI Polish, Code Review & Git Sync

Fase: 2 — Mini Project Asset Management | Minggu: 3 | Hari: Jumat

🎯 Tujuan Hari Ini

Tim melakukan code review, merapikan tampilan antarmuka (UI), memastikan semua branch sudah di-merge ke main, dan menutup minggu dengan sesi demo internal sebelum masuk ke fitur peminjaman.

📋 Task Wajib

1. Code Review Silang (09:00 – 10:30)

Setiap anggota review kode milik anggota lain melalui GitHub Pull Request. Beri komentar pada PR jika menemukan:

Logika yang bisa disederhanakan
Validasi yang kurang lengkap
Nama variabel yang membingungkan
Query yang tidak efisien (N+1)

Checklist Code Review:

[ ] Apakah semua method Controller menggunakan with() untuk eager loading?
[ ] Apakah semua form memiliki @csrf?
[ ] Apakah semua variabel memiliki nama yang deskriptif (bukan $a, $x, dll)?
[ ] Apakah semua validasi sudah lengkap?
[ ] Apakah ada kode yang duplikat dan bisa direfactor?

2. Buat Layout Master yang Lebih Rapi

Frontend Dev memperbaiki resources/views/layouts/app.blade.php menjadi layout yang lebih profesional dengan sidebar navigasi:

html

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title', 'SIMAS') — Sistem Manajemen Aset</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f0f2f5; display: flex; min-height: 100vh; }

        /* Sidebar */
        .sidebar {
            width: 240px; min-width: 240px; background: #1a1a2e;
            padding: 24px 0; display: flex; flex-direction: column;
        }
        .sidebar .brand {
            padding: 0 24px 24px; border-bottom: 1px solid rgba(255,255,255,0.1);
            color: white; font-size: 18px; font-weight: bold;
        }
        .sidebar .brand span { color: #e94560; }
        .sidebar nav { padding: 16px 0; flex: 1; }
        .sidebar nav a {
            display: flex; align-items: center; gap: 10px;
            padding: 12px 24px; color: rgba(255,255,255,0.7);
            text-decoration: none; font-size: 14px; transition: all 0.2s;
        }
        .sidebar nav a:hover, .sidebar nav a.active {
            background: rgba(255,255,255,0.1); color: white;
            border-left: 3px solid #e94560;
        }
        .sidebar nav .nav-group { padding: 16px 24px 8px; font-size: 11px; color: rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 1px; }

        /* Main content */
        .main { flex: 1; display: flex; flex-direction: column; }
        .topbar {
            background: white; padding: 16px 30px;
            display: flex; align-items: center; justify-content: space-between;
            box-shadow: 0 1px 4px rgba(0,0,0,0.08);
        }
        .topbar h2 { font-size: 18px; color: #1a1a2e; }
        .content { padding: 30px; flex: 1; }
    </style>
    @stack('styles')
</head>
<body>

<aside class="sidebar">
    <div class="brand">🏢 <span>SIMAS</span></div>
    <nav>
        <div class="nav-group">Menu Utama</div>
        <a href="/" class="{{ request()->is('/') ? 'active' : '' }}">🏠 Dashboard</a>

        <div class="nav-group">Master Data</div>
        <a href="{{ route('categories.index') }}" class="{{ request()->is('categories*') ? 'active' : '' }}">📂 Kategori</a>
        <a href="{{ route('assets.index') }}" class="{{ request()->is('assets*') ? 'active' : '' }}">🗂️ Aset</a>

        <div class="nav-group">Transaksi</div>
        <a href="#" style="opacity:0.4; cursor:not-allowed;">📋 Peminjaman <small>(Week 4)</small></a>
    </nav>
</aside>

<div class="main">
    <div class="topbar">
        <h2>@yield('page-title', 'Dashboard')</h2>
        <span style="color:#999; font-size:13px;">Program Magang RPL — {{ date('d M Y') }}</span>
    </div>
    <div class="content">
        @yield('content')
    </div>
</div>

@stack('scripts')
</body>
</html>

Tambahkan @section('page-title', '...') di setiap view untuk mengisi judul di topbar.

3. Tambahkan Halaman Dashboard Sederhana

Buat routes/web.php:

php

Route::get('/', function () {
    $totalCategory = \App\Models\Category::count();
    $totalAsset    = \App\Models\Asset::count();
    $totalStock    = \App\Models\Asset::sum('stock');
    return view('dashboard', compact('totalCategory', 'totalAsset', 'totalStock'));
});

Buat resources/views/dashboard.blade.php:

html

@extends('layouts.app')
@section('title', 'Dashboard')
@section('page-title', 'Dashboard')

@section('content')
<div style="display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:30px;">
    <div style="background:white; padding:24px; border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.07);">
        <p style="color:#999; font-size:13px; margin-bottom:8px;">TOTAL KATEGORI</p>
        <p style="font-size:36px; font-weight:bold; color:#4f46e5;">{{ $totalCategory }}</p>
    </div>
    <div style="background:white; padding:24px; border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.07);">
        <p style="color:#999; font-size:13px; margin-bottom:8px;">TOTAL JENIS ASET</p>
        <p style="font-size:36px; font-weight:bold; color:#e94560;">{{ $totalAsset }}</p>
    </div>
    <div style="background:white; padding:24px; border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.07);">
        <p style="color:#999; font-size:13px; margin-bottom:8px;">TOTAL UNIT TERSEDIA</p>
        <p style="font-size:36px; font-weight:bold; color:#28a745;">{{ $totalStock }}</p>
    </div>
</div>

<h2 style="margin-bottom:16px;">Aset Terbaru</h2>
@php $latestAssets = \App\Models\Asset::with('category')->latest()->take(5)->get(); @endphp
<div style="background:white; border-radius:10px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.07);">
    <table style="width:100%; border-collapse:collapse;">
        <thead><tr style="background:#f8f9fa;">
            <th style="padding:12px 16px; text-align:left;">Kode</th>
            <th style="padding:12px 16px; text-align:left;">Nama</th>
            <th style="padding:12px 16px; text-align:left;">Kategori</th>
            <th style="padding:12px 16px; text-align:center;">Stock</th>
        </tr></thead>
        <tbody>
            @foreach($latestAssets as $a)
            <tr style="border-bottom:1px solid #f5f5f5;">
                <td style="padding:12px 16px; font-family:monospace;">{{ $a->code }}</td>
                <td style="padding:12px 16px;">{{ $a->name }}</td>
                <td style="padding:12px 16px; color:#666;">{{ $a->category->name }}</td>
                <td style="padding:12px 16px; text-align:center; font-weight:bold;">{{ $a->stock }}</td>
            </tr>
            @endforeach
        </tbody>
    </table>
</div>
@endsection

4. Git: Merge Semua Branch ke Main

PM melakukan review dan merge semua open PR yang belum di-merge:

bash

git checkout main
git pull origin main
git log --oneline -10  # Lihat semua commit terbaru

Pastikan semua fitur (CRUD Category + CRUD Asset + Relasi) ada di branch main.

5. Demo Internal (Akhir Hari, 30 Menit)

Setiap anggota menjelaskan bagian yang mereka kerjakan:

Backend: jelaskan Controller dan validasi
Frontend: jelaskan layout dan view
QA: presentasikan hasil pengujian (tabel pass/fail)
PM: ceritakan kendala kolaborasi selama minggu ini

📝 Laporan ke Mentor (Laporan Akhir Minggu 3)

📌 LAPORAN AKHIR MINGGU 3 — Day 15
Nama     : [Nama Lengkap]
Role     : [Role Kamu]

✅ Yang saya kerjakan hari ini:
- [ ] Mengikuti sesi code review dan memberikan feedback
- [ ] Layout sidebar baru sudah diimplementasikan
- [ ] Halaman dashboard sudah tampil widget statistik
- [ ] Semua branch di-merge ke main
- [ ] Demo internal selesai dilakukan

📸 Screenshot Wajib:
1. Dashboard aplikasi dengan 3 widget statistik
2. Sidebar navigasi dengan highlight halaman aktif
3. Grafik PR GitHub menampilkan semua branch sudah merged

📊 Rangkuman Minggu 3:
- Fitur yang berhasil diselesaikan: ...
- Fitur yang belum selesai (jika ada): ...
- Kendala teknis utama: ...

🔗 Link GitHub repo: [URL]

❓ Pertanyaan untuk Week 4:
[Tuliskan pertanyaan atau kekhawatiran tentang fitur Peminjaman]

Catatan Mentor

Sebelum membuka Week 4, pastikan:

[ ] Fitur CRUD Category: 100% berfungsi
[ ] Fitur CRUD Asset: 100% berfungsi + relasi kategori tampil
[ ] Semua kode di main branch, tidak ada yang masih di branch feature
[ ] Migration tabel loans belum ada — akan dibuat di Day 16

Week 1: Basic Laravel & MVC

Week 2: Database, CRUD & Git

Week 3: CRUD Category & Asset

Week 4: Peminjaman & Presentasi Akhir

Day 15 — UI Polish, Code Review & Git Sync

🎯 Tujuan Hari Ini

📋 Task Wajib

1. Code Review Silang (09:00 – 10:30)

2. Buat Layout Master yang Lebih Rapi

3. Tambahkan Halaman Dashboard Sederhana

4. Git: Merge Semua Branch ke Main

5. Demo Internal (Akhir Hari, 30 Menit)

📝 Laporan ke Mentor (Laporan Akhir Minggu 3)

Day 15 — UI Polish, Code Review & Git Sync ​

🎯 Tujuan Hari Ini ​

📋 Task Wajib ​

1. Code Review Silang (09:00 – 10:30) ​

2. Buat Layout Master yang Lebih Rapi ​

3. Tambahkan Halaman Dashboard Sederhana ​

4. Git: Merge Semua Branch ke Main ​

5. Demo Internal (Akhir Hari, 30 Menit) ​

📝 Laporan ke Mentor (Laporan Akhir Minggu 3) ​

Day 15 — UI Polish, Code Review & Git Sync

🎯 Tujuan Hari Ini

📋 Task Wajib

1. Code Review Silang (09:00 – 10:30)

2. Buat Layout Master yang Lebih Rapi

3. Tambahkan Halaman Dashboard Sederhana

4. Git: Merge Semua Branch ke Main

5. Demo Internal (Akhir Hari, 30 Menit)

📝 Laporan ke Mentor (Laporan Akhir Minggu 3)