Setup Laravel dan Helper Functions
Di lesson ini, kita akan menyiapkan "meja kerja" - menginstall Laravel dan membuat fungsi-fungsi pembantu yang akan dipakai di seluruh project.
Apa yang akan dibuat di lesson ini?
1. Install Laravel Framework
2. Konfigurasi koneksi Database
3. Membuat Helper Functions (format Rupiah, format Tanggal Indonesia, generator kode transaksi)
1. Install Laravel Framework
2. Konfigurasi koneksi Database
3. Membuat Helper Functions (format Rupiah, format Tanggal Indonesia, generator kode transaksi)
PASTIKAN SUDAH TERINSTALL:
Sebelum mulai, komputer Anda harus sudah punya software berikut:
Jika belum, silakan install dulu sebelum lanjut!
Sebelum mulai, komputer Anda harus sudah punya software berikut:
| XAMPP / Laragon | Berisi PHP 8.1+ dan MySQL Server | apachefriends.org |
| Composer | Package manager untuk PHP (seperti npm untuk Node.js) | getcomposer.org |
| VS Code | Text Editor untuk menulis kode | code.visualstudio.com |
Jika belum, silakan install dulu sebelum lanjut!
Step 1: Buat Project Laravel Baru
Lokasi: Terminal / Command Prompt
Aksi: [JALANKAN COMMAND]
Cara: Buka aplikasi Command Prompt (Windows) atau Terminal (Mac/Linux), lalu ikuti langkah berikut:
Aksi: [JALANKAN COMMAND]
Cara: Buka aplikasi Command Prompt (Windows) atau Terminal (Mac/Linux), lalu ikuti langkah berikut:
Cara Buka Terminal:
Windows: Tekan
Mac: Tekan
VS Code: Tekan
Windows: Tekan
Windows + R, ketik cmd, tekan EnterMac: Tekan
Cmd + Space, ketik Terminal, tekan EnterVS Code: Tekan
Ctrl + ` (backtick) untuk buka terminal di dalam VS Code
Langkah 1: Pindah ke folder htdocs (tempat Laravel diinstall)
# Untuk XAMPP Windows (biasanya di C:\xampp\htdocs)
cd C:\xampp\htdocs
# Untuk Laragon Windows (biasanya di C:\laragon\www)
cd C:\laragon\www
# Untuk Mac (biasanya di /Applications/XAMPP/htdocs)
cd /Applications/XAMPP/htdocs
Langkah 2: Buat project Laravel baru
# Jalankan command ini (tunggu 2-5 menit)
composer create-project laravel/laravel simrs-app
Apa yang terjadi?
Composer akan mendownload Laravel dan semua dependensi-nya (sekitar 50-100 MB).
Tunggu sampai muncul tulisan hijau
Composer akan mendownload Laravel dan semua dependensi-nya (sekitar 50-100 MB).
Tunggu sampai muncul tulisan hijau
Application ready! atau sampai proses selesai.
Langkah 3: Masuk ke folder project dan jalankan server
# Masuk ke folder project
cd simrs-app
# Jalankan server development Laravel
php artisan serve
Verifikasi Instalasi:
Buka browser Anda, ketik alamat:
Jika muncul halaman Welcome Laravel dengan logo Laravel, berarti instalasi BERHASIL!
Jangan tutup terminal ini - biarkan server tetap berjalan.
Buka browser Anda, ketik alamat:
http://localhost:8000Jika muncul halaman Welcome Laravel dengan logo Laravel, berarti instalasi BERHASIL!
Jangan tutup terminal ini - biarkan server tetap berjalan.
Step 2: Buat Database MySQL
Lokasi: phpMyAdmin (di browser)
Aksi: [BUAT DATABASE BARU]
Cara: Buka phpMyAdmin di browser, lalu buat database baru
Aksi: [BUAT DATABASE BARU]
Cara: Buka phpMyAdmin di browser, lalu buat database baru
Cara Buka phpMyAdmin:
1. Pastikan XAMPP sudah dijalankan (Apache dan MySQL harus Running)
2. Buka browser, ketik:
3. Akan muncul halaman phpMyAdmin
1. Pastikan XAMPP sudah dijalankan (Apache dan MySQL harus Running)
2. Buka browser, ketik:
http://localhost/phpmyadmin3. Akan muncul halaman phpMyAdmin
Langkah membuat database:
- Di sidebar kiri phpMyAdmin, klik "New" atau "Baru"
- Di kolom "Database name", ketik:
simrs_db - Di dropdown "Collation", pilih:
utf8mb4_unicode_ci - Klik tombol "Create" atau "Buat"
Verifikasi:
Di sidebar kiri akan muncul database baru bernama
Di sidebar kiri akan muncul database baru bernama
simrs_db
Step 3: Konfigurasi File .env
Lokasi File:
Aksi: [UPDATE FILE]
Cara: Buka file
.env (di root folder project)Aksi: [UPDATE FILE]
Cara: Buka file
.env di VS Code, cari bagian database, ubah menjadi seperti di bawah:
Apa itu file .env?
File
- Koneksi database (username, password)
- API keys
- Pengaturan mail server
PENTING: File ini TIDAK boleh di-commit ke Git (sudah otomatis di-ignore)
File
.env adalah file konfigurasi yang berisi "rahasia" aplikasi:- Koneksi database (username, password)
- API keys
- Pengaturan mail server
PENTING: File ini TIDAK boleh di-commit ke Git (sudah otomatis di-ignore)
Cari bagian yang dimulai dengan DB_ dan ubah menjadi:
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=simrs_db
DB_USERNAME=root
DB_PASSWORD=
PERHATIAN - Kesalahan Umum:
1. JANGAN ada spasi setelah tanda sama dengan (=)
2. Password kosong
Jika MySQL Anda tidak ada password, biarkan kosong seperti di atas.
Jika ada password, isi dengan password MySQL Anda.
1. JANGAN ada spasi setelah tanda sama dengan (=)
DB_DATABASE=simrs_db ✅ BENARDB_DATABASE= simrs_db ❌ SALAH (ada spasi)2. Password kosong
Jika MySQL Anda tidak ada password, biarkan kosong seperti di atas.
Jika ada password, isi dengan password MySQL Anda.
Step 4: Test Koneksi Database
Lokasi: Terminal / Command Prompt
Aksi: [JALANKAN COMMAND]
Cara: Buka terminal BARU (jangan tutup yang menjalankan server), jalankan migration:
Aksi: [JALANKAN COMMAND]
Cara: Buka terminal BARU (jangan tutup yang menjalankan server), jalankan migration:
# Pastikan Anda di folder project
cd C:\xampp\htdocs\simrs-app
# Jalankan migration untuk test koneksi
php artisan migrate
Akan muncul pertanyaan:
WARN The database 'simrs_db' does not exist on the 'mysql' connection.
Would you like to create it? (yes/no) [yes]
Ketik yes dan tekan Enter.
Jika Berhasil:
Akan muncul output seperti:
Ini artinya Laravel berhasil konek ke database dan membuat tabel-tabel default.
Akan muncul output seperti:
Migration table created successfully.Running migrations.2024_xx_xx_000000_create_users_table ............. DONEIni artinya Laravel berhasil konek ke database dan membuat tabel-tabel default.
Jika Error:
Error: "SQLSTATE[HY000] [2002] No connection"
Solusi: Pastikan MySQL di XAMPP sudah Running (klik Start di XAMPP Control Panel)
Error: "Access denied for user 'root'@'localhost'"
Solusi: Cek password MySQL Anda di file .env
Error: "SQLSTATE[HY000] [2002] No connection"
Solusi: Pastikan MySQL di XAMPP sudah Running (klik Start di XAMPP Control Panel)
Error: "Access denied for user 'root'@'localhost'"
Solusi: Cek password MySQL Anda di file .env
Step 5: Buat Folder dan File Helper
Lokasi File:
Aksi: [BUAT FILE BARU]
Cara:
app/Helpers/AppHelper.phpAksi: [BUAT FILE BARU]
Cara:
- Buka folder project di VS Code
- Di folder
app, klik kanan → New Folder → beri namaHelpers - Di folder
Helpers, klik kanan → New File → beri namaAppHelper.php - Copy SEMUA kode di bawah ini ke dalam file tersebut:
Apa itu Helper?
Helper adalah fungsi-fungsi "pembantu" yang bisa dipanggil dari mana saja di aplikasi.
Contoh: Daripada menulis
Helper adalah fungsi-fungsi "pembantu" yang bisa dipanggil dari mana saja di aplikasi.
Contoh: Daripada menulis
number_format($harga, 0, ',', '.') setiap kali format Rupiah, kita buat fungsi format_rupiah($harga) yang lebih pendek dan mudah diingat.
<?php
// =============================================
// File: app/Helpers/AppHelper.php
// Fungsi: Helper functions untuk format data
// =============================================
/**
* Format angka ke Rupiah Indonesia
*
* Contoh penggunaan:
* format_rupiah(150000) --> "Rp 150.000"
* format_rupiah(1500000) --> "Rp 1.500.000"
*/
if (!function_exists('format_rupiah')) {
function format_rupiah($angka)
{
if ($angka === null) {
return "Rp 0";
}
return "Rp " . number_format($angka, 0, ',', '.');
}
}
/**
* Format tanggal ke format Indonesia
*
* Contoh penggunaan:
* format_date_indo('2023-10-20') --> "20 Oktober 2023"
* format_date_indo(now()) --> "6 Desember 2024"
*/
if (!function_exists('format_date_indo')) {
function format_date_indo($date)
{
if ($date === null) {
return "-";
}
return \Carbon\Carbon::parse($date)->locale('id')->isoFormat('D MMMM Y');
}
}
/**
* Format datetime ke format Indonesia dengan jam
*
* Contoh penggunaan:
* format_datetime_indo('2023-10-20 14:30:00') --> "20 Oktober 2023, 14:30"
*/
if (!function_exists('format_datetime_indo')) {
function format_datetime_indo($datetime)
{
if ($datetime === null) {
return "-";
}
return \Carbon\Carbon::parse($datetime)->locale('id')->isoFormat('D MMMM Y, HH:mm');
}
}
/**
* Generate kode transaksi unik
*
* Contoh penggunaan:
* generate_kode('INV') --> "INV-20231020-5678"
* generate_kode('REG') --> "REG-20231020-1234"
*/
if (!function_exists('generate_kode')) {
function generate_kode($prefix = 'TRX')
{
return $prefix . '-' . date('Ymd') . '-' . rand(1000, 9999);
}
}
/**
* Hitung umur dari tanggal lahir
*
* Contoh penggunaan:
* hitung_umur('1990-05-15') --> "33 tahun"
*/
if (!function_exists('hitung_umur')) {
function hitung_umur($tanggal_lahir)
{
if ($tanggal_lahir === null) {
return "-";
}
return \Carbon\Carbon::parse($tanggal_lahir)->age . ' tahun';
}
}
Step 6: Daftarkan Helper di Composer
Lokasi File:
Aksi: [UPDATE FILE]
Cara: Buka file
composer.json (di root folder project)Aksi: [UPDATE FILE]
Cara: Buka file
composer.json, cari bagian "autoload", tambahkan baris "files":
Cari bagian ini di composer.json:
"autoload": {
"psr-4": {
"App\\": "app/",
"Database\\Factories\\": "database/factories/",
"Database\\Seeders\\": "database/seeders/"
}
},
Ubah menjadi (tambahkan bagian files):
"autoload": {
"psr-4": {
"App\\": "app/",
"Database\\Factories\\": "database/factories/",
"Database\\Seeders\\": "database/seeders/"
},
"files": [
"app/Helpers/AppHelper.php"
]
},
PERHATIAN:
1. Jangan lupa tambahkan koma (,) setelah kurung kurawal
2. Pastikan path-nya benar:
1. Jangan lupa tambahkan koma (,) setelah kurung kurawal
} di bagian "psr-4"2. Pastikan path-nya benar:
app/Helpers/AppHelper.php
Step 7: Update Autoload Composer
Lokasi: Terminal / Command Prompt
Aksi: [JALANKAN COMMAND]
Cara: Jalankan command ini agar Composer mendaftarkan file Helper:
Aksi: [JALANKAN COMMAND]
Cara: Jalankan command ini agar Composer mendaftarkan file Helper:
# Regenerate autoload files
composer dump-autoload
Jika Berhasil:
Akan muncul output:
Akan muncul output:
Generating optimized autoload filesGenerated optimized autoload files containing X classes
Full Source Code
Files yang Dibuat/Dimodifikasi (3 files):
| 1 | .env |
[UPDATE FILE] | Step 3 |
| 2 | app/Helpers/AppHelper.php |
[BUAT FILE BARU] | Step 5 |
| 3 | composer.json |
[UPDATE FILE] | Step 6 |
Checkpoint - Test Manual
Langkah Testing:
1. Test Server Laravel:
- Buka browser:
- Harus muncul halaman Welcome Laravel
2. Test Koneksi Database:
- Buka phpMyAdmin:
- Klik database
- Harus ada tabel-tabel bawaan Laravel (users, password_reset_tokens, dll)
3. Test Helper Functions:
Buka terminal baru di folder project, jalankan:
Lalu ketik satu per satu:
Ketik
1. Test Server Laravel:
- Buka browser:
http://localhost:8000- Harus muncul halaman Welcome Laravel
2. Test Koneksi Database:
- Buka phpMyAdmin:
http://localhost/phpmyadmin- Klik database
simrs_db- Harus ada tabel-tabel bawaan Laravel (users, password_reset_tokens, dll)
3. Test Helper Functions:
Buka terminal baru di folder project, jalankan:
php artisan tinkerLalu ketik satu per satu:
format_rupiah(150000) → Harus return "Rp 150.000"format_date_indo('2023-10-20') → Harus return "20 Oktober 2023"generate_kode('INV') → Harus return seperti "INV-20241206-1234"Ketik
exit untuk keluar dari tinker.
Troubleshooting Error Umum:
Error: "format_rupiah not found"
Solusi: Jalankan
Error: "composer.json is not valid"
Solusi: Cek format JSON (koma dan kurung kurawal harus benar). Gunakan online JSON validator.
Error: Server tidak jalan (Artisan serve)
Solusi: Pastikan tidak ada aplikasi lain yang pakai port 8000. Coba:
Error: "format_rupiah not found"
Solusi: Jalankan
composer dump-autoload lagiError: "composer.json is not valid"
Solusi: Cek format JSON (koma dan kurung kurawal harus benar). Gunakan online JSON validator.
Error: Server tidak jalan (Artisan serve)
Solusi: Pastikan tidak ada aplikasi lain yang pakai port 8000. Coba:
php artisan serve --port=8080
Ringkasan
Yang Sudah Dibuat:
1. Project Laravel:
- Instalasi Laravel menggunakan Composer
- Server development di http://localhost:8000
2. Database:
- Database MySQL
- Konfigurasi koneksi di file
3. Helper Functions:
1. Project Laravel:
- Instalasi Laravel menggunakan Composer
- Server development di http://localhost:8000
2. Database:
- Database MySQL
simrs_db- Konfigurasi koneksi di file
.env3. Helper Functions:
format_rupiah(150000) |
→ Rp 150.000 |
format_date_indo('2023-10-20') |
→ 20 Oktober 2023 |
format_datetime_indo($datetime) |
→ 20 Oktober 2023, 14:30 |
generate_kode('INV') |
→ INV-20231020-5678 |
hitung_umur('1990-05-15') |
→ 33 tahun |
Lesson Berikutnya:
Di Lesson 3: Struktur Folder Project, kita akan mempelajari:
- Organisasi folder di Laravel
- Best practice penamaan file
- Di mana harus menaruh kode apa
Di Lesson 3: Struktur Folder Project, kita akan mempelajari:
- Organisasi folder di Laravel
- Best practice penamaan file
- Di mana harus menaruh kode apa