LATIHAN PRAKTIKUM PEMROGRAMAN WEB

BAB : FRAMEWORK LARAVEL(1)

NAMA : MUHAMMAD KAFIN ABELSYAH
NIM : 225150400111045

ASISTEN : 1. ALKA ALVIN FAUZI

2. DAIYAN UTHSA RAFIF
TGL PRAKTIKUM: 25 APRIL 2024

LATIHAN 1 - Instalasi Composer

A. Soal

1. Instalasi framework Laravel dapat dilakukan menggunakan Composer, sebuah

dependency manager untuk PHP. Download dan lakukan instalasi Composer melalui
alamat https://getcomposer.org/Composer-Setup.exe.
2. Browse dan pilih file “php.exe” yang ada pada direktori instalasi XAMPP. Centang
pilihan “Add this PHP to your path?”. Klik “Next”.
3. Kosongi pilihan “Use a proxy...” Klik “Next”
4. Klik “Install”.
5. Tunggu hingga proses instalasi selesai

B. Screenshoot

Memilih directory instalasi (berisi php.exe)

 Url proxy dikosongkan

Konfirmasi setup instalasi

C. Penjelasan
 Untuk menginstal framework Laravel menggunakan Composer, pertama-tama unduh dan
instal Composer. Setelah selesai, jalankan file instalasi tersebut dan pada langkah
konfigurasi, browse dan pilih file “php.exe” yang terdapat dalam direktori instalasi
XAMPP. Pada opsi “Use a proxy...”, biarkan kosong dan lanjutkan dengan mengklik
“Next” lagi. Setelah itu, klik “Install” dan tunggu hingga proses instalasi selesai.

LATIHAN 2 - Instalasi Laravel

A. Soal

1. Setelah Composer berhasil di-install, instalasi Laravel dapat dilakukan sekaligus

dengan pembuatan project Laravel menggunakan Composer. Pertama-tama, pastikan
bahwa Composer dapat diakses pada command prompt atau console menggunakan
perintah “composer” hingga menghasilkan tampilan seperti berikut.
2. Arahkan direktori aktif pada command prompt atau console ke direktori “htdocs”
pada direktori instalasi XAMPP. Lalu, jalankan perintah:

composer create-project laravel/laravel laravel-app

Perintah di atas akan mengunduh Laravel sekaligus membuat project Laravel dengan
nama “laravel-app”. Tunggu hingga proses download selesai. Setelah selesai, akan
ada direktori baru, yaitu “laravel-app”, sesuai dengan nama project yang diberikan.

3. Jalankan perintah berikut menggunakan command prompt atau console dengan hak
akses administrator:

echo 127.0.0.1 laravel-app.test >> C:\Windows\System32\drivers\etc\hosts

Jelaskan apa yang terjadi setelah perintah di atas dieksekusi dan mengapa perintah
tersebut dijalankan.

4. Buka file “\apache\conf\extra\httpd-vhosts.conf”. Tambahkan baris berikut pada akhir

file tersebut:

<VirtualHost laravel-app.test:80>
DocumentRoot "<direktori XAMPP>/htdocs/laravel-app/public"
</VirtualHost>
Sesuaikan “direktori” dengan lokasi instalasi XAMPP pada komputer masing-masing.
Jelaskan apa yang terjadi setelah penambahan kode di atas dan mengapa kode
tersebut dibuat.

5. Buka alamat “laravel-app.test” pada browser. Tampilan seperti berikut akan muncul.
Ini menandakan bahwa Laravel telah berhasil di-install.
B. Screenshoot

Langkah 1: Tampilan “composer” pada console command prompt

Langkah 2: Mengarahkan directory ke folder htdocs dan mengunduh laravel kedalamnya

Langkah 3: Menjalankan command di console command prompt

Langkah 4: Menambahkan kode ke file hhtpd-vhosts.conf

Langkah 5: Landing page laravel-app.test di web browser

 C. Syntax

D. Penjelasan
3. Setelah perintah di atas dijalankan dengan hak akses administrator, sebuah baris baru
akan ditambahkan ke file `hosts` di direktori `C:\Windows\System32\drivers\etc\`. Baris
tersebut mengaitkan alamat IP lokal `127.0.0.1` dengan nama domain `laravel-app.test`.
Ini berarti ketika mencoba mengakses `laravel-app.test` di browser, sistem operasi akan
mengarahkan permintaan tersebut ke server lokal yang berjalan di alamat IP `127.0.0.1`
(localhost). Perintah ini digunakan untuk mengkonfigurasi nama domain lokal agar dapat
mengakses proyek secara lebih mudah.

4. Ketika membuka "laravel-app.test" di browser, permintaan akan diarahkan ke server

lokal (localhost). Server ini akan mencari folder proyek Laravel di dalam direktori
"htdocs" pada XAMPP, tepatnya di dalam folder "laravel-app/public". Hal ini dilakukan
karena direktori root proyek Laravel perlu disetel ke folder "public" demi alasan
keamanan dan pengelolaan yang lebih baik.

Konfigurasi ini digunakan untuk mengatur VirtualHost, memungkinkan penggunaan

domain kustom (seperti "laravel-app.test") untuk mengakses proyek Laravel secara lokal.
Dengan cara ini, Anda dapat mengakses proyek Laravel menggunakan nama domain yang
lebih mudah diingat daripada menggunakan alamat IP lokal atau jalur direktori.

LATIHAN 3 - Artisan
A. Soal
1. Buka command prompt atau console dengan direktori aktif pada direktori project
(\htdocs\laravel-app). Sesuaikan “” dengan direktori XAMPP pada komputer masing-
masing. Pastikan juga bahwa file “php.exe” telah berada path sehingga perintah
“php” dapat diakses di mana saja.
 2. Jalankan perintah berikut untuk memastikan bahwa akses ke Artisan dapat dilakukan.

php artisan

B. Screenshot

Mengarahkan direktori ke folder laravel-app dan melakukan instalasi artisan

C. Syntax

D. Penjelasan

Untuk menginstal Artisan, langkah awalnya adalah mengarahkan direktori konsol ke folder
aplikasi Laravel yang ingin dipakai. Selanjutnya, jalankan perintah "php artisan". Dengan
melakukan ini, Artisan akan diinstal di dalam folder tersebut.

LATIHAN 4 - Controller
A. Soal
1. Jalankan perintah berikut untuk membuat controller baru dengan nama
GreetController.

php artisan make:controller GreetController

 2. Edit kode tersebut (app/Http/Controllers/GreetController.php) sehingga menjadi
seperti berikut.

3. Jelaskan yang dilakukan oleh fungsi greet() pada GreetController.

B. Screenshot

Langkah 1: Membuat controller baru

Langkah 2: Mengubah kode dalam file controller

 C. Penjelasan

3. GreetController adalah controller baru dalam kerangka kerja MVC. Controller ini memiliki
fungsi "greet" yang menerima parameter "nama". Fungsi tersebut bertujuan untuk
menghasilkan tampilan view, dengan parameter 'greet' menunjukkan nama file view yang
akan dipanggil, dan variabel 'nama' dari parameter digunakan sebagai nilai yang akan
ditampilkan di dalam view tersebut.

LATIHAN 5 - View dengan Blade

A. Soal
1. Buat file baru “resources/views/greet.blade.php” dengan isi kode berikut

<h1>Hello, {{ $name }}!</h1>

B. Screenshot

Membuat view baru dan memasukkan kode

C. Penjelasan
 Isi dari file greet.blade adalah untuk menampilkan pesan "Hello" bersama dengan nilai
variabel nama yang disediakan oleh file controller.

Routing

LATIHAN 6
D. Soal
1. Buka file “routes/web.php”. Tambahkan kode berikut.

// ...
use App\Http\Controllers\GreetController;
// ...
Route::get('/hello/{name}', [GreetController::class, 'greet']);

2. Buka URL “http://laravel-app.test/hello/FILKOM” di browser dan amati output yang

dihasilkan.\
3. Jelaskan yang dilakukan oleh fungsi greet() pada GreetController
4. Jelaskan kode yang ditulis pada file “greet.blade.php
5. Jelaskan kode yang ditulis pada file “routes/web.php”

E. Screenshot

Langkah 1: Mengubah isi file router

Langkah 2: Tampilan laravel-app.test di web browser

 F. Penjelasan

3. Fungsi greet() pada GreetController menangani permintaan HTTP yang masuk melalui rute
yang didefinisikan dalam aplikasi Laravel. Ketika rute '/hello/{name}' diakses, dengan
'{name}' sebagai parameter, fungsi greet() akan dijalankan. Fungsi ini mengembalikan
tampilan (view) yang telah ditetapkan sebelumnya, dengan nama file view yang diberikan
dalam parameter 'greet' dari rute. Selain itu, variabel 'nama' yang diterima dari parameter akan
digunakan untuk menampilkan nilai yang sesuai dalam tampilan tersebut. Dengan demikian,
setiap kali rute '/hello/{name}' diakses, pesan sambutan yang disesuaikan dengan nama yang
diberikan akan ditampilkan.

4. Isi dari file greet.blade adalah untuk menampilkan pesan "Hello" bersama dengan nilai
variabel nama yang disediakan oleh file controller.

5. Di dalam file router terdapat sebuah fungsi yang menerima dua parameter. Parameter
pertama adalah potongan URL yang akan ditampilkan di peramban web, sedangkan parameter
kedua akan mengarahkan ke file controller yang akan mengeksekusi program untuk
menampilkan sebuah pesan.

LATIHAN 7 - Blade Template

G. Soal
1. Tambahkan baris berikut pada file “routes/web.php”

Route::view('/hello', 'greet');

2. Ubah file “greet.blade.php” menjadi seperti berikut.

@isset($name):
<h1>Hello, {{ $name }}!</h1>
@else:
<h1>Hello, Guest!</h1>
@endisset;
 3. Buka URL “http://laravel-app.test/hello” di browser. Jelaskan perubahan yang dibuat
pada dua file di atas. Bandingkan dengan URL
“http://laravel-app.test/hello/FILKOM” yang diakses sebelumnya.

H. Screenshot

Langkah 1: Mengubah kode file router

Langkah 2: Mengubah kode file view

 Langkah 3: Tampilan laravel-app.test di web browser

I. Penjelasan

Di dalam file router, telah ditambahkan rute baru yang bertujuan untuk menangani segmen
URL secara langsung. Metode ini berbeda karena langsung memanggil view tanpa melibatkan
controller terlebih dahulu. Selain itu, konten view telah diubah agar sesuai dengan URL yang
diberikan; jika tidak ada variabel nama dalam URL, maka akan ditampilkan pesan yang
berbeda.