LAPORAN PRAKTIKUM

PEMROGRAMAN WEB

Laporan ini disusun untuk memenuhi salah satu tugas

Mata Kuliah Praktikum Pemrograman Web

Semester 5 Tahun Akademik 2019/2020

Oleh :

Nama : Fadilah Salsabila

NPM : 177006006

Kelompok : 3

JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK UNIVERSITAS SILIWANGI

TASIKMALAYA

2019

VII-1
 | VII-2

MODUL VII
BASIC ROUTING, VIEW &
CONTROLLER PADA LARAVEL

7.1 Tujuan Praktikum

a. Memahami konsep dasar routing pada Laravel.
b. Mampu melakukan basic routing pada Laravel.
c. Mampu melakukan basic controller dan view pada Laravel.

7.2 Dasar Teori

Routing merupakan salah satu fitur yang ada pada framework
Laravel, jadi setiap URL yang akan diakses wajib didaftarkan pada
Routing. Karena jika tidak akan menimbulkan error. Dalam routing akan
mengenal yaitu GET dan POST, GET disini digunakan untuk
menampilkan, parsing atau mengirimkan data. Sedangkan POST
digunakan untuk menangani sebuah form untuk menerima hasil inputan
data.
Laravel yang sudah terinstall di PC adalah versi terbaru dan versi
ini cukup berbeda dengan versi terdahulunya. Jika pada versi sebelumnya
pengendali routing ada pada file app/Http/routes.php namun berbeda
dengan versi terbaru, routing berada di routes\web.php.
GET
GET dalam Laravel digunakan untuk menampilkan view maupun
data Buka Project yang telah diinstall.
BASIC ROUTE
Jika sudah menemukan file routes\web.php sekarang kita coba dan
buka aplikasi text editor seperti notepad++, visual strudio code, sublime
dll.

File name : web.php

 | VII-3

<?php
/*
|-----------------------------------------------------
---------------------
| Web Routes
|-----------------------------------------------------
---------------------
|
| Here is where you can register web routes for your a
pplication. These
| routes are loaded by the RouteServiceProvider within 
a group which
| contains the "web" middleware group. Now create some
thing great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

Pada gambar di atas merupakan tampilan isi dari web.php dan

tempat kita menuliskan source code agar bisa menampilkan sesuatu yang
diinputkanpada homepage Laravel adalah tepat pada bagian return view
yang ada. Sekarang kita coba jika kata welcome disana diganti dengan
kata lain, lihat apa yang terjadi pada homepage Laravel.
Input

File name : web.php

<?php
/*
|-----------------------------------------------------
---------------------
| Web Routes
|-----------------------------------------------------
---------------------
|
| Here is where you can register web routes for your a
pplication. These
| routes are loaded by the RouteServiceProvider within 
a group which
| contains the "web" middleware group. Now create some
 | VII-4

thing great!
|
*/

Route::get('/', function () {
    return 'Hello Fadilah Salsa';
});

Output

Gambar 7.1. Program 1

Analisis
Pada contoh diatas dapat dieksekusi dan menampilkan tulisan yang
kita inputkan di dalam source code yaitu Hello Fadilah Salsa, artinya cara
penulisan pada contoh ini adalah benar. Jadi untuk menuliskan argument
exception tidak perlu menambahkan tulisan view dan dalam kurung
seperti contoh pertama, untuk kata yang ingin ditampilkan cukup diapit
oleh tanda petik saja.
Route::get merupakan method yang sudah ditetapkan oleh Laravel
sebagai method get. Tanda “/” menunjukkan route yang didefinisikan atau
dibuat untuk route utama atau halaman utama.

ROUTE PARAMETERS
Fungsi route parameters ini adalah mengirimkan sebuah nilai atau
parameter ke route atau ke controller. Di route parameters kita dibagi
menjadi beberapa bagian :
1. Basic Route Parameters (Dasar Route Berparameter).
2. Route Parameters (Route Berparameter Lebih dari Satu).
3. Optional Route Parameters (Opsional Route Parameter).
 | VII-5

4. Optional Route Parameters with Defaults (Opsional Route Parameter

dengan Nilai Default).
Basic Route Parameters (Dasar Route Berparameter)
Tambahkan code berikut ke file routes/web.php
Input

File name : web.php

<?php
Route::get('/profile/{name}', function ($name) {
    return 'Profile <br> My Name : ' . $name; 
});

Output

Gambar 7.2. Program 2

Analisis
Perintah diatas digunakan untuk menampilkan Profile yang berisi
nama Fadilah Salsa. Untuk menjalankan perintah tersebut yaitu dengan
cara mengetikkan url sebagai berikut http://127.0.0.1:8000/profile/Fadilah
Salsa. Perintah Route::get merupakan method yang sudah ditetapkan oleh
Laravel sebagai method get yang berfungsi untuk menampilkan data.
Tanda “/” menunjukkan route yang didefinisikan atau dibuat untuk route
utama atau halaman utama, profile/{nama} digunakan untuk definisi /
penamaan route / urlnya sedangkan untuk {nama} adalah variable yang
dikirimkan atau parameternya, function($nama) digunakan untuk
menangkap parameter, return'Profile Nama : '.$nama; digunakan untuk
Menampilkan kalimat Profile Nama : Sesuai Parameter.
 | VII-6

Route Parameters (Route Berparameter Lebih dari Satu)

Untuk mengirim parameter lebih dari satu dari contoh dasar route
berparameter kita hanya perlu menambahkan /{parameter-baru}.
Untuk lebih jelasnya lihat contoh dibawah ini dan bandingkan
dengan contoh sebelumnya. Tambahkan code berikut ini ke
routes/web.php
Input

File name : web.php

<?php
Route::get('/profile/{name}/{matakuliah}', function 
($name,$matkul) {
    return 'Profile <br> My Name : ' . $name . '<br>' 
. $matkul . ' : 90'; 
});

Output

Gambar 7.3. Program 3

Analisis
Perintah diatas untuk menampilkan Profile yang berisi nama dan
nilai mata kuliah. Untuk menjalankan perintah tersebut yaitu dengan cara
mengetikkan url sebagai berikut http://127.0.0.1:8000/profile/Fadilah
Salsa/P.Web. Perintah Route::get merupakan method yang sudah
ditetapkan oleh Laravel sebagai method get yang berfungsi untuk
menampilkan data. Tanda “/” menunjukkan route yang didefinisikan atau
 | VII-7

dibuat untuk route utama atau halaman utama,

profile/{name}/{matakuliah} digunakan untuk definisi / penamaan route /
urlnya, sedangkan untuk {name} adalah variable yang dikirimkan atau
parameternya. {matakuliah} adalah parameter kedua. function($name,
$matkul) , digunakan untuk menangkap parameter, return 'Profile <br> My
Name : ' .$name.' <br>' .$matkul . ‘ : 90’; digunakan untuk menampilkan
kalimat Profile My Name : Fadilah Salsa (Parameter Pertama) P. Web
(Parameter Kedua) : 90.

Optional Route Parameters (Opsional Route Parameter)

Opsional Route Parameter adalah sebuah pilihan jika parameter
tidak dicantumkan maka akan diganti dengan null dengan demikian
program akan tetap jalan. Contohnya, silahkan pada bagian sebelumnya
dihilangkan parameternya, apa yang terjadi?, program akan error.

Gambar 7.4. Program 4

Sekarang mari kita lihat contoh dari opsional route parameter ini.
Input

File name : web.php

<?php
Route::get('/profile/{name?}', function ($name=null) {
    return 'Profile <br> My Name : ' . $name; 
});
 | VII-8

Output

Gambar 7.5. Program 5

Analisis
Perintah diatas untuk menampilkan Profile yang berisi nama.
Perintah Route::get merupakan method yang sudah ditetapkan oleh
Laravel sebagai method get yang berfungsi untuk menampilkan data.
Tanda “/” menunjukkan route yang didefinisikan atau dibuat untuk route
utama atau halaman utama, profile/{nama?} digunakan untuk define /
penamaan route / urlnya, {nama?} artinya jika parameter tidak ditemukan
akan diganti null dengan code berikut $nama = null. return $nama; ,
mengembalikan nilai parameternya.
Pada gambar pertama saya menjalankan dengan perintah url sebagai
berikut : http://127.0.0.1:8000/profile, maka yang muncul hanyalah
“Profile My Name : “ saja karena tidak adanya parameter sehingga diganti
menjadi null atau kosong.
Pada gambar kedua saya menjalankan dengan perintah url sebgai
berikut : http://127.0.0.1:8000/profile/Fadilah, maka menghasilkan
“Profile My Name : Fadilah”.

Optional Route Parameters With Defaults

 | VII-9

Opsional Route Parameter dengan Nilai Default ini hampir sama

dengan Opsional Route Parameter hanya perbedaannya yaitu kita bisa
memberikan nilai default pada suatu parameter jika parameternya tidak
ditemukan,
contohnya :

Input

File name : web.php

<?php
Route::get('/profile/{name?}', function 
($name='Fadilah Salsa') {
    return 'Profile <br> My Name : ' . $name; 
});

Output

Gambar 7.6. Program 6

Analisis
Perintah diatas untuk menampilkan Profile yang berisi nama.
Perintah Route::get merupakan method yang sudah ditetapkan oleh
Laravel sebagai method get yang berfungsi untuk menampilkan data.
Tanda “/” menunjukkan route yang didefinisikan atau dibuat untuk route
utama atau halaman utama, profile/{nama?} digunakan untuk define /
 | VII-10

penamaan route / urlnya, {nama?} artinya jika parameter tidak ditemukan

akan diganti dengan Fadilah Salsa dengan code berikut $nama = Fadilah
Salsa. return $nama; , mengembalikan nilai parameternya.
Pada gambar pertama saya menjalankan dengan perintah url sebagai
berikut : http://127.0.0.1:8000/profile, maka yang muncul yaitu “Profile
My Name : Fadilah Salsa“ karena tidak adanya parameter sehingga diganti
menjadi Fadilah Salsa. Sedangkan pada gambar kedua saya menjalankan
dengan perintah url sebgai berikut : http://127.0.0.1:8000/profile/Salsabila,
maka menghasilkan “Profile My Name : Salsabila”.

Controller dan View Pada Laravel

Sama seperti controller pada framework PHP, karena sama-sama
menerapkan konsep MVC dalam pengembangan dan penggunaan
framework PHP nya.
Controller merupakan jembatan atau penghubung antara view dan
model. Jadi secara mudah nya, controller bisa kita pahami sebagai
pengatur view dan model. Controller sendiri biasanya berperan sebagai
pengolah data. Mungkin pada beberapa kasus kita memerlukan penerapan
logika atau pengo;ah data, maka controller lah yang berperan baru
kemudian di tampilkan ke bagian view (user interface) aplikasi atau
project kita. Controller laravel berada di dalam folder
app/Http/Controllers/. Berikut ini adalah gambar dari MVC :
 | VII-11

Ada 2 cara membuat controller pada laravel, yang pertama kita bisa
membuat controller laravel dengan cara membuat langsung file controller
baru nya dalam folder app/Http/Controllers/ dan cara yang kedua kita bisa
menggunakan perintah php artisan dari laravel.

Cara Pertama
Kita mulai dengan cara yang pertama, yaitu membuat controller
laravel dengan membuat langsung file controller barunya dalam folder
controllers. Disini kita akan mengikuti format penulisan di laravel, jadi
kita akan membuat nama controller nya dengan huruf besar (kapital) di
awal nama controllernya.
Misalnya di sini saya akan membuat profile controller, yaitu
dengan cara buat file baru dengan nama ProfileController.php dalam folder
Controllers.
Input

File name : ProfileController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProfileController extends Controller
{
    //
}

Output
 | VII-12

Gambar 7.7. Program 7

Analisis
Perhatikan syntax diatas, pada syntax diatas kita mendeklarasikan
class controller ProfileController, dengan wajib meng-extends Controller
dari laravel. Dan perhatikan penulisan classnya, kita wajib menulisakan
nama file profile controller dengan benar maksudnya penulisan controller
nya harus sama dengan nama file controller yang kita buat.

Cara Kedua
Cara kedua untuk membuat controller pada laravel ialah kita bisa
membuat controller laravel dengan mudah menggunakan php artisan.
Inilah salah satu fitur keren dari laravel, kita bisa membuat dan mengontrol
project kita dengan bantuan php artisan.
Jadi bisa kita ambil kesimpulan bahwa php artisan adalah fitur
unggulan yang ada pada laravel, yang dibuat untuk memudahkan kita
dalam pengembangan menggunakan laravel. Ada banyak sekali yang bisa
kita lakukan dengan php artisan, coba ketik php artisan pada terminal,
maka akan tampil perintah-perintah yang tersedia diphp artisan seperti
pada gambar dibawah ini.
 | VII-13

Gambar 7.8. Program 8

Salah satunya kita bisa membuat controller secara otomatis

menggunakan perintah php artisan. Sekarang kita akan mencoba membuat
controller baru lagi dengan menggunakan perintah php artisan. Kita akan
membuat controller dengan nama ProfileController.php.
Pertama buka dulu terminal atau command prompt (CMD) dan
langsung masuk ke direktori project laravel kita, disini sebelumnya saya
sudah membuat project laravel dalam folder dengan nama Laravel. Setelah
masuk ke direktori project Laravel, kemudian ketik php artisan
make:controller ProfileController seperti pada gambar dibawah ini.
Input

Output
 | VII-14

Gambar 7.9. Program 9

Analisis
Perintah make:controller diatas adalah perintah php artisan untuk
membuat controller. Dan ProfileController adalah nama controller yang
ingin kita buat. Maka controller ProfileController.php akan dibuat secara
otomatis dan hasilnya bisa dilihat seperti pada gambar diatas.

BASIC CONTROLLERS ( DASAR CONTROLLER )

Dasar controller ini adalah bagaimana cara dasar untuk dapat
menjalankan controller tersebut dengan bantuan route. Kita coba untuk
menggunakan Controller pada routes/web.php dengan mengetikkan
perintah sebagai berikut :
Input

File name : web.php

<?php
Route::get('/profile', 'ProfileController@index');

Output
 | VII-15

Gambar 7.10. Program 10

Analisis
Perintah diatas akan menghasilkan error karena pada parameter
‘ProfileController@index’ tidak terpanggil karena belum adanya fungsi
index di ProfileController sehingga terjadi error. Agar tidak terjadi error
maka kita tambahkan function index pada file ProfileController.php seperti
berikut :
Input

File name : web.php

<?php
Route::get('/profile', 'ProfileController@index');
File name : ProfileController.php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProfileController extends Controller
{
    public function index(){
        return 'Ini Halaman Profile';
    }
}

Output
 | VII-16

Gambar 7.11. Program 11

Analisis
Perintah diatas digunakan untuk menampilkan sebuah kalimat “Ini
Halaman Profile” dengan menjalankan perintah url sebagai berikut :
http://127.0.0.1:8000/profile. Perintah Route::get merupakan method yang
sudah ditetapkan oleh Laravel sebagai method get yang berfungsi untuk
menampilkan data. Tanda “/” menunjukkan route yang didefinisikan atau
dibuat untuk route utama atau halaman utama, profile digunakan untuk
define / penamaan route / urlnya, ProfileController adalah nama file
ataupun class controller. index adalah method atau fungsi yang berada di
controller. Return ‘Ini Halaman Profile’ berfungsi untuk menampilkan teks
tersebut.

KOLABORASI ANTARA VIEW DAN CONTROLLER

Setelah membahas cara kerja controller, bagaimana menggabungkan
view dengan controller. View ini berfungsi untuk menampilkan file atau
halaman yang dibuat di controller.
Sekarang kita coba untuk membuat route baru di routes/web.php
seperti dibawah ini dan menambahkan syntax function detail pada
Http/Controllers/ProfileController.php seperti berikut :
Input

File name : web.php

<?php
Route::get('/profile/detail', 'ProfileController@detai
l');
File name : ProfileController.php
<?php
 | VII-17

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProfileController extends Controller
{
    public function detail(){
        $nama = "Fadilah Salsa";
        return view('profile.detail',compact('nama'));
    }
}

Output

Gambar 7.12. Program 12

Analisis
Perintah diatas hasilnya adalah error. Agar tidak terjadi error maka
dibuatlah view di resources/views/profile/detail.blade.php. Semua nama
file views pada laravel berekstensi namafile.blade.php. Berikut isi dari
detail.blade.php :

Input

File name : web.php

<?php
Route::get('/profile/detail', 'ProfileController@detai
l');
File name : ProfileController.php
<?php
 | VII-18

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProfileController extends Controller
{
    public function detail(){
        $nama = "Fadilah Salsabila";
        return view('profile.detail',compact('nama'));
    }
}
File name : detail.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, 
initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" conten
t="ie=edge">
    <title>Profile</title>
</head>
<body>
    <h1>{{$nama}}</h1>
</body>
</html>

Output

Gambar 7.13. Program 13

Analisis
 | VII-19

Perintah diatas digunakan untuk menampilkan sebuah nama “Fadilah

Salsabila” dengan menjalankan perintah url sebagai berikut :
http://127.0.0.1:8000/profile/detail. Perintah Route::get merupakan
method yang sudah ditetapkan oleh Laravel sebagai method get yang
berfungsi untuk menampilkan data. Tanda “/” menunjukkan route yang
didefinisikan atau dibuat untuk route utama atau halaman utama, profile
digunakan untuk define / penamaan route / urlnya, ProfileController adalah
nama file ataupun class controller. detail adalah method atau fungsi yang
berada di controller. Return view('profile.detail',compact('nama'));
berfungsi untuk mengembalikan nilai dari view yaitu variable $nama
dengan nilai Fadilah Salsabila dari function detail.

Sekarang kita coba membuat program baru yang hampir sama

dengan program sebelumnya, hanya terdapat perbedaan yaitu dalam
menampilkan value dari variable $nama tersebut diganti dengan sebuah
parameter {name} seperti berikut :
Input

File name : web.php

<?php
Route::get('/profile/nama/{name}', 'ProfileController@
nama');
File name : ProfileController.php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProfileController extends Controller
{
    public function nama($nama){
        return view('profile.nama', compact('nama'));
    }
}
File name : nama.blade.php
<!DOCTYPE html>
 | VII-20

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, 
initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" conten
t="ie=edge">
    <title>Profile</title>
</head>
<body>
    <h1>{{$nama}}</h1>
</body>
</html>

Output

Gambar 7.14. Program 14

Analisis
Perintah diatas digunakan untuk menampilkan sebuah nama “Fadilah
Salsa” dengan menjalankan perintah url sebagai berikut :
http://127.0.0.1:8000/profile/detail. Perintah Route::get merupakan
method yang sudah ditetapkan oleh Laravel sebagai method get yang
berfungsi untuk menampilkan data. Tanda “/” menunjukkan route yang
didefinisikan atau dibuat untuk route utama atau halaman utama,
sedangkan untuk {name} adalah variable yang dikirimkan atau
parameternya ProfileController adalah nama file ataupun class controller.
nama adalah method atau fungsi yang berada di controller. Return
view('profile.nama',compact('nama')); berfungsi untuk mengembalikan
nilai dari view yaitu variable $nama dengan nilai variable sesuai yang
dikirimkan oleh user.
 | VII-21

7.3 Hasil dan Pembahasan

Input

File name : web.php

<?php
Route::get('/profile/
identitas','ProfileController@identitas');
File name : ProfileController.php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProfileController extends Controller
{
    public function identitas(){
        $data = [
            'NPM' => 177006006,
            'Nama' => 'Fadilah Salsabila',
            'Angkatan' => 2017,
            'Jenis Kelamin' => 'Perempuan'
        ];
        return view('profile.identitas',compact('data'
));
    }
}
File name : identitas.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, 
initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" conten
t="ie=edge">
    <title>Identitas</title>
</head>
<body>
    @foreach($data as $key => $value)
    <p>{{$key}} : {{$value}}</p>
    @endforeach
</body>
</html>
 | VII-22

Output

Gambar 7.15. Program 15

Analisis
Perintah diatas sama seperti sebelumnya digunakan untuk
menampilkan sebuah data yang berisi npm, nama, angkatan dan jenis
kelamin hanya perbedaannya yaitu pada ProfileController berisi data array
sehingga pada bagian view saat mempassing atau mengirimkan data
variable ke view identitas.blade.php harus menggunakan foreach seperti
pada perintah diatas. Untuk menjalankannya yaitu dengan perintah url
sebagai berikut : http://127.0.0.1:8000/profile/identitas. Perintah
Route::get merupakan method yang sudah ditetapkan oleh Laravel
sebagai method get yang berfungsi untuk menampilkan data. Tanda “/”
menunjukkan route yang didefinisikan atau dibuat untuk route utama atau
halaman utama, profile digunakan untuk define / penamaan route / urlnya,
ProfileController adalah nama file ataupun class controller. identitas
adalah method atau fungsi yang berada di controller. Return
view('profile.identitas',compact('data')); berfungsi untuk menampilkan
nilai dari variable $data yang berada di function identitas.