Anda di halaman 1dari 131

SISTEM INFORMASI BERBASIS WEB

TRAVEL MENGGUNAKAN LARAVEL

Disusun oleh :

RYAMIZARD DZULKARNAIN_180411100064

Dosen Pembimbing:

Arif Muntasa,S.Si,M.T.,Dr.Prof,

NIP. 196911182001121004

PROGRAM STUDI TEKNIK INFORMATIKA


FAKULTAS TEKNIK
UNIVERSITAS TRUNOJOYO MADURA
2021

1
LEMBAR KESEPAKATAN

2
LEMBAR PENGESAHAN

3
KATA PENGANTAR
Segala puji bagi Allah yang Maha Pengasih dan Penyayang
yang telah memberikan rahmat dan Hidayah-Nya sehingga
penulis dapat menyelesaikan buku tutorial kerja praktek (KP)
yang berjudul “Sistem Informasi Berbasis Web Travel
menggunakan Framework Laravel” dengan baik tanpa ada
halangan apapun.
Buku tutorial ini dapat terselesaikan berkat kerjasama dan
bantuan dari beberapa pihak. Oleh karena itu penulis
sampaikan terimakasih sebesar-besarnya kepada :
1. Kedua Orang Tua dan Keluarga yang saya cintai,
terimakasih atas dukungan dan do’anya.
2. Bapak Yoga Dwitya Pramudita, S.Kom., M.Kom., selaku
Koordinator Kerja Praktek (KP) di Program Studi Teknik
Informatika Fakultas Teknik Universitas Trunojoyo
Madura.
3. Bapak Arif Muntasa, S.Si,M.T., Dr. Prof. selaku dosen
pembimbing yang senantiasa memberikan arahan,
masukan dan ilmu selama Kerja Praktek.
4. Bapak dan Ibu Dosen Program Studi Teknik Informatika
Fakultas Teknik Universitas Trunojoyo Madura.
5. Teman-teman yang telah memberikan semangat dan
dukungan dalam penyelesaian buku tutorial Kerja
Praktek ini.
6. Pihak-pihak yang tidak sempat penulis sebutkan, yang
telah membantu dalam kelancaraan pengerjaan Kerja
Praktek ini.

4
Disamping itu, penulis menyadari bahwa masih banyak
kekurangan dalam penulisan buku tutorial ini, baik dari segi
bahasa, susunan kalimat maupun isi. Oleh karena itu penulis
mengharapkan segala kritik dan saran yang membangun dari
pembaca.

Bangkalan, 19 Juni 2021

Penulis

5
DAFTAR ISI

LEMBAR KESEPAKATAN .................................................... 2


LEMBAR PENGESAHAN ...................................................... 3
KATA PENGANTAR .............................................................. 4
DAFTAR ISI ............................................................................. 6
DAFTAR GAMBAR ................................................................ 8
BAB 1 ....................................................................................... 9
1.1 Pengertian Framework .................................................. 9
1.2 Sejarah Laravel ............................................................ 10
1.3 Cara Install Laravel ..................................................... 11
BAB 2 ..................................................................................... 16
2.1 Route ........................................................................... 17
2.2 Controller .................................................................... 24
2.3 Collection .................................................................... 30
2.4 Migration ..................................................................... 33
2.5 Blade ........................................................................... 39
2.6 Views........................................................................... 46
2.7 Validation .................................................................... 57
2.8 Eloquent ORM ............................................................ 61
BAB 3 ..................................................................................... 77
3.1 Pengertian Boostrap .................................................... 77
3.2 Sejarah Boostrap ......................................................... 77

6
3.3 Boostrap Grid System ................................................. 78
3.4 Boostrap Content ......................................................... 79
BAB 4 ..................................................................................... 81
4.1 Membuat Database ...................................................... 81
4.2 Membuat Route ........................................................... 82
4.3 Membuat Halaman Home ........................................... 83
4.4 Membuat Login ........................................................... 90
4.5 Membuat Regstrasi...................................................... 94
4.6 Membuat Detail ......................................................... 100
4.7 Membuat Chekout ..................................................... 106
4.8 Membuat Halaman Admin ........................................ 110
4.9 Membuat Travel Package .......................................... 112
4.10 Membuat Galeri ........................................................ 118
4.11 Membuat Transaction................................................ 123
DAFTAR PUSTAKA ........................................................... 131

7
DAFTAR GAMBAR
Gambar 1.1 Tampilan XAMPP .......................................................... 11
Gambar 1.2 Tampilan CMD .............................................................. 12
Gambar 1.3 File PHP ......................................................................... 12
Gambar 1.4 Directori ........................................................................ 12
Gambar 1.5 File PHP.exe .................................................................. 12
Gambar 1.6 Composer ..................................................................... 13
Gambar 1.7 Proses Instalasi ............................................................. 13
Gambar 1.8 Lokasi Penyimpanan ..................................................... 14
Gambar 1.9 Proxy ............................................................................. 14
Gambar 1.10 Proses Instal................................................................ 14
Gambar 1.11 Finsh ........................................................................... 15
Gambar 1.12 Composer siap di gunakan ......................................... 15
Gambar 1.13 Laravel ........................................................................ 15
Gambar 1.14 Laravel.exe .................................................................. 16
Gambar 1.15 Folder Laravel ............................................................. 16
Gambar 4.1 Database ....................................................................... 81
Gambar 4.2 Home ............................................................................ 89
Gambar 4.3 Login ............................................................................. 93
Gambar 4.4 Registrasi .................................................................... 100
Gambar 4.5 Halaman Detail ........................................................... 106
Gambar 4.6 Halaman Checkout ..................................................... 109
Gambar 4.7 Dashbord Admin ......................................................... 112
Gambar 4.8 Index Travel Package .................................................. 115
Gambar 4.9 Travel Package Create ................................................ 118
Gambar 4.10 Galeri Index .............................................................. 121
Gambar 4.11Galeri Create.............................................................. 123
Gambar 4.12 Transaction Index ..................................................... 126
Gambar 4.13 Transaction Detail..................................................... 129
Gambar 4.14 Transaction Edit ........................................................ 131

8
BAB 1

PENGENALAN FRAMEWORK LARAVEL


1.1 Pengertian Framework
Laravel merupakan sebuah framework dari PHP. Untuk
kita bisa memahami ini maka harus membahas terlebih dahulu
apa yang dimaksud dengan framework.
Framework merupakan kumpulan dari “kode program
yang siap pakai dengan aturan untuk penulisan tertentu yang
bertujuan untuk memudahkan serta mempercepat pembuatan”
sebuah aplikasi. Lebih spesifiknya lagi, PHP framework ini ialah
framework yang dibuat dengan menggunakan bahasa
pemrograman PHP.
Tujuan menggunakan framework adalah untuk
mempercepat penyelesaian dalam pembuatan aplikasi, karna
pada framework sendiri sudah terdapat macam-macam fitur
yang siap untuk digunakan. Aturan penulisan pada framework
ini juga menggunakan cara penulisan yang baik.
Framework tidak hanya terdapat pada Laravel saja.
Terdapat bermacam-macam framework yang dapat digunakan
untuk keperluan yang berbeda-beda. Contohnya, adalah
Bootstrap. Bootstrap merupakan sebuah framework dari CSS
yang berisi sekumpulan code CSS untuk memudahkan proses
pembuatan web. Selain Bootstrap juga terdapat framework CSS
lainnya, misal Bulma, Materialize, Zurb Foundation, dan
Semantic UI.

9
Laravel merupakan framework PHP. Adalah sebuah
framework yang digunakan untuk penggunaan Bahasa
pemrograman PHP. Selain Laravel terdapat framework laninya
seperti, Code Igniter, Symfony, Yii, dan Zend
1.2 Sejarah Laravel
Awal pembuatan pada framework Laravel adalah dari
sebuah masalah yang di hadapi oleh Taylor Otwell pada tahun
2011. Pada saat itu framework php sudah cukup banyak
tersedia, salah satunya adalah Code Igniter. Namun Tylor sendiri
masih merasa kurang sesuai dengan kebutuhannya. Salah satu
fitur yang tidak ada pada Code Igniter adalah sebuah mekanisme
untuk pendaftaran dan login user, karena semua aplikasi yang
berbasis web membutuhkan fitur pendaftaran dan login user.
Taylor pun mencoba untuk merangcang framework PHP
yang diberi nama Laravel. Nama tersebut terinspirasi dari sebuah
castil Paravel yaitu sebuat novel/film The Chronicles of Narnia.
Laravel secara resmi dirilis untuk pertama kalinya pada 9
juni 2011 dengan versi beta, dan sebulan sesudahnya diikuti
dengan versi 1.0. laravel versi 2.0 dikeluarkan pada bulan
September tahun yang sama , yang kemudian rilis Laravel versi
3.0 pada bulan Februari 2012, Laravel 4.0 pada bulan Mei 2013,
dan Laravel versi 5.0 pada bulan Februari 2015.
Pada versi 5.0 ini, tim pengembangan Laravel membuat
update setiap 6 bulan sekali akan hadir dengan penomoran versi
digit kedua, yaitu Laravel 5.1, 5.2, dan seterusnya. Tetapi dengan
adanya Laravel yang setiap 6 bulan sekali update dapat menjadi
kendala tersendiri bagi programmer, dikarenakan harus update
setiap 6 bulan untuk mendapatkan fitur-fitur yang ditambah
maupun fitur yang berubah pada versi terbaru.

10
Versi terakhir pada Laravel adalah versi 8 yang dirilis pada
September 2020, maka jika setiap 6 bulan sekali update,
kemungkinan pada bulan Maret terdapat versi Laravel terbaru.

1.3 Cara Install Laravel


1. Install XAMPP
Xampp merupakan sebuah aplikasi untuk
memproses code PHP secara local. Sebagian orang
mungkin sudah mempunyai aplikasi ini, tetapi jika tidak
mempunyai bisa download pada website resmi di
apchefriends.org. Pada Laravel ini kita membutuhkan
versi terbaru, minimum PHP versi 7.3 yang artinya
Ketika menggunaka Laravel versi 8 ini setidaknya
menggunakan XAMPP 7.3 atas.

Gambar 1.1 Tampilan XAMPP

2. Mengakses Melalui CMD

Langkah-langkah:
1. Membuka CMD (Command Prompt).
11
Gambar 1.2 Tampilan CMD

2. Mengakses file PHP.

Gambar 1.3 File PHP

3. Memindahkan file aktif atau directori.

Gambar 1.4 Directori

4. Mengakses File php.exe Pada CMD.

Gambar 1.5 File PHP.exe

12
5. Kemudian menginstall composer yang pertama
dilakukan adalah mengunjungi web resmi
composer di getcomposer.org untuk mengambil
file installer.

Gambar 1.6 Composer

6. Kemudian klik tombol download, setelah itu klik


file Composer-Setup.exe .
7. Proses instalasi.

Gambar 1.7 Proses Instalasi

8. Memilih lokasi penyimpanan .

13
Gambar 1.8 Lokasi Penyimpanan

9. Mengatur Proxy pada saat proxy kita tidak perlu


mengisinya.

Gambar 1.9 Proxy

10. Kemudian menunggu sampai finish.

Gambar 1.10 Proses Instal

14
Gambar 1.11 Finsh

11. Dan composer siap di gunakan.

Gambar 1.12 Composer siap di gunakan

12. Setelah selesai install composer lalu kita


melanjutkan menginstal laravel.
13. Dengan Menggunakan perintah “ composer
global require Laravel/installer “kemudian kita
enter.

Gambar 1.13 Laravel

15
14. Setelah selesai mendownload akan mendapatkan
sebuah program baru untuk cmd yaitu laravel.exe.

Gambar 1.14 Laravel.exe

15. Lalu kita membuat perintah “ laravel new


<nama_folder>” untuk membuat folder laravel.

Gambar 1.15 Folder Laravel

16. Setelah selesai kita bisa menggunakan framework


laravel ini.

BAB 2
Library Laravel

16
2.1 Route
1 . Basic Routing
# File Route Default
Semua route laravel di tentukan dalam file route
kalian,yang terletak di direktori routes. File-file ini
secara otomatis di muat oleh file
App\Providers\RouteServiceProvider.
Routes\web.php ini berkas yang mendefinisikan route
antarmuka web kalian. Route dalam routes/api.php
tidak di tetapkan ke grup middleware api.

Route yang ditentukan dalam file


routes/api.web dimasukkan ke dalam grup route oleh
file RouteServiceProvider. Dalam grup ini, /api
awalan URL yang diterapkan secara otoatis sehingga
kalian tidak perlu menerapkannay secara manual ke setiap
route dalam file kalian.
# Available Router Methods

17
Kalian harus mendaftarkan route yang merespon
suatu kata kerja HTTP. Kalian dapat menjalankannya
dengan menggunakan metode match.
# Redirect Routes
Metode ini menyediakan langkah yang paling
nyaman sehingga tidak perlu menentukan rute untuk
melakukan Redirect/pengalihan sederhana. Contoh :
Route ::redirect(‘/here’, ‘/there’) ;
Catatan : Pada saat menggunakan route
parameters di redirect routes, parameter tersebut di
cadangkan oleh Laravel dan tidak dapat di gunakan
:destination dan status.

18
# View Route
Jika ingin mengembalikan tampilan,maka
dapatmenggunakan metode ini Route ::view. Dengan
menggunakan metode ini dapat menerima URL sebagai
argumen pertama dan pkalianngan nama sebagai
argumen kedua,Selaian itu,dapat memberikan larik data
untuk di teruskan ke tampilan sebagai argumen
ketiga.contoh :

2. Route Parameters
Required Parameters
Terkadang kalian perlu mengambil segmen URL
dalam route kalian. Misalnya, kalian mengambil ID
pengguna dari URL. Maka kalian dapat menentukan
route parameters nya :

Garis bawah ( _ ) juga dapat diterima dalam nama


route parametrs.
19
# Parameters & Dependency Injection
Jika route kalian memliki dependensi yang kalian
inginkan agar wadah layanan laravel dimasukkan secara
otomatis ke dalam panggilam balik route kalian, kalian
harus mencantumkan route parameters setelah
dependensi kalian :

# Optional Parameters

Terkadang kalian mungkin perlu menentukan


route parameters yang mungkin tidak selalu ada di URL.
Kalian dapat melakukannya dengan memberi tkalian ?
setelah nama
parameters. Pastikan kalian memberikan nilai default
pada variabel terkait route :

20
# Global Constrains
Jika kalian ingin route parameter selalu dibatasi
oleh regular expression yang di berikan, kalian dapat
menggunakan metode ini : pattern. Kalian harus
menjelaskan pola-pola ini dalam boot dengan metode
App\Providers\RouteServiceProvider :

21
# Named Route
Named Route memungkinkan pembuatan URL
atau pengalihan yang mudah untuk route tertentu. Kalian
dapat menentukan nama untuk route dengan merantai
demgan metode name ke definisi rute :

3. Route Groups

22
Pada Route groups memungkinkan kalian untuk
berbagi route attributes, seperti middleware.
# Middleware
Untuk menetapkan middleware ke semua route
kedalam grup, kalian dapat menjalankan metode
middleware, sebelum mendifinisikan grup:

23
2.2 Controller
1. Introduction
Pengontrol dapat mengelompokkan logika
penanganan suatu permintaan terkait di dalam satu kelas.
Misalnya, kelas UserController mungkin menangani
semua permintaan masuk yang terkait dengan pengguna,
termasuk menampilkan, membuat, memperbarui, dan
menghapus pengguna. Secara default, pengontrol
disimpan dalam direktori app/Http/Controllers.
2. Writing Controllers
- Basic Controllers
Mari kita lihat contoh pengontrol dasar.
Perhatikan bahwa pengontrol memperluas kelas
pengontrol dasar yang disertakan dengan Laravel:
App\Http\Controllers\Controller:

24
Ketika permintaan cocok dengan URI rute yang
ditentukan, metode showmetode pada kelas
App\Http\Controllers\UserController akan
dipanggil dan parameter rute akan diteruskan ke
metode.

- Single Action Controllers


25
Jika tindakan pengontrol sangat kompleks,
Kalian mungkin merasa nyaman untuk
mendedikasikan seluruh kelas pengontrol untuk
tindakan tunggal itu. Untuk mencapai ini, kalian dapat
menentukan satu meyode __invoke di dalam
pengontrol:

26
Saat mendaftarkan rute untuk pengontrol
tindakan tunggal, Kalian tidak perlu menentukan
metode pengontrol. Sebagai gantinya, Kalian cukup
meneruskan nama pengontrol ke router.
Catatan:
Rintisan pengontrol dapat dikustomisasi
menggunakan penerbitan rintisan .

3. Controller Middleware

Middleware dapat ditetapkan ke rute pengontrol


di file rute Kalian.
Dengan menggunakan metode middleware di
dalam konstruktor pengontrol, Kalian dapat menetapkan
middleware ke tindakan pengontrol:

27
4. Resoursce Controllers
Jika Kalian menganggap setiap model Eloquent
dalam aplikasi Kalian sebagai "sumber daya", biasanya
melakukan serangkaian tindakan yang sama terhadap
setiap sumber daya dalam aplikasi Kalian. Misalnya,
bayangkan aplikasi Kalian berisi Photomodel dan
Moviemodel. Kemungkinan pengguna dapat membuat,
membaca, memperbarui, atau menghapus sumber daya
ini.

Karena kasus penggunaan umum ini, perutean


sumber daya Laravel menetapkan rute khas buat, baca,
perbarui, dan hapus ("CRUD") ke pengontrol dengan
satu baris kode. Untuk memulai, kita dapat
menggunakan opsi perintah make:controller Artisan -
28
-resourceuntuk membuat pengontrol dengan cepat untuk
menangani tindakan ini:

- Action Handled By Resource Controller

- Partial Resource Routes


Saat menggunakan rute sumber daya, Kalian
dapat menentukan tindakan yang harus ditangani
pengontrol:

29
2.3 Collection
Semua metode Eloquent yang mengembalikan lebih dari
satu hasil model akan mengembalikan instance kelas
Illuminate\Database\Eloquent\Collection, termasuk
hasil yang diambil melalui getmetode atau diakses melalui
hubungan. Objek koleksi Eloquent memperluas koleksi dasar
Laravel , sehingga secara alami mewarisi lusinan metode yang
digunakan untuk bekerja dengan lancar dengan larik model
Eloquent yang mendasarinya. Pastikan untuk meninjau
dokumentasi koleksi Laravel untuk mempelajari semua tentang
metode bermanfaat ini!

30
Semua koleksi juga berfungsi sebagai iterator,
memungkinkan Kalian untuk mengulangnya seolah-olah itu
adalah array PHP sederhana:

1. Eloquent Collection Conversion


Sementara sebagian besar metode koleksi Eloquent
mengembalikan instance baru dari koleksi Eloquent,
metode collapse, flatten, flip, keys, pluck,
dan zip mengembalikan instance koleksi dasar .
Demikian juga, jika mapoperasi mengembalikan koleksi
yang tidak berisi model Eloquent, operasi tersebut akan
dikonversi menjadi instance koleksi dasar.
2. Available Methods
Semua koleksi Eloquent memperluas objek koleksi
Laravel dasar ; oleh karena itu, mereka mewarisi semua
metode canggih yang disediakan oleh kelas koleksi
dasar.

31
Selain itu, kelas
Illuminate\Database\Eloquent \Collection
menyediakan superset metode untuk membantu
mengelola koleksi model Kalian. Sebagian besar metode
mengembalikan
Illuminate\Database\Eloquent\Collectioninsta
nce; namun, beberapa metode, seperti model Keys,
mengembalikan sebuah Illuminate\Support
\Collectioninstance.
- Contains
($value = null , $operator = null, $key)

Metode contains dapat digunakan untuk


menentukan apakah contoh model yang diberikan
terkandung oleh koleksi. Metode ini menerima
kunci utama atau contoh model:

- Diff
diff($items)

method diff mengembalikan semua model yang


tidak hadir dalam koleksi yang diberikan:

32
2.4 Migration
1. Introduction
Migrasi seperti kontrol versi untuk database Kalian,
memungkinkan tim Kalian untuk menentukan dan
berbagi definisi skema database aplikasi. Jika Kalian
pernah harus memberi tahu rekan satu tim untuk
menambahkan kolom secara manual ke skema basis data
lokal mereka setelah menarik perubahan Kalian dari
kontrol sumber, Kalian menghadapi masalah yang
dipecahkan oleh migrasi basis data.

Schema Fasad Laravel menyediakan dukungan


database agnostik untuk membuat dan memanipulasi
tabel di semua sistem database yang didukung Laravel.
Biasanya, migrasi akan menggunakan fasad ini untuk
membuat dan memodifikasi tabel dan kolom database.
2. Generating Migrations
Kalian dapat menggunakan make:migration
perintah Artisan untuk menghasilkan migrasi database.
Migrasi baru akan ditempatkan di direktori
database/migrations Kalian . Setiap nama file migrasi

33
berisi stempel waktu yang memungkinkan Laravel
menentukan urutan migrasi.
Laravel akan menggunakan nama migrasi untuk
mencoba menebak nama tabel dan apakah migrasi akan
membuat tabel baru atau tidak. Jika Laravel dapat
menentukan nama tabel dari nama migrasi, Laravel akan
mengisi terlebih dahulu file migrasi yang dihasilkan
dengan tabel yang ditentukan. Jika tidak, Kalian cukup
menentukan tabel dalam file migrasi secara manual.

Jika Kalian ingin menentukan jalur khusus untuk


migrasi yang dihasilkan, Kalian dapat menggunakan --
pathopsi saat menjalankan perintah make:migration.
Jalur yang diberikan harus relatif terhadap jalur dasar
aplikasi Kalian.
- Squashing Migrations
Saat Kalian membangun aplikasi, Kalian
dapat mengumpulkan lebih banyak dan lebih banyak
migrasi dari waktu ke waktu. Ini dapat menyebabkan
direktori database/migrations Kalian menjadi
kembung dengan kemungkinan ratusan migrasi. Jika
Kalian mau, Kalian dapat "menghancurkan" migrasi
Kalian ke dalam satu file SQL. Untuk memulai,
jalankan schema:dumpperintah:

34
Saat Kalian menjalankan perintah ini,
Laravel akan menulis file "skema" ke direktori
database/schema aplikasi Kalian . Sekarang, ketika
Kalian mencoba untuk memigrasi database Kalian
dan tidak ada migrasi lain yang dijalankan, Laravel
akan mengeksekusi pernyataan SQL file skema
terlebih dahulu. Setelah mengeksekusi pernyataan
file skema, Laravel akan mengeksekusi migrasi yang
tersisa yang bukan merupakan bagian dari dump
skema.
3. Migration Structure
Kelas migrasi berisi dua metode: updan down. The
upmetode yang digunakan untuk menambahkan tabel
baru, kolom, atau indeks ke database Kalian, sedangkan
downmetode harus membalikkan operasi yang dilakukan
oleh upmetode.

Dalam kedua metode ini, Kalian dapat


menggunakan pembuat skema Laravel untuk membuat
dan memodifikasi tabel secara ekspresif. Untuk
mempelajari tentang semua metode yang tersedia di
35
Schemabuilder, lihat dokumentasinya . Misalnya,
migrasi berikut membuat tabel flights:

36
4. Running Migrations
Untuk menjalankan semua migrasi luar biasa Kalian,
jalankan migrateperintah Artisan:

php artisan migrate

- Rolling Back migrations


Untuk memutar kembali operasi migrasi
terbaru, Kalian dapat menggunakan perintah rollback
Artisan. Perintah ini mengembalikan "kumpulan"
migrasi terakhir, yang mungkin menyertakan
beberapa file migrasi:

37
php artisan migrate:rollback

5. Tabel
- Creating Tables
Untuk membuat tabel database baru, gunakan
metode create pada Schemafasad. Metode create
menerima dua argumen: pertama adalah nama dari
tabel, sedangkan yang kedua adalah penutupan yang
menerima Blueprint objek yang dapat digunakan
untuk mendefinisikan tabel baru:

38
$table->string('email');

$table->timestamps();

});

- Updating Tabels
Metode table pada Schemafasad dapat
digunakan untuk memperbarui tabel yang ada. Seperti
metode create, metode table menerima dua
argumen: nama tabel dan penutupan yang menerima
Blueprintinstance yang dapat Kalian gunakan
untuk menambahkan kolom atau indeks ke tabel:

2.5 Blade
1. Introduction

39
Blade adalah mesin templating sederhana namun
kuat yang disertakan dengan Laravel. Tidak seperti
beberapa mesin templating PHP, Blade tidak membatasi
Kalian untuk menggunakan kode PHP biasa di templat
Kalian. Faktanya, semua template Blade dikompilasi ke
dalam kode PHP biasa dan di-cache sampai
dimodifikasi, yang berarti Blade pada dasarnya
menambahkan nol overhead ke aplikasi Kalian. File
template blade menggunakan file .blade.phpekstensi
dan biasanya disimpan dalam direktori
resources/views.

Tampilan blade dapat dikembalikan dari rute atau


pengontrol menggunakan bantuan global view. Tentu
saja, seperti yang disebutkan dalam dokumentasi pada
views , data dapat diteruskan ke tampilan Blade
menggunakan argumen view kedua helper:

2. Displaying Data
Kalian dapat menampilkan data yang diteruskan
ke tampilan Blade Kalian dengan membungkus variabel
dalam kurung kurawal. Misalnya, diberikan rute berikut:
40
- Blade & JavaScript Frameworks
Karena banyak kerangka kerja JavaScript
juga menggunakan kurung kurawal "keriting"
untuk menunjukkan ekspresi yang diberikan harus
ditampilkan di browser, Kalian dapat
menggunakan @simbol untuk memberi tahu mesin
rendering Blade bahwa ekspresi harus tetap tidak
tersentuh. Sebagai contoh:

<h1>Laravel</h1>

Hello, @{{ name }}.

Dalam contoh ini, @simbol akan dihapus


oleh Blade; namun, {{ name }}ekspresi akan
tetap tidak tersentuh oleh mesin Blade,
memungkinkannya untuk dirender oleh kerangka
kerja JavaScript Kalian.

41
@simbol juga dapat digunakan untuk
melarikan diri pisau arahan:

{{-- Blade template --}}

@@json()

<!-- HTML output -->

@json()

3. Components
Komponen dan slot memberikan manfaat yang
serupa dengan bagian, tata letak, dan termasuk; namun,
beberapa mungkin menganggap model mental
komponen dan slot lebih mudah dipahami. Ada dua
pendekatan untuk menulis komponen: komponen
berbasis kelas dan komponen anonim.

Untuk membuat komponen berbasis kelas,


Kalian dapat menggunakan perintah make:component
42
Artisan. Untuk mengilustrasikan cara menggunakan
komponen, kita akan membuat Alertkomponen
sederhana. perintah make:component akan
menempatkan komponen dalam direktori
App\View\Components:

- Rendering Components
Untuk menampilkan komponen, Kalian dapat
menggunakan tag komponen Blade dalam salah
satu template Blade Kalian. Tag komponen blade
dimulai dengan string x-diikuti dengan nama kasus
kebab dari kelas komponen:

<x-alert/>

<x-user-profile/>

- Passing Data To Components


Kalian dapat meneruskan data ke komponen
Blade menggunakan atribut HTML. Hard-coded,
nilai primitif dapat diteruskan ke komponen
menggunakan string atribut HTML sederhana.
Ekspresi dan variabel PHP harus diteruskan ke
43
komponen melalui atribut yang menggunakan
:karakter sebagai awalan:

<x-alert type="error"
:message="$message"/>

- Component Attributes
Kami telah memeriksa cara meneruskan
atribut data ke komponen; namun, terkadang
Kalian mungkin perlu menentukan atribut HTML
tambahan, seperti class, yang bukan merupakan
bagian dari data yang diperlukan agar komponen
berfungsi. Biasanya, Kalian ingin meneruskan
atribut tambahan ini ke elemen root template
komponen. Misalnya, bayangkan kita ingin
merender alert komponen seperti ini.
Semua atribut yang bukan bagian dari
konstruktor komponen akan secara otomatis
ditambahkan ke "tas atribut" komponen. Tas
atribut ini secara otomatis tersedia untuk
komponen melalui $attributesvariabel .
Semua atribut dapat dirender dalam komponen
dengan menggemakan variabel ini:

<div {{ $attributes }}>

44
<!-- Component content -->

</div>

- Reserved Keywords
Secara default, beberapa kata kunci
dicadangkan untuk penggunaan internal Blade
untuk merender komponen. Kata kunci berikut
tidak dapat didefinisikan sebagai properti publik
atau nama metode dalam komponen Kalian:

45
2.6 Views
1. Introduction
Tentu saja, tidak praktis untuk mengembalikan
seluruh string dokumen HTML langsung dari rute dan
pengontrol Kalian. Untungnya, tampilan menyediakan
cara yang nyaman untuk menempatkan semua HTML
kami di file terpisah. Tampilan memisahkan logika
46
pengontrol/aplikasi Kalian dari logika presentasi Kalian
dan disimpan dalam direktori resources/views.
Tampilan sederhana mungkin terlihat seperti ini:

Karena tampilan ini


disimpan di
resources/views/greeting.blade.php, kami dapat
mengembalikannya menggunakan bantuan global
viewseperti.
2. Creating & Rendering Views
Kalian dapat membuat tampilan dengan
menempatkan file dengan .blade.phpekstensi di direktori
resources/views aplikasi Kalian . Ekstensi
blade.php menginformasikan kerangka bahwa file
berisi template yang pisau . Template Blade berisi

47
HTML serta arahan Blade yang memungkinkan Kalian
untuk dengan mudah menggemakan nilai, membuat
pernyataan "jika", mengulangi data, dan banyak lagi.

Setelah Kalian membuat tampilan, Kalian dapat


mengembalikannya dari salah satu rute atau pengontrol
aplikasi Kalian menggunakan bantuan global view:

- Nested View Directories


Tampilan juga dapat disarangkan dalam
direktori sub direktori resources/views. Notasi
"Titik" dapat digunakan untuk mereferensikan
tampilan bersarang. Misalnya, jika tampilan
Kalian disimpan di resources\views\admin
\profile.blade.php, Kalian dapat
mengembalikannya dari salah satu rute/pengontrol
aplikasi Kalian seperti:

48
3. Passing Data To Views
Seperti yang Kalian lihat dalam contoh
sebelumnya, Kalian dapat meneruskan larik data ke
tampilan untuk membuat data tersebut tersedia untuk
tampilan:

return view('greetings', ['name' =>


'Victoria']);

Saat meneruskan informasi dengan cara ini, data


harus berupa larik dengan pasangan kunci/nilai. Setelah
memberikan data ke tampilan, Kalian kemudian dapat
mengakses setiap nilai dalam tampilan menggunakan
kunci data, seperti <?php echo $name; ?>.
Sebagai alternatif untuk meneruskan larik data
lengkap ke fungsi view pembantu, Kalian dapat
menggunakan metode with untuk menambahkan
potongan data individual ke tampilan. Metode
withmengembalikan sebuah instance dari tampilan
objek sehingga Kalian dapat terus metode chaining
sebelum kembali.
- Sharing Data With All Views
Terkadang, Kalian mungkin perlu berbagi
data dengan semua tampilan yang dirender oleh
aplikasi Kalian. Kalian dapat melakukannya
dengan menggunakan metode Viewfasad share.
49
Biasanya, Kalian harus melakukan panggilan ke
sharemetode dalam metode penyedia layanan
boot. Kalian bebas menambahkannya ke kelas
App\Providers\AppServiceProvider atau
membuat penyedia layanan terpisah untuk
menampungnya:

<?php

namespace App\Providers;

use Illuminate\Support\Facades\View;

class AppServiceProvider extends


ServiceProvider

public function register()

50
{

//

public function boot()

View::share('key', 'value');

4. View Composers
View composer adalah callback atau metode
kelas yang dipanggil saat tampilan dirender. Jika
Kalian memiliki data yang ingin Kalian ikat ke
tampilan setiap kali tampilan tersebut dirender,
penyusun tampilan dapat membantu Kalian mengatur
logika tersebut ke dalam satu lokasi. View composer
mungkin terbukti sangat berguna jika tampilan yang
sama dikembalikan oleh beberapa rute atau pengontrol
51
dalam aplikasi Kalian dan selalu membutuhkan bagian
data tertentu.

Biasanya, penyusun tampilan akan didaftarkan


dalam salah satu penyedia layanan aplikasi Kalian .
Dalam contoh ini, kita akan berasumsi bahwa kita
telah membuat yang baru App\Providers
\ViewServiceProvider untuk menampung logika
ini.

Kami akan menggunakan metode Viewfasad


composer untuk mendaftarkan view composer.
Laravel tidak menyertakan direktori default untuk
penyusun tampilan berbasis kelas, jadi Kalian bebas
mengaturnya sesuka Kalian. Misalnya, Kalian dapat
membuat direktori app/Http/View/Composers untuk
menampung semua penyusun tampilan aplikasi
Kalian:

52
}

53
Catatan:
Ingat, jika Kalian membuat penyedia layanan baru
untuk memuat pendaftaran penyusun tampilan,
Kalian perlu menambahkan penyedia layanan ke

54
providers larik di file config/app.php
konfigurasi.

- View Creators
View "creators" sangat mirip dengan view
composer; namun, mereka dieksekusi segera
setelah tampilan dibuat, bukan menunggu hingga
tampilan akan dirender. Untuk mendaftarkan
pembuat tampilan, gunakan metode creator:

5. Optimizing Views
Secara default, tampilan template Blade
dikompilasi sesuai permintaan. Ketika permintaan
dieksekusi yang membuat tampilan, Laravel akan
menentukan apakah ada versi tampilan yang
dikompilasi. Jika file tersebut ada, Laravel kemudian
akan menentukan apakah tampilan yang tidak
dikompilasi telah dimodifikasi lebih baru daripada
tampilan yang dikompilasi. Jika tampilan yang
55
dikompilasi tidak ada, atau tampilan yang tidak
dikompilasi telah dimodifikasi, Laravel akan
mengkompilasi ulang tampilan.

Mengkompilasi tampilan selama permintaan


mungkin memiliki dampak negatif kecil pada kinerja,
jadi Laravel menyediakan perintah view:cache Artisan
untuk mengkompilasi semua tampilan yang digunakan
oleh aplikasi Kalian. Untuk meningkatkan kinerja,
Kalian mungkin ingin menjalankan perintah ini sebagai
bagian dari proses penerapan Kalian:

php artisan view:cache

Kalian dapat menggunakan perintah view:clear


untuk menghapus tampilan cache:

php artisan view:clear

56
2.7 Validation
1. Introduction
Laravel telah menyediakan untuk memvalidasi
data masuk pada aplikasi Kalian. Cara yang paling
umum adalah menggunakan metode validate yang
tersedia pada semua permintaan HTTP yang masuk.
Namun, kami juga akan membahas pendekatan lain
untuk validasi.

Laravel menyertakan berbagai macam aturan


validasi yang mudah digunakan yang mungkin Kalian
terapkan pada data, bahkan menyediakan kemampuan
untuk memvalidasi jika nilainya unik dalam tabel
database tertentu. Kami akan membahas masing-masing
aturan validasi ini secara rinci sehingga Kalian terbiasa
dengan semua fitur validasi Laravel.
2. Validation Quickstart
Untuk kita dapat mempelajari tentang fitur yang
ada di validasi Laravel ini, sekarang kita lihat dengan
sesama contoh validasi laravel lengkap ini untuk
memvalidasi sebuah formulir serta menampilkan pesan
kesalahannya kembali pada pengguna. Dengan
membaca ikhtisar tingkat tinggi ini, Kalian akan dapat
memperoleh pemahaman umum yang baik tentang cara
memvalidasi data permintaan yang masuk menggunakan
Laravel:
- Defining The Routes

57
Kita disini sudah memiliki route yang
ditentukan dalam bentuk file routes/web.php
kita :

GET pada route akan menampilkan sebuah


formulir pada pengguna untuk kita membuat
sebuah blog baru, sedangkan di POST pada route
akan dapat menyimpan blog baru di dalam
database.
- Creating The Controller
Berikutnya, kita akan segera lihat pengontrol
yang simple dengan menangani permintaan masuk
ke rute ini. Kita akan membuat metode store
seperti code dibawah ini :

58
{

59
return view('post.create');

public function store(Request


$request)

- Writing The Validation Logic


Untuk kita bisa melakukan program ini, kita
dapat menggunakan sebuah metode yang bernama
validate metode yang sudah disediakan oleh
objek Illuminate\Http\Request.
Jika validasi gagal selama permintaan
HTTP, respons pengalihan ke URL sebelumnya
akan dibuat. Jika permintaan yang masuk adalah
permintaan XHR, respons JSON yang berisi pesan
kesalahan validasi akan dikembalikan.

Mari kita kembali pada metode store:


60
2.8 Eloquent ORM
1. Introduction
Laravel menyertakan Eloquent, sebuah object-
relational mapper (ORM) yang membuatnya
menyenangkan untuk berinteraksi dengan database
kalian. Saaat menggunakan Eloquent, setiap tabel

61
database memiliki “Model” terkait yang digunakan
untuk berinteraksi dengan tabel tersebut. Selain
mengambil catatan dari tabel database, model
Eloquent memungkinkan kalian untuk
menyisipkan,memperbarui, dan menghapus catatan
dari tabel juga.
Catatan:
Sebelum memulai, pastikan untuk mengonfigurasi
koneksi database di file config/database.php
konfigurasi aplikasi kalian.

2. Generating Model Classes


Untuk memulai kalian harus membuat model
Eloquent. Model biasanya tinggal di app\Models
direktori dan memperluas kelas Illuminate
\Database\Eloquent\Model. Kalian dapat
menggunakan make:model untuk menghasilkan model
baru :

3. Eloquent Model Conventions


Model yang dihasilkan oleh perintah
make:model akan ditempatkan di app/Model direktori.
Mari kita periksa kelas model dasar dan beberapa
konvensi kunci Eloquent:

62
1. Table Names
Jadi, dalam hal ini, Eloquent akan
menganggap model Flight menyimpan record
dalam tabel flights, sedangkan model
AirTrafficController akan menyimpan reocrd
dalam tabel air_traffic_controllers.
Jika tabel database terkait model kalian
tidak sesuai dengan konvensi ini, Kalian dapat
menentukan model nama tabel secra manual
dengan properti pada model table :

63
2. Primary Keys
Eloquent juga akan mengasumsikan
bahwa setiap model tabel database yang sesuai
memiliki kolom primary keys bernama id. Jika
perlu, kalian dapat menentukan properti
$primaryKey yang dilindungi pada model kalian
untuk menentukan kolom berbeda yang berfungsi
sebagai model primary key kalian:

64
3. Timestamps
Secara default, Eloquent terdapat kolom
created_at dan updated_at ada di tabel
database yang sesuai dengan model kalian.
Eloquent akan secara otomatis menetapkan nilai
kolom ini saat model dibuat atau diperbarui. Jika
kalian tidak ingin kolom ini dikelola secara
otomatis oleh Eloquent, kalian harus
mendefinisikan properti $timestamps pada
model kalian dengan nilai false:

65
4. Database Connections
Secara default, semua model Eloquent
akan menggunakan koneksi database default
yang dikonfigurasi untuk aplikasi kalian. Jika
kalian ingin menentukan koneksi yang berbeda,
maka harus berinteraksi dengan model tertentu,
kalian harus mendefinisikan properti pada model
$connection:

66
5. Default Attribue Values
Secara default, instance model yang baru
dipakai tidak akan berisi nilai atribut apa pun. Jika
kalian ingin menentukan nilai default untuk
beberapa atribut model, Kalian dapat menentukan
properti pada model $attributes:

67
1. Advanced Subqueries

1. Subquery Select
Eloquent juga menawarkan dukungan
subquery tingkat lanjut, yang memungkinkan
kalian menarik informasi dari tabel terkait
dalam satu queriy. Sebagai contoh, mari kita
bayangkan bahwa kita memiliki tabel
penerbangan destinations dan tabel flights
68
tujuan. tabel Flights berisi kolom arrived_at
yang menunjukkan di tempat tujuan.

Dengan menggunakan fungsionalitas


subkueri yang tersedia untuk pembuat metode
query select dan addSelect:

69
2. Subquery Ordering
Selain itu, fungsi pembuat queri
orderBy mendukung subqueri. Kalian dapat
menggunakan fungsi ini untuk mengurutkan
semua tujuan berdasarkan kapan penerbangan
terakhir tiba di tujuan tersebut. Sekali lagi, ini
dapat dilakukan saat menjalankan queri basis
data tunggal:

70
4. Inserting & Updating Models
1. Inserts
Tentu saja, saat menggunakan Eloquent,
kita tidak hanya perlu mengambil model dari
database. Kita juga perlu memasukkan catatan
baru. Untungnya, Eloquent membuatnya dengan
sederhana. Untuk memasukkan record baru ke
dalam database, kalian harus membuat instance
model baru dan menetapkan atribut pada model.
Kemudian, panggil dengan metode save pada
contoh model sebagai berikut.
Dalam contoh ini, kami menetapkan
bidang name dari permintaan HTTP yang masuk
ke atribut name model App\Models
\Flightinstance. Saat kita memanggil metode
save, sebuah record akan dimasukkan ke dalam
database. Model created_at dan updated_at
stempel waktu akan otomatis disetel saat metode
save dipanggil, jadi tidak perlu menyetelnya
secara manual.
Atau, kalian dapat menggunakan metode
create untuk "menyimpan" model baru
menggunakan satu pernyataan PHP. Contoh
model yang dimasukkan akan dikembalikan
kepada kalian dengan metode create:

71
Namun, sebelum menggunakan metode
create ini, kalian perlu menentukan properti
fillable atau guarded pada kelas model.
Properti ini diperlukan karena semua model
Eloquent dilindungi dari kerentanan penugasan
massal secara default.
2. Updates
Pada metode save ini juga dapat
digunakan untuk model pembaruan yang sudah
ada dalam database. Untuk memperbarui model,
kalian harus mengambilnya dan mengatur atribut
apa pun yang ingin di perbarui. Kemudian, kalian
harus memanggil metode model save. Sekali
lagi,stempel updated_at waktu akan diperbarui
secara otomatis, jadi tidak perlu mengatur
nilainya secara manual:

72
- Mass Updates

Pembaruan juga dapat dilakukan


terhadap model yang cocok dengan kueri yang
diberikan. Dalam contoh ini, semua penerbangan
yang activedan memiliki destination dari San
Diego akan ditkaliani sebagai tertunda:

73
Dengan metode update mengharapkan
kolom array dan nilai pasangan yang mewakili
kolom yang harus diperbarui.

Catatan:
Saat mengeluarkan pembaruan massal
melalui Eloquent, peristiwa saving, saved,
updating, dan updatedmodel tidak akan
diaktifkan untuk model yang diperbarui. Ini
karena model tidak pernah benar-benar
diambil saat mengeluarkan pembaruan massal.

3. Upserts

Terkadang, kalian mungkin perlu


memperbarui model yang ada atau membuat
model baru jika tidak ada model yang cocok.
Seperti metode firstOrCreate, metode
74
updateOrCreate mempertahankan model,
jadi tidak perlu memanggil metode save
secara manual .

Dalam contoh di bawah, jika ada penerbangan


dengan lokasi departure Oakland dan lokasi
destination San Diego, price dan
discounted kolomnya akan diperbarui. Jika
tidak ada penerbangan seperti itu, penerbangan
baru akan dibuat yang memiliki atribut yang
dihasilkan dari penggabungan larik argumen
pertama dengan larik argumen kedua:

Jika kalian ingin melakukan beberapa


"upserts" dalam satu kueri, maka kalian harus
menggunakan meode upsert ini sebagai
gantinya. Argumen pertama metode terdiri dari
nilai yang akan disisipkan atau diperbarui,
sedangkan argumen kedua mencantumkan
kolom yang secara unik mengidentifikasi
record dalam tabel terkait. Argumen ketiga dan
75
terakhir metode ini adalah larik kolom yang
harus diperbarui jika catatan yang cocok sudah
ada di database. Metode upsert akan secara
otomatis mengatur created_at dan
updated_at waktu diaktifkan pada model:

Catatan:
Semua sistem basis data kecuali SQL Server
memerlukan kolom dalam argumen kedua
yang diberikan ke upsertmetode untuk
memiliki indeks "utama" atau "unik".

76
BAB 3
PENGENALAN BOOSTRAP

3.1 Pengertian Boostrap


Boostrap merupakan sebuah framework yang dapat
menyelesaikan suatu permasalahan dalam pengembangan
bagian frontend web/desain web dan juga framework ini
memiliki sebuah slogan sebagai berikut : “Sleek, 6 intuitive, and
powerful front-end framework for faster and easier web
development”, yang berarti kita bisa mendesain sebuah website
dengan lebih rapi, mudah dan cepat.
Selain itu Bootstrap juga responsive terhadap suatu
tampilan halaman website yang menggunakan Bootstrap ini
akan selalu tampak tetap rapi, baik versi mobile maupun di versi
desktop,perkembangannya pun masih terus berlangsung hingga
sampai sekarang. Penggunaannya yang sangat mudah, karna kita
tinggal memanggil CSS dan JS yang sudah tersedia.

3.2 Sejarah Boostrap


Bootstrap ini dulunya dibuat serta dikembangkan oleh
para programmer di Twitter, pembuatnya yaitu oleh Jacob
Thornton dan juga Mark Octo yang bernama Twitter Blueprint
sejak pada tahun 2011. Pada saat itu para programmer di Twitter
memakai berbagai macam tools dan library-library yang mereka
sudah kuasai serta juga meeka sukai untuk melakukan beberapa
pekerjaannya.
77
Sejak diluncurkan pada tahun 2011 tepatnya di bulan
agustus , bootstrap ini sudah berevolusi dari proyek yang hanya
cuma basis css sekarang menjadi sebuah framework yang jauh
lebih lengkap. Dan pada tahun 2012 tepatnya di bulan januari,
Bootstrap resmi merealease Versi 2.0 dimana didalamnya sudah
memasukan suatu fitur responsive layout

3.3 Boostrap Grid System


Gunakan kisi flexbox mobile-first kami yang kuat untuk
membangun tata letak dari semua bentuk dan ukuran berkat
sistem dua belas kolom, lima tingkat responsif default, variabel
dan mixin Sass, dan lusinan kelas yang telah ditentukan
sebelumnya.
Boostrap Grid System menggunakan serangkaian
wadah, baris, dan kolom untuk tata letak dan menyelaraskan
konten. Itu dibangun dengan flexbox dan sepenuhnya responsif.
Di bawah ini adalah contoh dan pandangan mendalam tentang
bagaimana kisi-kisi itu bersatu.

Output:
78
Kolom tersebut dipusatkan di halaman dengan induknya
.container.
3.4 Boostrap Content

79
Ini adalah bentuk paling dasar dari Bootstrap: file yang
telah dikompilasi untuk penggunaan drop-in cepat di hampir
semua proyek web. Kami menyediakan CSS dan JS yang
dikompilasi ( bootstrap.*), serta CSS dan JS yang dikompilasi
dan diperkecil ( bootstrap.min.*). peta sumber (

80
bootstrap.*.map) tersedia untuk digunakan dengan alat
pengembang peramban tertentu. File JS yang dibundel (
bootstrap.bundle.jsdan diperkecil bootstrap.bundle.min.js)
termasuk Popper .

BAB 4
Implementasi Sistem Informasi Berbasis
Web Travel Framework Laravel
4.1 Membuat Database
Buatlah tabel database dengan menggunakan perintah :
php make:migration create_(nama_tabels)_tabel –create
nama_tabel)

Gambar 4.1 Database

81
4.2 Membuat Route

82
4.3 Membuat Halaman Home
Resources/views/layouts/app.blade.php :

83
Resources/views/includes/style.blade.php:

84
Resources/views/includes/navbar-alternate.blade.php:

85
Resources/views/includes/footer.blade.php:

86
Resources/views/includes/script.blade.php:

App/http/controllers/HomeController.php:

87
App/TravelPackage.php:

88
Gambar 4.2 Home

89
4.4 Membuat Login
Resources/views/auth/login.blade.php:

90
91
App/http/controllers/auth/LoginController.php

92
Gambar 4.3 Login

93
4.5 Membuat Regstrasi
Resources/views/auth/register.blade.php:

94
95
96
97
Vendor/laravel/framework/src/illuminate/foundation/auth/Regi
stersUsers.php:

98
99
Gambar 4.4 Registrasi

4.6 Membuat Detail


Resources/views/pages/detail.blade.php:

100
101
102
103
104
105
Gambar 4.5 Halaman Detail

4.7 Membuat Chekout


App/http/controllers/CheckoutController.php:

106
107
108
Gambar 4.6 Halaman Checkout

109
4.8 Membuat Halaman Admin
Resources/views/layouts/admin.blade.php:

110
111
Gambar 4.7 Dashbord Admin

4.9 Membuat Travel Package

112
113
114
Gambar 4.8 Index Travel Package

115
116
117
Gambar 4.9 Travel Package Create

4.10 Membuat Galeri

118
119
120
Gambar 4.10 Galeri Index

121
122
Gambar 4.11Galeri Create

4.11 Membuat Transaction

123
124
125
Gambar 4.12 Transaction Index

126
127
128
Gambar 4.13 Transaction Detail

129
130
Gambar 4.14 Transaction Edit

DAFTAR PUSTAKA

131

Anda mungkin juga menyukai