Pendahuluan
Salah satu fitur yang disediakan oleh laravel adalah fitur public. Public merupakan salah satu direktori pada laravel yang memiliki peran yang sangat penting dan spesifik. Berikut adalah fungsi dan kegunaan utama dari directory ini:
1. Titik Masuk Aplikasi:
Direktori public berfungsi sebagai titik masuk (entry point) untuk semua permintaan yang masuk ke aplikasi Laravel Anda. File index.php yang berada di dalam direktori ini adalah file pertama yang dieksekusi ketika pengguna mengakses aplikasi Anda melalui browser.
2. Aset Publik:
Direktori ini digunakan untuk menyimpan semua aset publik yang dapat diakses langsung oleh browser. Ini termasuk:
- File CSS (Cascading Style Sheets)
- File JavaScript
- Gambar (images)
- File-file lain yang dibutuhkan oleh tampilan aplikasi
Aset-aset yang disimpan di dalam direktori public dapat diakses langsung oleh browser tanpa melalui pemrosesan oleh Laravel. Ini sangat penting untuk performa aplikasi, karena browser dapat mengambil aset-aset ini dengan cepat.
Laravel menyediakan fitur-fitur untuk mengelola aset publik, seperti Laravel Mix, yang memungkinkan Anda untuk menggabungkan, meminimalkan, dan mengelola aset-aset Anda dengan mudah.
Dengan menempatkan aset-aset publik di dalam direktori public, Anda memisahkan mereka dari kode aplikasi inti. Ini meningkatkan keamanan aplikasi, karena kode aplikasi tidak dapat diakses langsung oleh browser.
Menyimpan File CSS
Perhatikan pada file beranda yang telah kita buat sebelumnya. Terdapat script css yang kita satukan dengan file html. Sekarang kita akan memisahkan file css dengan file html. File css ini akan kita simpan di dalam directory public.
Jadi silahkan buat folder baru dan beri nama Assets di dalama Public. Dalam folder assets tersebut buatlah folder baru dengan nama css. Baru dalam folder css tadi kita buat file baru dengan nama style.css. Perhatikan struktur foldernya:
📂 Public
📂 Assets
📂 Css
🗎 style.css
Sekarang buka kembali file beranda.blade.php. Copy semua code yang ada di antray tag <style> ke dalam file style.css. Berikut codenya:
body {font-family: sans-serif;margin: 0;padding: 0;display: flex;flex-direction: column;min-height: 100vh;}.header {background-color: rgb(112, 14, 14);padding: 20px;text-align: center;color: white;}.main {padding: 20px;flex-grow: 1;}.footer {background-color: rgb(0, 0, 0);padding: 10px;text-align: center;color: white;}/* Navbar */.navbar {background-color: #333;overflow: hidden;}.navbar {background-color: #333;text-align: center;}.navbar a {color: white;text-decoration: none;padding: 14px 16px;display: inline-block;}.navbar a:hover {background-color: #ddd;color: black;}
Selanjutnya buatlah link di beranda.blade.php untuk memanggil Css tadi. Berikut bentuk penulisan linknya:
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Belajar Laravel</title><link rel="stylesheet" href="/assets/css/style.css">// Tambahkan script ini</head>
Lakukan hal yang sama untuk halaman profil.
Sekarang jalankan projek anda. Jika langkah benar seharusnya tidak terjadi kesalahan.
Mengakses File Gambar
Sekarang mari kita coba untuk mengakses file gambar. Pertama-tama siapkan sebuah gambar, lalu buatlah sebuah folder baru di dalam folder assets. Beri nama folder tersebut dengan nama images. Tambahkan sebuah gambar ke dalam folder images. Contoh disini kita menambahkan gambar dengan nama barintek.png. Berikut bentuk susunannya:
📂 Public
📂 Assets
📂 Css
📂 images
🖼 barintek.png
Sekarang saatnya kita akses gambar tadi di dalam halamn view. Buka file beranda.blade.php. Panggil gambarnya. Berikut penulisan scriptnya:
<h2>Beranda</h2>
<div class="baner">
<img src="/assets/images/barintek.png" alt="">
</div>
Sekarang coba jalankan aplikasi anda. Mestinya gambar sudah muncul.