MODUL PU1 Laravel Ok

MODUL PRAKTIKUM
PEMROGRAMAN
AKUNTANSI I
PROGRAM STUDI SISTEM INFORMASI AKUNTANSI
Fakultas Teknik dan Informatika

Universitas Bina Sarana Informatika
Kata Pengantar
Alhamdulillahirabbil’alamiin, puji syukur kehadirat Tuhan Yang Maha Esa atas segala
rahmat dan hidayah-Nya sehingga modul praktikum Pemrograman Akuntansi I ini
dapat tersusun hingga selesai. Kami juga mengucapkan terima kasih sebesar-
besarnya kepada semua pihak yang telah berkontribusi dalam penyusunan modul ini,
baik dalam menyumbangkan pemikiran maupun memberikan motivasi kepada kami
untuk dapat menyelesaikan modul ini.
Modul praktikum ini dibuat sebagai pendukung proses pembelajaran matakuliah

Pemrograman Akuntansi I bagi mahasiswa/I program studi Sistem Informasi Akuntansi
(D3) Fakultas Teknik dan Informatika Universitas Bina Sarana Informatika. Tujuan
penyusunan modul ini agar mahasiswa/i merasakan pengalaman dalam
pengembangan sistem informasi khususnya sistem informasi akuntansi sehingga
mampu mengembangkan kompetensi serta keterampilan dalam pengembangan
sistem.
Kami berharap dengan adanya modul praktikum ini dapat menambah pengetahuan
dan pengalaman bagi penulis khususnya dan bagi mahasiswa/i pada umumnya. Kami
menyadari modul praktikum ini masih banyak sekali kekurangan, oleh karena itu kami
sangat memerlukan kritik dan saran atas modul ini untuk pengembangan dan
perbaikan modul ini kedepannya.
Akhir kata, kami mengucapkan terima kasih kepada Bapak Dr. Mochamad Wahyudi,
MM, M.Kom, M.Pd selaku Rektor Universitas Bina Sarana Informatika beserta jajaran
rektorat, Adi Supriyatna, M.Kom selaku ketua program studi Sistem Informasi
Akuntansi (D3) dan rekan-rekan dosen Unit Pengembangan Akademik program studi
Sistem Informasi Akuntansi yang telah memberikan kesempatan kepada kami dalam
penyusunan dan pengembangan modul praktikum ini.
Jakarta, Juli 2021
Tim Penulis
Daftar Isi
Kata Pengantar .................................................................................................................................... i
Daftar Isi................................................................................................................................................ ii
PERTEMUAN 1
Pengenalan Laravel, Instalasi & Konfigurasi, Struktur Navigasi ....................................................1
PERTEMUAN 2
Konsep Model, View, Controller & HTML (HyperText Markup Language) .................................18
PERTEMUAN 3
PHP (Hypertext Preprocessor), Variabel, Tipe Data, Operator ....................................................35
PERTEMUAN 4
Form Processing..................................................................................................................................49
PERTEMUAN 5
Basis Data, Migration dan Seeding ..................................................................................................68
PERTEMUAN 6
Create Read Update Delete (CRUD) Form .....................................................................................76
PERTEMUAN 7
Review dan Latihan .............................................................................................................................94
PERTEMUAN 9
Project Baru, Login dan Home Admin ..............................................................................................95
PERTEMUAN 10
Pembuatan Tabel dan Form Master ...............................................................................................110
PERTEMUAN 11
Form Kas Keluar dan Buku Besar ..................................................................................................130
PERTEMUAN 12
Laporan & Menu Navigasi ................................................................................................................142
PERTEMUAN 13
Review dan Pembahasan Tugas ....................................................................................................155
PERTEMUAN 14 & 15
Presentasi Tugas Kelompok ............................................................................................................156
Daftar Pustaka ..................................................................................................................................157
Tim Penyusun Modul
1. Adi Supriyatna, M.Kom

2. Rifky Permana, M.Kom
3. Ahmad Fauzi, M.Kom
MODUL PRAKTIKUM PEMROGRAMAN AKUNTANSI I
PERTEMUAN 1
Pengenalan Laravel, Instalasi & Konfigurasi, Struktur Navigasi
1.1. Pengenalan Laravel
Laravel adalah sebuah kerangka kerja (Framewok) pemrograman PHP dengan kode terbuka
(Open Source) dengan konsep desain Model View Controller(MVC) yang digunakan untuk
mengembangkan sistem informasi berbasis website. Laravel merupakan salah satu framework
PHP yang sangat populer di tahun 2018 diikuti oleh beberapa framework lain seperti Symfony,
CodeIgniter, CakePHP maupun Zend. Hal tersebut dapat dibuktikan berdasarkan Google
Trends, seperti yang terlihat pada gambar dibawah ini.
Sumber: https://trends.google.com/trends/explore?q=laravel,Symfony,%2Fm%2F02qgdkj,CakePHP,Zend
Penggunaan Laravel bertujuan untuk meningkatkan kualitas perangkat lunak dengan

mengurangi biaya pengembangan awal dan biaya pemeliharaan, serta untuk meningkatkan
pengalaman bekerja dengan aplikasi yang menyediakan sintaks yang ekspresif, jelas dan
menghemat waktu
1.1.1. Sejarah Laravel

Laravel merupakan proyek open source yang dirintis oleh Taylor Otwell pada April 2011
bertujuan untuk mengembangkan aplikasi berbasis web dengan arsitektur MVC (Model-View-
Controller). Beberapa fitur laravel antara lain desain yang modular, beberapa cara untuk
mengakses database yang memudahkan developer dalam pengembangan maupun
maintenance. Semua itu mengarah kepada sintaks yang pendek dan mudah dipahami
(syntactic sugar). Fitur-fitur tersebut akan kita bahas lebih detil di bahasan Fitur. Laravel
awalnya dibuat oleh Taylor Otwell untuk menyediakan framework alternatif yang lebih canggih
dibandingkan CodeIgniter, saat itu Codeigniter tidak memiliki beberapa fitur penting, seperti
otentikasi dan otorisasi bawaan. Rilis pertama Laravel dilakukan pada 9 Juni 2011 dengan
versi beta, dan diikuti dengan rilis Laravel 1 pada bulan yang sama.
Sampai akhir tahun 2019 laravel sudah merilis sampai versi 6, tabel dibawah ini menunjukkan
perkembangan sejarah Laravel.
Program Studi Sistem Informasi Akuntansi

1 Fakultas Teknik dan Informatika Universitas Bina Sarana Informarika
Versi: Tanggal rilis Versi: Tanggal rilis
1.0 01 Juni 2011 5.1 LTS 09 Juni 2015

02.00 01 September 2011 05.02 21 Desember 2015
03.00 22 Februari 2012 05.03 23 Agustus 2016
03.01 27 Maret 2012 05.04 24 Januari 2017
03.02 22 Mei 2012 5.5 LTS 30 Agustus 2017
04.00 28 Mei 2013 05.06 07 Februari 2018
04 September
04.01 12 Desember 2013 05.07
2018
04.02 01 Juni 2014 05.08 26 Februari 2019
03 September
05.00 04 Februari 2015 6.0 LTS
2019
1.1.2. Fitur Unggulan Laravel

Laravel memliki beberapa fitur unggulan yang dapat dimanfaatkan oleh pengembang web
dalam membangun sebuah web, antara lain:
a. Bundles.
Sebuah fitur dengan sistem pengemasan modular dan tersedia beragam di aplikasi.
b. Eloquent ORM.
Penerapan PHP lanjutan menyediakan metode internal dari pola active record yang
mengatasi masalah pada hubungan objek basis data.
c. Application Logic.
Merupakan bagian dari aplikasi menggunakan controller atau bagian Route.
d. Reverse Routing.
Mendefinisikan relasi atau hubungan antara Link dan Route.
e. Restful Controllers.
Memisahkan logika dalam melayani HTTP GET dan POST.
f. Class Auto Loading.
Menyediakan loading otomatis untuk class PHP.
g. View Composer.
Kode unit logikal yang dapat dieksekusi ketika view sedang loading.
h. IoC Container.
Memungkinkan objek baru dihasilkan dengan pembalikan controller.
i. Migration.
Penyedia sistem control untuk skema basis data.
j. Unit Testing.
Banyak tes untuk mendeteksi dan mencegar regresi.
k. Automatic Pagination.
Menyederhanakan tugas dari penerapan halaman.
1.2. Arsitektur Laravel

1.2.1. Konsep Model View Controller (MVC)
Model View Controller atau yang sering disebut dengan MVC merupakan sebuah pola yang
sudah teruji dalam pengembangan aplikasi. Pada awalnya MVC digunakan untuk
pengembangan aplikasi berbasis desktop, namun kini MVC sudah banyak digunakan oleh
kerangka kerja atau framework aplikasi berbasis web. Pada proses pengembangan aplikasi
tanpa menggunakan konsep MVC atau biasa disebut dengan istilah Native, pemrogram
cenderung mencampur adukkan kode logika dengan kode tampilan serta kode untuk
mengambil data dari basis data. MVC membagi komponen aplikasi menjadi 3 bagian yang
terpisah namun saling berkaitan, yaitu:

a. Model
Komponen dalam aplikasi yang bertanggung jawab mengelola akses langsung dengan
sumber data dan logika pengelolaan data tersebut. Pada framework Laravel, model
tidak memiliki folder khusus namun bisa menempatkannya pada direktori/folder app
atau direktori lain sesuai kebutuhan.
b. View
Merupakan komponen dalam aplikasi yang bertanggungjawab untuk membuat
tampilan / interface untuk pengguna. Sumber data didapat dari model yang didapatkan
melalui controller. Tidak berinteraksi langsung dengan database. View juga
menangkap interaksi dari pengguna yang akan diteruskan ke aplikasi.
View berfungsi untuk menaruh kode tampilan ke pengguna aplikasi. Pada file view ini
lah diletakkan kode html, css dan javascript bukan di controller, route atau model. File
view bisa mengakses variabel yang dilempar dari controller action. Pada aplikasi
Laravel baru, tersedia satu file view yaitu welcome.blade.php, silahkan dibuka pada
resources/views/welcome.blade.php. File tersebut berisi kode html, css, javascript dan
beberapa sintaks blade. View ditempatkan pada direktori khusus yaitu folder
“resources/views”
c. Controller
Merupakan komponen dalam aplikasi yang bertanggungjawab untuk menerima input
dan memberikan output, atau dalam dunia web kita lebih mengenal dengan istilah
request dan response. Controller bertugas untuk menerima request, kemudian
memprosesnya dengan memberikan response baik berupa data atau view berisi data
dari model. Controller ditempatkan pada direktori khusus yaitu folder
“app/Http/Controllers”

Penjelasan:
Pengguna dapat mengakses aplikasi web melalui route terentu, Route tersebut oleh aplikasi
sudah dipetakan ke controller action dengan menggunakan model untuk mengakses data atau
dapat langsung mengembalikan view tanpa data. Model dapat berinteraksi ke basis data untuk
mendapatkan data atau menyimpan data, setelah berhasil mendapatkan data melalui model,
controller akan mengembalikan sebuah view sekaligus data jika melakukan permintaan data.
Kemudian view tersebut yang dapat dilihat oleh pengguna.
1.3. Instalasi dan Konfigurasi
Sebelum menggunakan Laravel harus disiapkan terlebih dahulu lingkungan kerja dalam
membangun aplikasi kemudian membuat project Laravel baru dan melakukan pengaturan
awal terhadap project yang akan dibangun. Software yang akan digunakan dalam pembuatan
aplikasi berbasis web dengan Laravel antara lain:
a. Xampp 7.3.8 atau versi diatasnya.
Xampp dapat diunduh dari laman https://www.apachefriends.org/index.html
b. Command Prompt (cmd) / Cmder;
Cmder versi full dapat diunduh dari laman https://cmder.net
c. Composer;
Composer dapat diunduh dari laman https://getcomposer.org/Composer-Setup.exe
d. Editor → Notepad++, Sublime Text, Visual Studio Code, Atom Editor, Dll.
Visual Studio Code dapat diunduh dari laman https://code.visualstudio.com/download
Sublime Text dapat diunduh dari laman https://www.sublimetext.com/3
Atom Text Editor dapat diunduh dari laman https://atom.io/
Notepad++ dapat diunduh dari laman https://notepad-plus-plus.org/downloads/

1.3.1. Instalasi Xampp
XAMPP merupakan “sebuah tool yang menyediakan beberapa paket perangkat lunak ke
dalam satu buah paket”. Dengan menginstal XAMPP, Anda tidak perlu lagi melakukan instalasi
dan konfigurasu web server Apache, PHP dan MySQL secara manual. XAMPP akan
menginstalasi dan mengonfigurasinya secara otomatis untuk anda. Berikut cara menginstal
Xampp :
1. Doubleclick atau buka Xampp yang sudah diunduh. Versi yang digunakan adalah versi 7.3.8
atau versi diatasnya.
Jika tampil warning/peringatan pemasangan seperti gambar dibawah ini. Tekan Ok.
2. Berikutnya akan muncul jendela Welcome to the XAMPP Setup Wizard, maka klik tombol
“Next”.

3. Selanjutnya Anda akan diminta untuk memilih komponen yang mau diinstal. Centang saja
semua pilihan dan klik tombol “Next”.
4. Kemudian Anda akan diminta untuk menentukan lokasi folder penyimpanan file-file dan
folder XAMPP. Secara default akan diarahkan ke lokasi c:\xampp. Disarankan tetap
ditempatkan di folder C:\xampp.
5. Tunggu beberapa menit hingga proses intalasi selesai.

6. Setelah proses pemasangan selesai, akan muncul pemberitahuan untuk langsung

menjalankan control panel, jika setuju checklist bidang yang disediakan, jika tidak uncheck
bidangnya. Kemudian klik Finish.
7. Proses instalasi sudah selesai kemudian muncul jendela Xampp Control Panel. Klik Start
pada module Apache untuk menjalankan service apache nya dan klik start pada module
MySQL untuk menjalankan service MySQL nya. Seperti gambar dibawah ini.
1.3.2. Instalasi Composer

Composer adalah perangkat/software untuk mengelola dependensi di PHP. Composer
mengijinkan Anda untuk menginstall dan mengelola modul-modul yang dibutuhkan dalam
proses pengembangan aplikasi berbasis website. Berikut ini cara instalasi software Composer
di sistem operasi windows.
1. Klik dua kali pada file Compose-Setup.exe yang sudah berhasil diunduh. Kemudian
muncul jendela konfirmasi. Klik Next untuk melakukan instalasi.

2. Composer akan meminta lokasi file PHP berada. Biasanya ada dalam folder
C:\XAMPP\php\php.exe. Klik Browse untuk mencari file PHP yang sudah diinstall saat
menginstall XAMPP. Klik Next.
3. Muncul jendela review System Path. Jika sudah sesuai klik Install.
4. Tunggu beberapa saat sampai proses instalasi selesai. Kemudian tampil jendela
informasi klik Next sehingga tampil jendela Completing Composer Setup, Klik Finish.

5. Untuk memastikan bahwa Composer sudah terinstall, bisa dilakukan dengan

menggunakan Command Prompt.
a. Buka Command Prompt.
b. Ketik perintah composer
c. Jika tampilan pada command prompt sudah seperti gambar dibawah ini, artinya
software composer sudah berhasil terpasang.
d. Ketik exit pada commandprompt untuk menutup commandprompt.

1.4. Memulai Project Laravel.

Dalam pembuatan project baru pada framework Laravel dilakukan dengan menggunakan
terminal(command prompt/cmder).
1.4.1. Masuk ke Workspace
Workspace merupakan area kerja dimana project Laravel yang akan dibangun, lokasi
foldernya mengarah ke direktori “C:\xampp\htdocs”. Oleh karena itu kita harus masuk
terlebih dahulu ke workspace tersebut melalui terminal.
a. Buka terminal (Command prompt/Cmder).
b. Ketikkan perintan → cd C:\xampp\htdocs
c. Jika berhasil maka direktori path pada terminal akan berubah.
1.4.2. Unduh Laravel Installer

Untuk membuat project Laravel pertama kali, pemrogram wajib mengunduh Laravel installer
dengan memanfaatkan aplikasi Composer yang sudah dipasang. Caranya ketik perintah
dibawah ini pada terminal.
Kemudian Composer akan melakukan instalasi Laravel pada PC/komputer kita seperti gambar
dibawah ini.
Catatan: Proses ini hanya dilakukan satu kali pada saat pertama membangun project Laravel,
untuk berikutnya proses ini tidak perlu dilakukan kembali.

1.4.3. Membuat aplikasi Laravel baru

Setelah berhasil mengunduh Laravel installer tahap berikutnya adalah membuat aplikasi
Laravel baru, sama halnya seperti tahapan sebelumnya, dalam membuat aplikasi Laravel baru
dengan menggunakan terminal dengan memasukkan perintah dibawah ini.
composer create-project --prefer-dist laravel/laravel="^7.0" NamaProject
Contoh
composer create-project --prefer-dist laravel/laravel="^7.0" LaravelSIA
Composer akan melakukan pembuatan aplikasi baru dengan nama laravelSIA pada direktori
C:\xampp\htdocs, seperti gambar dibawah ini.
Jika proses pembuatan aplikasi Laravel baru berhasil, pada terminal akan muncul notifikasi
“Application ready! Building something amazing.” Seperti gambar dibawah ini.
Setelah berhasil kemudian kita masuk ke direktori aplikasi baru yang terlah dibuat melalui
terminal, dengan memasukkan perintah “cd NamaAplikasi” contoh “cd laravelSIA” sehingga

path direktori pada terminal berubah menjadi “C:\xampp\htdocs\laravelSIA” seperti gambar

dibawah ini.
Tahap berikutnya lakukan instalasi dependency pada project yang akan dikembangkan
dengan memasukkan perintah “composer install” pada terminal.
Untuk membuka aplikasi Laravel yang telah dibuat, dapat dilakukan dengan memasukkan
perintah “php artisan serve” pada terminal, kemudian masukkan url http://127.0.0.1:8000
atau http://localhost:8000 pada web browser, maka akan tampil halaman homepage seperti
gambar dibawah ini.
1.5. ROUTE
Route merupakan rute atau jalur dalam mengeksekusi program. Route pada framework
Laravel diatur dalam folder routes, sehingga route pada Laravel adalah bagian yang mengatur

rute pada project aplikasi yang dibangun. Route yang didefinisikan akan menggunakan atau
memanggil action tertentu dari sebuah controller.
Terdapat empat jenis route yang terdapat pada Laravel, yaitu:

a. Web Route.
Web route digunakan untuk memberikan akses yang dapat diakses melalui HTTP
request dan merupakan route yang paling sering digunakan dan kita akan banyak
memanfaatkannya. Pada bab pengenalan routing web route ini yang kita bahas, dan
di bab ini pun kita akan fokus untuk membahas web route disamping API route. Definisi
web route terletak pada routes/web.php
b. API Route.
API route ini mirip dengan web route yaitu sama-sama bisa diakses menggunakan
HTTP request. Lalu kenapa mesti dibedakan antara web route dan api route? Itu
karena perlakuan untuk mereka memang perlu dibedakan. Contohnya adalah jika kita
menggunakan middleware, maka ada 2 middleware group. Intinya mereka
menggunakan dua middleware yang berbeda sesuai kebijakan kita untuk masing-
masing jenis route tersebut. Definisi web route terletak pada routes/api.php
c. Console Route.
Console route kita gunakan untuk mendefinisikan jalur akses ke aplikasi kita melalui
Command Line. Berbeda dengan web route atau api route yang diakses melalui HTTP
request, kita bisa menjalankan perintah-perintah tertentu melalui command-line-
interface. Definisi web route terletak pada routes/console.php
d. Channel Route.
Channel route berfungsi untuk mengotorisasi chanel broadcast di aplikasi kita. Berbeda
dengan tiga route sebelumnya di mana callback digunakan untuk logika kode dan bisa
menghasilkan view atau data, callback di channel route ini berfungsi untuk mengeck
apakah user aktif berhak mengakses channel tertentu. Definisi web route terletak pada
routes/channel.php
Mendefinisikan route - Buka file routes/web.php lalu tambahkan kode berikut,
Route::get('/hello', function () {
return "Hai, Selamat datang di pemrograman web dengan Framework Laravel.";
});
Simpan update file web.php tersebut kemudian akses melalui web browser
http://localhost:8000/hello, maka akan tampil halaman seperti gambar dibawah ini.

1.6. Controller
Controller merupakan penghubung antara view dan model atau bisa dikatakan juga sebagai
pengatur view dan model. Pada dasarnya controller hanya sebuah class yang meng-extends
class controller, hal pertama yang dilakukan oleh controller adalah mengambil permintaan,
memparsing permintaan, menginisialisasi, memanggil model kemudian mengambil responnya
dan mengirimkannya ke View. File controller yang dibentuk disimpan pada direktori
“App\Http\Controllers”
Untuk memahami penggunaan controller akan lebih mudah jika melihat anatomi dari controller,
anatomi paling dasar agar dapat menggunakan controller adalah action karena controller wajib
memiliki action. Anatomi controller kosong yang belum dapat digunakan, seperti gambar
dibawah ini.
Untuk membuat file controller tidak perlu menuliskan kode baru, namun bisa dibuat
menggunakan perintah artisan. Perintah membuat controller harus dituliskan dengan format:
“php artisan make:controller NamaController”.
Contoh: Buat sebuah controller dengan nama DasarController.
Jika berhasil maka akan muncul notifikasi seperti gambar dibawah ini.
Hasil dari perintah tersebut akan terbentuk satu file baru dengan nama DasarController.php
yang disimpan pada direktori “App\Http\Controllers”.

Latihan Route dan Controller

Buat sebuah fungsi untuk menampilkan teks di web browser pada file DasarController.php
dengan kode dibawah ini:
public function index()

{
return "Kita sedang belajar tentang controller laravel.";
}
Untuk mengakses controller tersebut dilakukan melalui routing, maka ubah route web.php
dengan menambahkan kode berikut:
Route::get('home', 'DasarController@index');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/home, seperti
gambar dibawah ini.
1.5. Struktur Navigasi

Struktur Navigasi adalah “Susunan menu atau hirarki dari suatu situs yang menggambarkan
isi dari setiap halaman dan link atau navigasi tiap halaman pada suatu situs web”. Struktur
Navigasi dapat dikatakan sebagai penggambar dari hubungan atau rantai kerja dari seluruh
elemen yang akan digunakan dalam aplikasi.
Struktur Navigasi dapat digolongkan menurut kebutuhan akan objek, kemudahan pemakaian,
keinteraktifitasannya, dan kemudahan membuatnya yang berpengaruh terhadap waktu
pembuatan suatu situs web. Dalam penggambarannya Struktur Navigasi terbagi kedalam 4
Struktur yang berbeda yaitu: Linier, Non Linier, Hierarchical (Hirarki) dan Composit
(Campuran).
Ada 4 macam bentuk dasar dari peta navigasi yang biasa digunakan dalam proses pembuatan
aplikasi multimedia, yaitu:

1. Struktur Navigasi Linier

Struktur navigasi linier hanya mempunyai satu rangkaian cerita yang berurut, yang
menampilkan satu demi satu tampilan layar secara berurut menurut urutannya. Tampilan yang
dapat ditampilkan pada sruktur jenis ini adalah satu halaman sebelumnya atau satu halaman
sesudahnya, tidak dapat dua halaman sebelumnya atau dua halaman sesudahnya.
Contoh :
2. Struktur Navigasi Hirarki

Struktur navigasi hirarki biasa disebut struktur bercabang, merupakan suatu struktur yang
mengandalkan percabangan untuk menampilkan data berdasarkan kriteria tertentu.
Tampilan pada menu pertama akan disebut sebagai Master Page (halaman utama
pertama), halaman utama ini mempunyai halaman percabangan yang disebut Slave Page
(halaman pendukung). Jika salah satu halaman pendukung dipilih atau diaktifkan, maka
tampilan tersebut akan bernama Master Page (halaman utama kedua), dan seterusnya. Pada
struktur navigasi ini tidak diperkenankan adanya tampilan secara linier.
Contoh :

3. Struktur Navigasi Non-Linier

Struktur navigasi non-linier atau struktur tidak berurut merupakan pengembangan dari
struktur navigasi linier. Pada struktur ini diperkenankan membuat navigasi
bercabang. Percabangan yang dibuat pada struktur nonlinier ini berbeda dengan percabangan
pada struktur hirarki, karena pada percabangan nonlinier ini walaupun terdapat percabangan,
tetapi tiap-tiap tampilan mempunyai kedudukan yang sama yaitu tidak ada Master Page dan
Slave Page.
Contoh :
4. Struktur Navigasi Campuran

Struktur navigasi campuran merupakan gabungan dari ketiga struktur sebelumnya yaitu linier,
non-linier dan hirarki. Struktur navigasi ini juga biasa disebut dengan struktur navigasi
bebas. Struktur navigasi ini banyak digunakan dalam pembuatan website karena struktur ini
dapat digunakan dalam pembuatan website sehingga dapat memberikan ke-interaksian yang
lebih tinggi.

Contoh :
PERTEMUAN 2
Konsep Model, View, Controller & HTML (HyperText Markup
Language)
Konsepsi MVC atau Model View Controller terdapat berbagai framework pemrograman baik
berbasis desktop atau web, salah satunya adalah dalam pemrograman berbasis web yaitu
framework Laravel. Pada pembahasan ini akan dijelaskan tentang konsep Model View
Controller, cara pembuatan, dan penggunaan file pada Laravel.
2.1. Model
Model merupakan bagian dari MVC yang berfungsi sebagai penghubung dengan basis data
atau bisa dikatakan juga bahwa model adalah penghubung setiap alur program yang
berinteraksi dengan data dalam basis data.
1. Membuat model.
Untuk membuat model dapat dilakukan dengan menggunakan perintah php artisan
dalam terminal (commandprompt, cmder, dsb.), format penulisan perintah dalam
pembuatan model adalah seperti dibawah ini.
php artisan make:model NamaModel
Pada penentuan atau konvensi nama model harus dibuat dengan huruf pertama
menggunakan kapital misalnya Mahasiswa, jika lebih dari satu kata maka ditulis seperti
ini DataMahasiswa, namun alangkah baiknya penamaan sebuah model cukup
menggunakan satu kata saja. Untuk mempermudah dalam proses pengembangan, nama

model sebaiknya disamakan dengan nama tabel. Sebagai contoh buat model dengan
nama mahasiswa, maka perintah yang di ketik dan dijalankan pada terminal adalah
seperti dibawah ini.
php artisan make:model Mahasiswa
Jika perintah itu berhasil dijalankan maka akan tampil notifikasi seperti gambar dibawah
ini.
Hasil kompilasi dari perintah tersebut adalah akan membentuk sebuah file dengan nama
Mahasiswa.php yang tersimpan pada folder “app\” seperti gambar dibawah ini.
File Mahasiswa.php tersebut berisi kode seperti ini.
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Mahasiswa extends Model

{
//
}
2. Penggunaan Model
Penggunaan atau pemanggilan model dilakukan saat berinteraksi dengan basis data, baik
pada saat menampilkan, menambahkan, mengubah dan menghapus data pada basis
data, pada Laravel proses tersebut tersimpan dalam satu file Controller, oleh karena itu
penggunaan model salah satunya dilakukan dengan cara pemanggilan class model yang
ditambahkan pada kode dalam file Controller seperti kode dibawah ini.
$mhs = \App\Mahasiswa::All();

Kode tersebut digunakan untuk membuat variabel baru dengan nama msh sebagai
pengganti class Mahasiswa atau dengan kata lain variabel mhs akan mewakili tabel
mahasiswa.
2.2. View
View merupakan bagian dari MVC yang bertugas untuk menangani tampilan user interface,
segala sesuatu yang akan tampil pada web akan dibuat pada view. Konsep view pada Laravel
berhubungan erat dengan route yang sudah dijelaskan pada pembahasan sebelumnya. Ada
yang berbeda pada penamaan file di Laravel yaitu setiap nama file yang merupakan view atau
tampilan dari website menggunakan blade.php yang ditempatkan pada direktori
resources/views. Blade pada Laravel adalah salah satu fitur yang digunakan untuk
menampilkan output dari view yang sintaksnya sangat mudah dipelajari dan digunakan. Blade
merupakan template engine yang sangat simple dan powerfull yang disediakan oleh Laravel.
Blade mendukung semua fungsi utama PHP seperti perulangan dan pengkondisian: @for,
@foreach, @while, @if, dan @elseif. Sehingga ini akan membantu Anda untuk tidak perlu
membuat tag pembuka dan tag penutup PHP. Keuntungan utama menggunakan Blade
Templates adalah kita dapat mengatur master template dan master template ini dapat
dipergunakan oleh halaman lainnya.
1. Pembuatan View.
Tidak seperti pembuatan Model, membuat view tidak dilakukan menggunakan php artisan
melalui terminal, namun cukup dengan membuat file baru pada folder “Resources\views”
dengan nama file berbentuk .blade.php, sebagai contoh buat sebuah tampilan yang berisi
teks “Selamat Datang, Sekarang Kami Sedang Belajar Framework Laravel” kemudian
disimpan dengan nama halo.blade.php. kodenya adalah sebagai berikut:
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
Selamat Datang, Sekarang Kami Sedang Belajar Framework Laravel
</body>
</html>
2. Penggunaan View
Untuk menampilkan hasil dari kompilasi file view dapat dilakukan menggunakan route,
view dan route merupakan sesuatu yang paling mendasar yang harus dipahami dalam
menggunakan framework Laravel. Sebagai contoh untuk melihat tampilan dari file
halo.blade.php maka harus ditambahkan perintah route pada file web.php yang tersimpan
pada folder “routes\”, tuliskan kode seperti dibawah ini.
Route::get('/halo', function () {
return view('halo');
});
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/halo,
seperti gambar dibawah ini.

2.3. Controller.
Controller merupakan bagian yang menjembatani model dan view. Controller berisi perintah-
perintah yang berfungsi untuk memproses suatu data dan mengirimkannya ke halaman web.
Controller hanya sebuah class yang mengextends class Controller, akan tetapi akan lebih
mudah jika dapat melihat anatomi dari controller ini. Anatomi paling dasar agar kita bisa
menggunakan controller hanyalah action.
1. Pembuatan Controller
Sama seperti model, Untuk membuat Controller dapat dilakukan dengan menggunakan
perintah php artisan dalam terminal (commandprompt, cmder, dsb.), format penulisan
perintah dalam pembuatan Controller adalah seperti dibawah ini.
php artisan make:controller NamaController
Konsep penamaan controller sama seperti penamaan model dengan menggunakan huruf
kapital diawal nama controller dan diikuti dengan penyebutan controller. Sebagai contoh
buat controller dengan nama LatihanController, maka perintah yang di ketik dan
dijalankan pada terminal adalah seperti dibawah ini.
php artisan make:controller LatihanController

Jika perintah itu berhasil dijalankan maka akan tampil notifikasi seperti gambar dibawah
ini.
Hasil kompilasi dari perintah tersebut adalah akan membentuk sebuah file dengan nama
LatihanController.php yang tersimpan pada folder “app\Http\Controllers” seperti gambar
dibawah ini.
File LatihanController.php tersebut berisi kode seperti ini.

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class LatihanController extends Controller

{
//
}
Kode diatas merupakan definisi class LatihanController, karena controller tersebut tidak
memiliki action apapun maka controller tersebut belum bisa digunakan. Agar kita bisa
mulai memanfaatkannya harus ditambahkan action didalam class LatihanController
tersebut.
2. Penggunaan Controller.
Penggunaan controller pada laravel biasa dilakukan dengan pemanggilan class yang
dimasukkan pada routes, berikut ini contoh penggunaan controller dengan menambahkan
kode pada file web.php.
Route::get('home', 'LatihanController@index');
Kode diatas menjelaskan ketika mengakses localhost:8000/home maka akan diarahkan

ke perintah yang dituliskan pada function indeks di LatihanController.
2.4. HTML (HyperText Markup Language)

2.4.1. Tentang HTML
HyperText Markup Language (HTML) adalah bahasa inti untuk hampir seluruh konten Web.
Apa yang Anda lihat di layar browser Anda hampir semuanya bisa dideskripsikan, secara
fundamental, menggunakan HTML. Lebih tepatnya, HTML adalah bahasa yang
mendeskripsikan struktur dan nilai semantik konten dari dokumen Web. Berbagai macam
teknologi (seperti CSS, JavaScript, Flash, AJAX, JSON) dapat digunakan untuk
mendefinisikan elemen dari sebuah halama web. Akan tetapi, pada level paling rendah,
sebuah halaman web didefinisikan dengan menggunakan HTML (HyperText Markup
Language). Tanpa HTML maka tidak akan ada halaman web.
Sejarah singkat HTML
Di akhir tahun 1980an, Tim Berners-Lee bekerja sebagai seorang physicist di CERN (Sebuah
Organisasi untuk research nuklir di eropa). Beliau merancang sebuah jalan bagi para scientis
untuk berbagi dokumen melalui internet. Sebelum invensi ini, komunikasi melalui internet
hanya terbatas pada dokumen teks biasa menggunakan beberapa teknologi seperti email,,
FTP (File Transfer Protocol), dan Panel diskusi berbasis Usenet. Invensi dari HTML
memanfaatkan model dan konten yang disimpan dalam server pusat yang dapat ditransfer
dan ditampilkan pada workstation lokal melalui browser. Invensi ini menyederhanakan akses
terhadap konten dan memungkinkan untuk menampilkan konten yang "kaya" (seperti
pemformatan teks yang mutakhir dan menampilkan gambar).
Apa itu HTML?
HTML adalah bahasa untuk memarkup (memformat). HTML memberitahu Web Browser
bagaimana cara menampilkan konten. HTML memisahkan "konten" (kata-kata, gambar, audio,
video dan lainnya) dari "Penampilan" (Definisi dari tipe konten dan instruksi bagaimana tipe
konten tersebut harus ditampilkan). HTML menggunakan beberapa elemen yang telah
didefinisikan untuk mengidentifikasi tipe-tipe konten. Element-elemen memiliki satu atau lebih

"tag" yang memiliki atau mengekspresikan konten. Tatag diawali dan diakhiri dengan kurung
siku, dan tag "penutup" (tag yang menandakan akhir dari konten) diawali dengan garis miring.
Sebagai contoh, elemen paragraf terdiri dari tag pembuka "<p>" dan tag penutup "</p>" –
tanpa tanda kutip. Contoh berikut menampilkan sebuah paragraf yang terdapat dalam elemen
paragraf HTML:
<p>Ini adalah contoh tag html paragraf</p>
Struktur Dasar HTML

Elemen HTML dimulai dengan tag awal, yang diikuti dengan isi elemen dan tag akhir. Tag
berakhir termasuksimbol / diikuti oleh tipe elemen, misalnya
</HEAD>. Sebuah elemen HTML dapat bersarang di dalam elemen lainnya. Sebuah dokumen
HTML standar terlihat seperti ini :
<html>
<head>
<title>Judul Halaman Web</title>
</head>
<body>
</body>
</html>
Keterangan :
1. Tag HTML secara default dimulai dari <HTML> dan diakhiri dengan </HTML>.
2. Tag <HEAD> … </HEAD> merupakan tag kepala sebelum badan. Tag kepala ini akan
terlebih dulu dieksekusi sebelum tag badan. Di dalam tag ini berisi tag <META> dan
<TITLE>. Tag <META> merupakan informasi atau header suatu dokumen HTML. Atribut
yang dimiliki oleh tag ini antara lain:
a. HTTP_EQUIV, atribut ini berfungsi untuk menampilkan dokumen HTML secara
otomatis dalam jangka waktu tertentu.
b. CONTENT, atribut ini berisi informasi tentang isi document HTML yang akan dipanggil
c. NAME, atribut ini merupakan identifikasi dari meta itu sendiri. Tag <META> dalam
suatu document HTML boleh ada maupun tidak.
3. Tag <TITLE> … </TITLE> adalah tag judul. Sebaiknya setiap halaman web memiliki judul,
dan judul tersebut dituliskan di dalam <TITLE> … </TITLE>. Judul ini akan muncul dalam
titlebar dari browser.
4. Tag <BODY> … </BODY> adalah tag berisi content dari suatu halaman web.
2.4.2. Penerapan Script HTML pada Laravel

Buat file baru dengan nama awal.blade.php dan simpan pada folder resources/views sehingga
muncul file baru seperti dibawah ini.

Ketikkan kode berikut ini pada file awal.blade.php kemudian disimpan.
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
Selamat Datang di Pemrograman PHP dengan Framework Laravel!
</body>
</html>
Ubah file DasarController.php dengan menambahkan kode berikut ini kemudian disimpan:
public function depan()

{
return view('awal');
}
Ubah Route pada file web.php dengan menambahkan kode berikut ini kemudian disimpan:
Route::get('depan', 'DasarController@depan');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/depan, seperti
gambar dibawah ini.
Komentar
HTML memiliki mekanisme untuk penyertaan komentar yang tidak ditampilkan ketika halaman
diproses dalam browser. Komentar ini berguna untuk menjelaskan beberapa bagian dalam
markup, atau meninggalkan catatan untuk orang lain yang mungkin juga bekerja dalam
halaman tersebut atau meninggalkan pengingat untuk Anda sendiri. Komentar HTML dibuat
dengan menyertakan simbol seperti berikut:

2.4.3. Tag dalam HTML

1. Tag Heading
Heading adalah sekumpulan kata yang dijadikan judul atau subjudul dalam konten halaman
web, dan html menyediakan enam tingkatan: <h1>, <h2>, <h3>, … <h6>.
Buat file kode baru dengan nama heading.blade.php dan simpan pada folder
resources/views, kemudian ketikkan kode berikut ini.

<!DOCTYPE html>
<html>
<head>
<title>Tag Heading</title>
</head>
<body>
<h1>Selamat Datang di Pemrograman PHP dengan Framework Laravel!</h1>
</body>
</html>
public function heading()

{
return view('heading');
}
Route::get('heading', 'DasarController@heading');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/heading, seperti
gambar dibawah ini.
2. Tag Paragraf
Untuk membuat paragraf digunakan tag <p> …isi paragraph… </p>, untuk mengatur
posisi dari paragraf dengan atribut align dengan nilai atribut: left, center, justify, dan
right.
Buat file kode baru dengan nama paragraf.blade.php dan simpan pada folder

<!DOCTYPE html>
<html>
<head>
<title>Tag Paragraf</title>
</head>
<body>
<p align="left">Selamat Datang di Pemrograman PHP dengan Framework La
ravel!</p>
<p align="center">Selamat Datang di Pemrograman PHP dengan Framework
Laravel!</p>
<p align="right">Selamat Datang di Pemrograman PHP dengan Framework L
aravel!</p>
<marquee>Selamat Datang di Pemrograman PHP dengan Framework Laravel!<
/marquee>
</body>
</html>
public function paragraf()

{
return view('paragraf');
}
Route::get('paragraf', 'DasarController@paragraf');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/paragraf,
3. Tag List
Dalam HTML, tag list terdiri dari 2 jenis, ordered list (berurutan) dan unordered list (tidak
berurutan). Ordered list akan ditampilkan dengan angka atau huruf, sedangkan unordered list
dengan bulatan atau kotak.
Ordered list menggunakan tag <ol>, dan unordered list menggunakan tag <ul>, sedangkan
untuk list sendiri menggunakan tag <li>.
Buat file kode baru dengan nama list.blade.php dan simpan pada folder resources/views,
kemudian ketikkan kode berikut ini.
<!DOCTYPE html>
<html>

<head>
<title>Tag List</title>
</head>
<body>
<h2>Daftar Program Studi Fakultas Teknik & Informatika</h2>
<ol>
<li>Sistem Informasi Akuntansi</li>
<li>Sistem Informasi</li>
<li>Teknologi Komputer</li>
<li>Ilmu Komputer</li>
<li>Rekayasa Perangkat Lunak</li>
<li>Teknologi Informasi</li>
<li>Teknik Elektro</li>
<li>Teknik Industri</li>
</ol>
</body>
</html>
public function list()

{
return view('list');
}
Route::get('list', 'DasarController@list');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/list, seperti
gambar dibawah ini.

4. Tag Table
Untuk membuat tabel di HTML, kita membutuhkan setidaknya 3 tag, yaitu tag <table>, <tr>,
dan <td>:
• Tag <table> digunakan untuk memulai tabel
• Tag <th> adalah singkatan dari table head, digunakan untuk membuat label dari tabel.
• Tag <tr> adalah singkatan dari table row, digunakan untuk membuat baris dari tabel.
• Tag <td> adalah singkatan dari table data (kolom), digunakan untuk menginput data
ke tabel.
Agar lebih jelas, kita akan langsung menggunakan contoh kode HTML:
Buat file kode baru dengan nama tabel.blade.php dan simpan pada folder resources/views,
<!DOCTYPE html>
<html>
<head>
<title>Tag Pembuatan Tabel</title>
</head>
<body>
<table border="1" align="center">
<tr>
<td colspan="3" align="center"><h3>TABEL</h3></td>
</tr>
<tr>
<td>Kolom 1 Baris 1</td><td>Kolom 2 Baris 1</td><td>Kolom 3 B
aris 1</td>
</tr>
<tr>
aris 2</td>
</tr>
<tr>
aris 3</td>
</tr>
<tr>
aris 4</td>
</tr>
</table>
</body>
</html>
public function tabel()

{
return view('tabel');
}

Route::get('tabel', 'DasarController@tabel');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/tabel, seperti
gambar dibawah ini.
Buat file kode baru dengan nama tabel_2.blade.php dan simpan pada folder resources/views,
<!DOCTYPE html>
<html>
<head>
<title>Data Mahasiswa</title>
</head>
<body bgcolor="green">
<h2 align="center">TABEL DATA MAHASISWA</h2>
<table border="1" align="center" bgcolor="pink">
<tr>
<th>NIM</th><th>NAMA</th><th>ALAMAT</th><th>TELP</th><th>TTL<
/th>
</tr>
<tr>
<td>12106773</td>
<td>Yudhistira</td>
<td>Jl. Perumnas 1 Tangerang</td>
<td>089755767565</td>
<td>Padang, 15 Agustus 1990</td>
</tr>
<tr>
<td>1210899</td>
<td>Adi Supriyatna</td>
<td>Jl. Raya Jatiwaringin No.8</td>
<td>085697613939</td>
<td>Jakarta, 17 Oktober 1985</td>
</tr>
<tr>
<td>1210893</td>

<td>Putri Rahmawati</td>
<td>Jl. Raya Kramat No. 98</td>
<td>085645612342</td>
<td>Jakarta, 20 Oktober 1986</td>
</tr>
</table>
</body>
</html>
public function tabel2()

{
return view('tabel_2');
}
Route::get('tabel2', 'DasarController@tabel2');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/tabel2, seperti
gambar dibawah ini.
5. Tag Link
Tujuan kata Hypertext dari HTML adalah membuat sebuah text yang ketika di-klik akan pindah
ke halaman lainnya. Link ditulis dengan tag <a> yang merupakan singkatan cari anchor
(jangkar). Setiap tag <a> setidaknya memiliki sebuah atribut href. Dimana href berisi alamat
yang dituju (href adalah singkatan dari hypertext reference).
Buat file kode baru dengan nama link.blade.php dan simpan pada folder resources/views,
<!DOCTYPE html>
<html>
<head>
<title>Tag Link</title>

</head>
<body>
<h1>Belajar Tag Link</h1>
<p>Saya sedang belajar HTML, Klik untuk membuka <a href="http://bsi.a
c.id" target="_blank">Ruang Mahasiswa UBSI</a></p>
</body>
</html>
public function link()

{
return view('link');
}
Route::get('link', 'DasarController@link');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/link, seperti
gambar dibawah ini.
6. Tag Image
img menunjukkan image yang berarti gambar dan oleh karenanya digunakan untuk
menyisipkan gambar. Gambar didalam sebuah dokumen HTML tidak dimasukkan sepenuhnya
pada file (.html, misalnya) akan tetapi, hanya merujukkan file sumber gambar tersebut berada
(disimpan). img element, ibarat sebuah rumah atau penampung (container) bagi sebuah file
gambar (picture). Anda dapat memasukkan file gambar seperti .jpg, .gif dan .png didalam
element img dengan merujukkan (link) file gambar tersebut yang di ditulis pada src attribute.
HTML <img> element memiliki beragam attribute yang dapat ditulis sesuai kebutuhan. Akan
tetapi, hanya dua attribute yang wajib ditulis pada setiap <img /> element, yaitu src dan alt
attribute. src attribute menujukkan sumber file tersebut berada, sedangkan alt menujukkan
alternatif text yang akan muncul sebagai pengganti apabila gambar tersebut tidak dapat
ditampilkan. HMTL img element, tidak memiliki tag penutup (end/closing tag), jadi hanya ditulis
<img />.
Catatan: Gambar yang akan dimasukkan pada halaman web harus disimpan dalam direktori
“public” pada project Laravel yang dibangun.
Buat file kode baru dengan nama gambar.blade.php dan simpan pada folder
<!DOCTYPE html>

<html>
<head>
<title>Tag Gambar HTML</title>
</head>
<body bgcolor="aqua">
<h1 align="center">
Program Studi Sistem Informasi Akuntansi<br>
Fakultas Teknologi Informasi<br>
Universitas Bina Sarana Informatika
</h1>
<br>
<p align="center">
<img src="{{ ('BSI_logo.png') }}" width="300">
</p>
</body>
</html>
public function gambar()

{
return view('gambar');
}
Route::get('gambar', 'DasarController@gambar');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/gambar, seperti
gambar dibawah ini.
Berikut rangkuman jenis – jenis tag dalam HTML :


Latihan :
1. Buatlah tampilan seperti dibawah ini :
2. Buatlah tampilan seperti dibawah ini :

PERTEMUAN 3
PHP (Hypertext Preprocessor), Variabel, Tipe Data, Operator
3.1. PHP (Hypertext Preprocessor)
PHP atau Hypertext Prepocessor adalah sebuah bahasa script berbasis server (server-side)
yang mampu mem-parsing kode php dari kode web dengan ekstensi .php, sehingga
menghasilkan tampilan website yang dinamis di sisi client (browser). Dengan PHP, anda bisa
menjadikan halaman HTML menjadi lebih powerful dan bisa dipakai sebagai aplikasi lengkap,
misalnya untuk beragam aplikasi cloud computing. PHP adalah bahasa script yang sangat
cocok untuk pengembangan web dan dapat dimasukkan ke dalam HTML. PHP awalnya
dikembangkan oleh seorang programmer bernama Rasmus Lerdrof pada tahun 1995, namun
semenjak itu selalu dikembangkan oleh kelompokindependen yang disebut Group PHP dan
Kelompok ini juga yang mendefinisikan standar de facto untuk PHP karena tidak ada
spesifikasi formal. Saat ini pengembangannya dipimpin oleh duo maut, Andi Gutmans dan
Zeev Suraski. Yang menyebabkan PHP banyak dipakai oleh banyak orang adalah karena PHP
adalah perangkat lunak bebas (Open Source) yang dirilis di bawah lisensi PHP. Artinya untuk
menggunakan bahasa pemrograman ini gratis, bebas, dan tidak terbuka.
3.1.1 Implementasi Kode PHP

Tidak seperti halaman HTML biasa, kode PHP tidak akan diberikan oleh server secara
langsung ketika ada permintaan dari client (browser), namun melalui pemrosesan dari sisi
server, makanya PHP disebut skrip server-side. Kode PHP dimasukkan ke dalam kode HTML
dengan cara menyelipkannya di dalam kode HTML. Untuk membedakan kode PHP dengan
kode HTML, di depan kode PHP tersebut diberi tag pembuka dan diakhir kode PHP diberi tag
penutup. Dengan adanya kode PHP, sebuah halaman web bisa melakukan banyak hal yang
dinamis, seperti mengakses database, membuat gambar, membaca dan menulis file, dan
sebagainya. Hasil akhir pengolahan kode PHP akan dikembalikan lagi dalam bentuk kode
HTML untuk ditampilkan di browser. Ada 4 jenis tag yang bisa digunakan untuk memasukkan
kode PHP.
Tabel III.1 Jenis-jenis Tag PHP

Jenis Tag Tag Pembuka Tag Penutup

Tag Standar < ? php ?>
Tag Pendek <? ?>
Tag ASP <% %>
Tag Script <script language = “php”> </script>
Yang dapat langsung diterapkan disemua platform adalah tag standard dan tag script.
Di dalam modul ini bahasa pemrograman yang digunakan adalah PHP Versi 7 sehingga jenis
tag yang harus digunakan adalah tag standar. Untuk tag lainnya perlu penyetingan di server
oleh administrator server.
Contoh Script PHP

Buat file kode baru dengan nama php.blade.php dan simpan pada folder resources/views,
<?php
echo"Tetap Semangat Teman-
teman, mulai hari ini kita belajar tentang PHP.<br>";
echo"Ini adalah Script PHP pertama saya lho.";
?>
public function php()

{
return view('php');
}
Route::get('php', 'DasarController@php');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/php, seperti
gambar dibawah ini.
Contoh diatas merupakan contoh script php yang berdiri sendiri tanpa ada tambahan script
yang lain. Perintah echo merupakan perintah yang digunakan untuk mencetak. Script PHP
bisa juga digabung dalam tag HTML.
3.1.2. Perbedaan kode HTML dengan PHP

Terdapat perbedaan khusus dalam proses pengaksesan kode antara HTML dengan PHP,
yaiitu:
➔ HTML dapat diakses langsung tanpa melalui akses server saat ada permintaan dari
client(browser).

➔ PHP harus di akses melalui server saat ada permintaan dari client(browser)
Dari 2 gambar di atas dapatkah anda melihat perbedaannya, tanpa melihat extension nama
filenya?
Ya, untuk file dengan extension html, kita dapat melihat hasilnya langsung di browser, tanpa
harus menjalankan akses server. Namun, untuk file dengan extension php, kita harus
menjalankannya melalui akses server, yaitu localhost, dan penyimpanan filenya pun, disimpan
pada htdocs yang ada di folder xampp.
3.2. Variabel
Dalam pemrograman, variabel adalah suatu lokasi penyimpanan (di dalam memori komputer)
yang berisikan nilai atau informasi yang nilainya tidak diketahui maupun telah diketahui. Dalam
definisi bebasnya, variabel adalah kode program yang digunakan untuk menampung nilai
tertentu. Nilai yang disimpan di dalam variabel selanjutnya dapat dipindahkan ke dalam
database, atau ditampilkan kembali ke pengguna.
Nilai dari variabel dapat di isi dengan informasi yang diinginkan dan dapat diubah nilainya pada
saat kode program sedang berjalan. Sebuah variabel memiliki nama yang digunakan untuk
mengakses nilai dari variabel itu. Jika anda memiliki pengetahuan dasar tentang bahasa
pemrograman, tentunya tidak asing dengan istilah variabel.
Sama seperti variabel dalam bahasa pemrograman lainnya, variabel dalam PHP digunakan
untuk menampung nilai inputan dari user, atau nilai yang kita definisikan sendiri. Namun PHP
memiliki beberapa aturan tentang cara penggunaan dan penulisan variable yaitu:
1. Penulisan variabel harus diawali dengan tanda $.
Variabel ditandai dengan adanya tanda dolar ($) yang kemudian bisa diikuti dengan
angka, huruf, dan underscore. Namun variable tidak bisa mengandung spasi. Berikut
ini contoh pendefinisian variable. Untuk mendefinisikan variable, hanya perlu
menuliskannya maka otomatis variable dikenali oleh PHP.
$nama
$no_telp
$_pekerjaan
2. Variabel dalam PHP bersifat case sensitive.
PHP membedakan variabel yang ditulis dengan huruf besar dan kecil (bersifat case
sensitif), sehingga $belajar tidak sama dengan $Belajar dan $BELAJAR, ketiganya
akan dianggap sebagai variabel yang berbeda. Untuk menghindari kesalahan program
yang dikarenakan salah merujuk variabel, disarankan menggunakan huruf kecil untuk
seluruh nama variabel.
3. Memberikan Nilai kepada variabel.
Sama seperti sebagian besar bahasa pemrograman lainnya, untuk memberikan nilai
kepada sebuah variabel, PHP menggunakan tanda sama dengan (=). Operator “sama
dengan” ini dikenal dengan istilah Assignment Operators. Perintah pemberian nilai
kepada sebuah variabel disebut dengan assignment. Jika variabel tersebut belum

pernah digunakan, dan langsung diberikan nilai awal, maka disebut juga dengan
proses inisialisasi.
4. Variabel dalam PHP tidak memerlukan deklarasi terlebih dahulu.
Jika anda pernah mempelajari bahasa pemrograman desktop seperti Pascal, C, C++,
dan Visual Basic, di dalam bahasa pemrograman tersebut, sebuah variabel harus
dideklarasikan terlebih dahulu sebelum digunakan. Namun di dalam PHP, variabel
tidak perlu deklarasikan terlebih dahulu. Anda bebas membuat variabel baru di tengah-
tengah kode program, dan langsung menggunakannya tanpa di deklarasikan terlebih
dahulu.
5. Varibel dalam PHP tidak bertipe.
Dalam kelompok bahasa pemrograman, PHP termasuk Loosely Type Language, yaitu
jenis bahasa pemrograman yang variabelnya tidak terikat pada sebuah tipe tertentu.
Hal ini berbeda jika dibandingkan dengan bahasa pemrograman desktop seperti
Pascal atau C, dimana jika anda membuat sebuah variabel bertipe integer, maka
variabel itu hanya bisa menampung nilai angka, dan anda tidak akan bisa mengisinya
dengan huruf.
6. Variabel sistem PHP.
Predefined Variables atau terjemahan bebasnya Variabel Sistem PHP, adalah
beberapa variabel yang telah di definisikan secara sistem oleh PHP, dan kita sebaiknya
tidak membuat variabel dengan nama yang sama.
Beberapa contoh Predefined Variables dalam PHP adalah:
$GLOBALS, $_SERVER, $_GET, $_POST, $_FILES, $_COOKIE, $_SESSION,
$_REQUEST, $_ENV, $php_errormsg, $HTTP_RAW_POST_DATA,
$http_response_header, $argc, $argv, $this.
3.2.1. Implementasi Variabel pada Laravel.
Buat file kode baru dengan nama variabel.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Variabel dalam PHP</title>
</head>
<body>
<?php
//Definisikan Variabel
$nim="12170829";
$nama="Selvy Permatahati";
$kelas="11.3A.11";
//Pemanggilan Variabel
echo"Nim Saya : $nim<br>";
echo"Nama Saya : $nama<br>";
echo"Kelas Saya : $kelas<br>";
?>
</body>
</html>

public function variabel()

{
return view('variabel');
}
Route::get('variabel', 'DasarController@variabel');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/variabel, seperti
gambar dibawah ini.
3.3. Tipe Data

Seperti bahasa pemrograman lainnya yang memiliki tipe data, PHP memiliki beberapa tipe
data. Namun berbeda dengan bahasa pemrograman lain, variable di PHP lebih fleksibel. Kita
tidak perlu mendefinisikan jenisnya ketika mendefinisikan pertama kali. Ada 6 Tipe data dasar
yang dapat diakomodasi di PHP, seperti terlihat di tabel dibawah ini.
Tipe Contoh Penjelasan

Integer 134 Semua angka bukan pecahan
Double 5.1234 Nilai pecahan
String “asep” Kumpulan karakter
Boolean False Salah satu nilai True atau False
Object Sebuah instance dari class
Array Larik
Untuk mengetahui tipe data sebuah variable, kita bisa menggunakan perintah gettype,
misalnya:
Print gettype ($nama_variabel);
Anda juga bisa mengubah jenis variable tertentu dengan perintah:
(jenis_variabel) $nama_variabel;
Misalnya untuk mengubah variable menjadi string, kita dapat menggunakan perintah:
$var_string = (string) $angka;
3.3.1. Implementasi Tipe Data pada Laravel.
Buat file kode baru dengan nama tipedata.blade.php dan simpan pada folder

<!DOCTYPE html>
<html>
<head>
<title>Tipe Data dalam PHP</title>
</head>
<body>
<?php
//Definisi Variabel
$jumlah=5;
$harga=20000;
$total=$harga*$jumlah;
echo"Jumlah Beli : $jumlah<br>";
echo"Harga Barang : $harga<br>";
echo"Total Bayar : $total<br>";
?>
</body>
</html>
public function tipedata()

{
return view('tipedata');
}
Route::get('tipedata', 'DasarController@tipedata');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/tipedata, seperti
gambar dibawah ini.
3.4. Konstanta
Dalam bahasa pemograman, Konstanta (constant) adalah suatu lokasi penyimpanan (dalam
memory) yang berisikan nilai yang sifatnya tetap dan tidak bisa diubah sepanjang program
berjalan. Berbeda dengan variabel yang isi/nilainya dapat diubah bahkan dihapus selama
program berjalan, sebuah konstanta jika telah diberikan nilai, tidak dapat diubah lagi dalam
kode program. Hal ini seseuai dengan namanya, yakni konstant.
Mendefinisikan konstanta dalam php dapat dilakukan dengan menggunakan kata kunci const
dan menggunakan fungsi define.
Bentuk umum : const NamaKonstanta = Nilai Konstanta

<?php
Const prodi = “Sistem Informasi Akuntansi”;
echo prodi;
?>
Bentuk umum : define (“NamaKonstanta”, Nilai Konstanta)
<?php
define(“prodi”,”Sistem Informasi Akuntansi”);
echo prodi;
?>
3.4.1. Implementasi Konstanta dalam Laravel.
Buat file kode baru dengan nama konstanta.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Konstanta dalam PHP</title>
</head>
<body>
<?php
//Konstanta Untuk Judul
define("judul","Hitung Luas Lingkaran");
//Konstanta untuk phi
define("PHI", 3.14);
//Variabel
$r=10;
$luas=PHI*$r*$r;
//Pemanggilan Konstanta
echo judul;
echo"<br>Jari-Jari : $r";
echo"<br>Luas Lingkatan : $luas<br>";
?>
</body>
</html>
public function konstanta()

{
return view('konstanta');
}
Route::get('konstanta', 'DasarController@konstanta');

Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/konstanta,
3.5. Operator
Sebuah bahasa pemrograman juga wajib untuk mampu mengolah nilai operand
(variable atau konstanta yang dioperasikan) menggunakan operator, seperti
menjumlah, membagi, dan sebagainya. Operator merupakan symbol yang berfungsi
untuk melakukan aksi / operasi tertentu terhadap nilai operand yang pada umumnya
dari hasil operasi tersebut menghasilkan nilai baru. Sementara operand adalah nilai
yang dilibatkan dalam operasi oleh operator.
Jenis-Jenis Operator
3.5.1. Operator Aritmatika

Operator ini digunakan untuk melakukan perhitungan matematika, sebagian berikut:
Operator Nama Contoh Hasil

+ Penambahan 1+4 5
- Pengurangan 1-4 -3
/ Pembagian ¼ 0.25
* Perkalian 1*4 4
% Sisa Pembagian 5%2 1
++ Inkremen X=5; X++ X=6
- Dekremen X=5; X- X=4
Implementasi Operator Aritmatika pada Laravel.
Buat file kode baru dengan nama opraritmatika.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Operator Aritmatika</title>
</head>
<body>
<?php
//Deklarasi Variabel
$nilai1=200;

$nilai2=40;
$hasil=$nilai1+$nilai2;
echo"$nilai1 + $nilai2 = $hasil<br>";
$hasil=$nilai1-$nilai2;
echo"$nilai1 - $nilai2 = $hasil<br>";
$hasil=$nilai1*$nilai2;
echo"$nilai1 * $nilai2 = $hasil<br>";
$hasil=$nilai1/$nilai2;
echo"$nilai1 / $nilai2 = $hasil<br>";
?>
</body>
</html>
public function opraritmatika()

{
return view('opraritmatika');
}
Route::get('opraritmatika', 'DasarController@opraritmatika');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/opraritmatika,
3.5.2. Operator Perbandingan.

Operator perbandingan digunakan untuk menghasilkan 2 nilai yang hasil akhirnya adalah nilai
Boolean true dan false. Operator ini sangat berguna dalam pemrograman karena bisa
menentukan arah pemrograman. Operator perbandingan adalah :
Operator Nama Contoh Hasil

== Sama dengan 6==6 False
!= Tidak sama dengan 3!=3 False
> Lebih 1>5 False
besar
>= Lebih besar atau sama 3>= False

< dengan
Lebih kecil 4
2<4 True
<= Lebih kecil atau sama dengan 5<= False
4
Implementasi Operator Perbandingan pada Laravel.
Buat file kode baru dengan nama oprbanding.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Operator Perbandingan</title>
</head>
<body>
<?php
$nilai1=100;
$nilai2=20;
$teks1="LARAVEL";
$teks2="laravel";
$hasil=$nilai1==$nilai2;
echo"$nilai1 == $nilai2 = $hasil<br>";
$hasil=$nilai1!=$nilai2;
echo"$nilai1 != $nilai2 = $hasil<br>";
$hasil=$nilai1>=$nilai2;
echo"$nilai1 >= $nilai2 = $hasil<br>";
$hasil=$teks1==$teks2;
echo"$teks1 == $teks2 = $hasil<br>";
$hasil=$teks1!=$teks2;
echo"$teks1 != $teks2 = $hasil<br>";
?>
</body>
</html>
public function oprbanding()

{
return view('oprbanding');
}
Route::get('oprbanding', 'DasarController@oprbanding');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/oprbanding,

3.5.3. Operator Logika

Operator untuk menyusun kalimat ekspresi/ungkapan logika. Hasil operasi ini akan didapatkan
nilai satu jika benar dan nol jika salah.
Operator Fungsi
AND atau && Operasi logika AND
OR atau || Operasi logika OR
XOR Operasi logika eksklusife OR
! Ingkaran/negasi
Implementasi Operator Logika pada Laravel.

Buat file kode baru dengan nama oprlogika.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Operator Logika</title>
</head>
<body>
<?php
$nilai1=100;
$nilai2=20;
$teks1="LARAVEL";
$teks2="laravel";
$hasil=($nilai1<>$nilai2) or ($teks1==$teks2);
echo"$nilai1<>$nilai2 or $teks1==$teks2 adalah $hasil<br>";
$hasil=!($teks1==$teks2);
echo"!($teks1==$teks2) adalah $hasil";
?>
</body>
</html>

public function oprlogika()

{
return view('oprlogika');
}
Route::get('oprlogika', 'DasarController@oprlogika');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/oprlogika,
3.5.4. Operator String

Dalam PHP juga tersedia operator string, yaitu digunakan untuk operasi penggabungan teks.
Adapun symbol yang digunakan yaitu berupa karakter tambah (.).
Implementasi Operator String pada Laravel.
Buat file kode baru dengan nama oprstring.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Operator Logika</title>
</head>
<body>
<?php
$teks1="Saya saat ini sedang belajar ";
$teks2="pengembangan web ";
$teks3="menggunakan bahasa pemrograman PHP ";
$teks4="dengan framework Laravel ";
$hasil=$teks1 . $teks2 . $teks3 . $teks4;
echo"<h3>$hasil</h3>";
?>
</body>
</html>

public function oprstring()

{
return view('oprstring');
}
Route::get('oprstring', 'DasarController@oprstring');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/oprstring,
Latihan Pembuatan Operator

1. Buatlah script untuk menghitung volume balok menggunakan fungsi operator aritmatika
dan operator string dengan ketentuan sebagai berikut :
Panjang balok = 10, lebar balok = 7, tinggi balok = 15,
Hitung volume balok dengan rumus = panjang * lebar * tinggi
Buat variable teks1 yang berisi = “Belajar Menghitung” dan teks2 yang berisi = “Volume
Balok. Buat perintah untuk menggabungkan nilai dari variable teks1 dan teks2 menggunakan
operator string.
Outputnya sebagai berikut :
2. Buatlah script untuk menghitung luas dan keliling lingkaran dengan ketentuan sebagai
berikut :
phi= 3,14
jari-jari=10
Rumus luas = phi*r*r
Rumus keliling = 2*phi*r
Outputnya sebagai berikut :


PERTEMUAN 4
Form Processing
4.1. Pengenalan Form.
Form digunakan untuk mengumpulkan data dari pengunjung web, mulai dari login form,
pendaftaran dan mengirimkan data antar halaman web. Penggunaan form dengan html tidak
akan terlalu berguna, form biasanya hanya berupa interface yang disediakan untuk
mengumpulkan data dari user, dan akan diproses dengan bahasa pemograman web lainnya.
Didalam tag form tedapat atribut yaitu method, berfungsi untuk menjelaskan bagaimana data
isian form akan dikirim oleh web browser. Nilai dari atribut method ini bisa berupa “get” atau
“post”.
Perbedaan method get dan method post, jika kita mengisi atribut method dengan get (default
seandainya atribut method tidak ditulis) maka isian form akan terlihat pada url browser –
method get ini biasanya digunakan untuk query pencarian.
Method post biasanya digunakan untuk data yang lebih sensitif seperti yang berisi password,
atau registrasi user –data hasil form tidak akan terlihat pada browser.
4.1.1. Komponen Form

Dalam FORM HTML terdapat beberapa komponen yang bisa digunakan, antara lain :
a. Form
<FORM ACTION=action METHOD=method> </FORM>
b. Text Box
Text box : untuk menginput data string ataupun angka.

<INPUT TYPE=TEXT NAME=”nama_variabel” VALUE=”value”>
c. Text Area
Text area : untuk menginput string ataupun angka yang terdiri atas banyak baris.
<textarea rows=” ” cols=” ” name=”nama_variabel”> </textarea>
d. Radio Button
Radio buton : untuk memilih satu pernyataan dari beberapa pernyataan yang
disediakan.
<input type=”radio” name=”nama_variabel” value=” ”>Isi_Radio
e. Combo Box

Combo box untuk menampilkan daftar data.
<select name=”nama_variabel” value=” “>

<option>Combo1</option>
<option>Combo2</option></select>
f. Check Box
Check box untuk memilih satu atau lebih pernyataan dari beberapa pernyataan yang
disediakan.
<input type="checkbox" name="kendaraan" value="Motor">Motor<br>

<input type="checkbox" name="kendaraan" value="Mobil"
checked>Mobil<br>
g. Submit
Submit untuk mengirimkan semua variable data pada komponen-komponen form yang
ada.
<input type=”submit” name=”submit” value=”submit”>
h. Reset
Reset untuk membatalkan semua penginputan yang telah dituliskan.
<input type=”reset” name=”reset” value=”reset”>
4.1.2. Pengolahan Data Dari Form
Form di HTML dikenal dengan adanya tag <FORM> dan ditutup dengan tag </FORM>. Di
dalam tag pembuka <FORM> diikuti dengan atribut action dan method. Action
menjelaskan ke halaman yang digunakan untuk memproses input, sementara method
digunakan untuk mengatur cara mem-parsing konten Web menerima input dari user atau
pengunjung menggunakan metode GET dan POST. GET akan mengirimkan data bersama
dengan URL, sedangkan POST akan mengirimkannya secara terpisah. User mengirimkan
data input dengan mengisi teks atau pilihan pada atribut form html.
Membuat form input di Laravel.

Buat file kode baru dengan nama forminput.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Form Input Laravel</title>

</head>
<body>
<form action="/formulir/output" method="get">
{{ csrf_field() }}
Nim :
<input type="text" name="nim"> <br/>
Nama :
<input type="text" name="nama"> <br/>
Alamat :
<textarea name="alamat" cols="70" rows="5"></textarea><br/>
<input type="submit" value="Simpan">
</form>
</body>
</html>
public function formulir()

{
return view('forminput');
}
Route::get('formulir', 'DasarController@formulir');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/formulir, seperti
gambar dibawah ini.
Membuat tampilan output di Laravel.
public function output(Request $request)

{
$nim = $request->input('nim');

$nama = $request->input('nama');
$alamat = $request->input('alamat');
return "Nim : ".$nim."<br>Nama : ".$nama."<br>Alamat : ".$alamat;
}
Route::get('formulir/output', 'DasarController@output');
Hasil luaran form input yang sudah diisi diatas akan mengarahkan ke url
http://localhost:8000/output seperti gambar dibawah ini.
CSRF_FIELD() Token
Pada kode untuk input formulir terdapat satu script yang bertuliskan {{ csfr_field() }}, fungsi
dari perintah tersebut adalah untuk memproteksi aplikasi Laravel dari serangan CSRF. CSRF
merupakan kependenkan dari Cross Site Request Forgery adalah sebuah serangan terhadap
aplikasi web yang memanfaatkan bug atau vulnerability pada aplikasi web yang bekerja
dengan cara mengeksploitasi suatu task dari sebuah web dengan memanfaatkan Autentikasi
yang dimiliki oleh korbannya. CSFR_FIELD() sangatlah penting dan wajib diimplementasikan
pada setiap aksi post, put atau patch pada form input.
4.1.3. Latihan Pembuatan Form Biodata Mahasiswa
Buat halaman untuk menampilkan form input biodata dan outputnya seperti gambar di bawah
ini.
Input Biodata Mahasiswa

Output Biodata Mahasiswa
Kode Form Input:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form action="/register/tampil" method="post">
{{ csrf_field() }}
<table bgcolor="#cc0066" border="0" align="center" width="60%">
<tr">
<td colspan="3" align="center"><h2>BIODATA MAHASISWA</h2><hr></td>
</tr>
<tr>
<td>NIM</td>
<td>:</td>
<td><input type="text" name="nim" placeholder="Masukkan NIM anda" ma
xlength="8"></td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td><input type="text" name="nama" placeholder="Masukkan Nama anda"
size="40"></td>
</tr>
<tr>
<td>Tempat Lahir</td>
<td>:</td>
<td><input type="text" name="tmplhr" placeholder="Tempat Lahir anda"
size="50"></td>

</tr>
<tr>
<td>Tanggal Lahir</td>
<td>:</td>
<td><input type="date" name="tgllhr"></td>
</tr>
<tr valign="top">
<td>Jenis Kelamin</td>
<td>:</td>
<td>
<input type="radio" name="jk" value="Laki-Laki">Laki - Laki<br>
<input type="radio" name="jk" value="Perempuan">Perempuan
</td>
</tr>
<tr valign="top">
<td>Pekerjaan</td>
<td>:</td>
<td>
<select name="kerja">
<option value="">--Pilih Pekerjaan--</option>
<option value="Karyawan">Karyawan</option>
<option value="Mahasiswa">Mahasiswa</option>
<option value="Wirausaha">Wirausaha</option>
<option value="Belum Bekerja">Belum Bekerja</option>
</select>
</td>
</tr>
<tr>
<td>Email</td>
<td>:</td>
<td><input type="email" name="email" placeholder="Email Anda"></td>
</tr>
<tr valign="top">
<td>Hobi</td>
<td>:</td>
<td>
<input type="checkbox" name="hobi1" value="Olah Raga">Olah Raga<
br>
<input type="checkbox" name="hobi2" value="Musik">Musik<br>
<input type="checkbox" name="hobi3" value="Pecinta Alam">Pecinta
Alam<br>
<input type="checkbox" name="hobi4" value="Lain">Lain-Lain
</td>
</tr>
<tr>
<td colspan="3">
<input type="submit" value="SIMPAN DATA">
<input type="reset" value="BATAL"><hr>
</td>

</tr>
</table>
</form>
</body>
</html>
Route::get('register', 'DasarController@register');
Route::post('register/tampil', 'DasarController@tampil');
Kode Output Biodata Mahasiswa:

public function tampil(Request $request)

{
$nim = $request->input('nim');
$tmplahir = $request->input('tmplhr');
$tgllahir = $request->input('tgllhr');
$jk = $request->input('jk');
$kerja = $request->input('kerja');
$email = $request->input('email');
$hobi1 = $request->input('hobi1');
return "<h2>Biodata Mahasiswa</h2><hr>

Nim : ".$nim.
"<br>Nama : ".$nama.
"<br>Tempat Lahir : ".$tmplahir.
"<br>Tanggal Lahir : ".$tgllahir.
"<br>Jenis Kelamin : ".$jk.
"<br>Pekerjaan : ".$kerja.
"<br>Amail : ".$email.
"<br>Hobi : ".$hobi1.",". $hobi2."," .$hobi3.",". $hobi4.
"<hr><a href='/register'>Kembali";
}
Latihan Pembuatan dan Pemanggilan Form :

1. Buat script program untuk membuat form input dengan data sbb :

2. Buat script program untuk memanggil data dari form input dengan bentuk sbb :
4.2. Percabangan
Pernyataan Seleksi
Sebagian besar bahasa pemrograman mengandung pernyataan seleksi. Pada dasarnya
pernyataan seleksi adalah suatu mekanisme yang menjelaskan apakah pernyataan akan
dikerjakan atau tidak, hal ini tergantung kondisi yang dirumuskan. Dalam bahasa
pemrograman java pernyataan seleksi diterapkan dengan menggunakan statement IF dan
Switch Case.
4.2.1. Statement IF
a. If Tunggal
Statement IF merupakan statement yang penting dan pasti terdapat di semua bahasa
pemrograman. Statement ini berguna untuk membuat percabangan berdasarkan
kondisi tertentu yang harus dipenuhi.
Bentuk umun Statement IF adalah sebagai berikut :
If ( kondisi )

Statement;
}
Prinsip kerjanya adalah perintah di atas akan dikerjakan apabila kondisi bernilai TRUE atau
benar, sedangkan jika kondisi salah / FALSE maka statement di atas tidak akan dikerjakan.
b. Pernyataan IF dan Else

Pernyataan ELSE merupakan bagian dari pernyataan if. Else digunakan untuk memberikan
alternative perintah apabila kondisi bernilai salah / FALSE.
Bentuk umum :
Contoh:
Buat file kode baru dengan nama ifthen.blade.php dan simpan pada folder resources/views,
<!DOCTYPE html>
<html>
<head>
<title>Percabangan</title>
</head>
<body>
<h1>Percabangan</h1><hr>
@if($nilai>=60)
<h3>
Nama : {{ $nama }}<br>
Nilai : {{ $nilai }}<br>
Keterangan : Selamat Anda Dinyatakan Lulus !
</h3>
@else
<h3>
Keterangan : Mohon Maaf Anda Dinyatakan Gagal !
</h3>
@endif
</body>
</html>

public function ifthen()

{
$nama = "Arsakha";
$nilai = 100;
return view('ifthen', compact('nama','nilai'));
}
Route::get('ifthen', 'DasarController@ifthen');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/ifthen, seperti
gambar dibawah ini.
c. Pernyataan IF , ElseIf dan Else
Jika pernyataan else memberikan alternative pilihan kedua, maka untuk pernyataan ElseIf
dapat digunakan untuk meumuskan banyak alternative pilihan (lebih dari dua pilihan).
Bentuk umum :
Contoh:

Buat file kode baru dengan nama nestedif.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Percabangan</h1><hr>
@if($nilai<=35)
<h3>
Grade : E <br>
Keterangan : Gagal!
</h3>
@elseif($nilai>=36&&$nilai<=55)
<h3>
Grade : D <br>
Keterangan : Gagal!
</h3>
<h3>
Grade : C <br>
Keterangan : Lulus!
</h3>
<h3>
Grade : B <br>
Keterangan : Lulus!
</h3>
@else
<h3>
Grade : A <br>
Keterangan : Lulus!
</h3>
@endif
</body>
</html>

public function nestedif()

{
$nama = "Razqa";
$nilai = 85;
return view('nestedif', compact('nama','nilai'));
}
Route::get('nestedif', 'DasarController@nestedif');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/nestedif, seperti
gambar dibawah ini.
2. Statement Switch
Statement untuk pengatur alur program berikutnya adalah switch. Salah satu keuntungan
switch adalah ada bisa langsung mengevaluasi satu statement dan memerintahkan aksi
dalam jumlah yang lebih banyak.
Bentuk umum :
Switch ( nilai_ekspresi ){
Case nilai_1 : statement_1; break;
Case nilai_2 : statement_2; break;
Default: statement_n;}
Endswitch
Contoh:
Buat file kode baru dengan nama switchcase.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>

</head>
<body>
<h1>Percabangan Switch Case</h1><hr>
@switch($jurusan)
@case(11)
<h3>Program Studi Sistem Informasi Akuntansi</h3>
@break
@case(12)
<h3>Program Studi Sistem Informasi</h3>
@break
@case(13)
<h3>Program Studi Teknologi Komputer</h3>
@break
@default
<h3>Program Studi Teknologi Informasi</h3>
@endswitch
</body>
</html>
public function switchcase()
{
$jurusan = "11";
return view('switchcase', compact('jurusan'));
}
Route::get('switchcase', 'DasarController@switchcase');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/switchcase,

Latihan Form Percabangan 1

Tampilan Input
Tampilan Output :
Ketentuan Soal :
• Jika STUDIO 1 maka bintang tamu “Opick” Jika STUDIO 2 maka bintang tamu
“Raihan”
• Jika Jenis kelas VIP maka harga 500000
• Selain itu kelas FESTIVAL maka harga 250000
• Total Harga : jumlah beli * harga
• Jika klik Kembali Ke Awal akan kembali ke halaman input
Pembahasan Halaman Booking.

Buat file kode baru dengan nama booking.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
</head>

<body>
<form action="tampiltiket" method="post">
{{ csrf_field() }}
<table bgcolor="aqua" border="0" align="center" width="60%">
<tr">
<td colspan="3" align="center"><h2>PEMBELIAN TIKET KONSER AMAL</h
2><hr></td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td><input type="text" name="nama" placeholder="Masukkan Nama and
a" size="40"></td>
</tr>
<tr valign="top">
<td>Studio</td>
<td>:</td>
<td>
<select name="studio">
<option value="">--Pilih Studio--</option>
<option value="Studio 1">Studio 1</option>
<option value="Studio 2">Studio 2</option>
</select>
</td>
</tr>
<tr valign="top">
<td>Kelas</td>
<td>:</td>
<td>
<input type="radio" name="kelas" value="VIP">VIP<br>
<input type="radio" name="kelas" value="Festival">Festival
</td>
</tr>
<tr>
<td>Jumlah Tiket</td>
<td>:</td>
<td><input type="text" name="jmltiket" placeholder="Jumlah Beli">
</td>
</tr>
<tr>
<td colspan="3" align="center"><hr>
<input type="reset" value="BATAL"><hr>
</td>
</tr>
</table>
</form>
</body>
</html>

public function booking()
{
return view('booking');
}
Route::get('booking', 'DasarController@booking');
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/booking
Pembahasan Halaman Tampil Tiket.
public function tampiltiket(Request $request)
{
$studio = $request->input('studio');
$kelas = $request->input('kelas');
$jmltiket = $request->input('jmltiket');
//Mencari Nama Bintang Tamu
if ($studio=="Studio 1")
{
$bt="Opick";
}
elseif ($studio=="Studio 2")
{
$bt="Raihan";
}
//Mencari Harga
if($kelas=='VIP'){
$harga=500000;
}
elseif($kelas=='Festival')
{
$harga=250000;
}
$total=$harga*$jmltiket;
return view('tampiltiket', compact('nama','studio','bt','kelas','

harga','jmltiket','total'));
}

Route::post('tampiltiket', 'DasarController@tampiltiket');
Buat file kode baru dengan nama tampiltiket.blade.php dan simpan pada folder
<!DOCTYPE html>
<html>
<head>
<title>Data Pembelian Tiket</title>
</head>
<body>
<table bgcolor="magenta" border="0" align="center" width="40%">
<tr">
<td colspan="3" align="center"><h2>DATA PEMBELIAN TIKET KONSER AM
AL</h2><hr></td>
</tr>
<tr>
<td>Nama Pemesan</td>
<td>:</td>
<td>{{ $nama }}</td>
</tr>
<tr valign="top">
<td>Kode Studio</td>
<td>:</td>
<td>{{ $studio }}</td>
</tr>
<tr valign="top">
<td>Bintang Tamu</td>
<td>:</td>
<td>{{ $bt }}</td>
</tr>
<tr valign="top">
<td>Jenis Kelas</td>
<td>:</td>
<td>{{ $kelas }}</td>
</tr>
<tr valign="top">
<td>Harga</td>
<td>:</td>
<td>Rp. {{ $harga }} </td>
</tr>
<tr>
<td>Jumlah Tiket</td>
<td>:</td>
<td>{{ $jmltiket }}</td>
</tr>
<tr><td colspan="3"><hr></td></tr>
<tr>
<td>Total Harga</td>

<td>:</td>
<td>Rp. {{ $total }}</td>
</tr>
<tr><td colspan="3"><hr></td></tr>
<tr><td colspan="3" align="center"><a href="booking">Kembali</a></td>
</tr>
</table>
</form>
</body>
</html>
Latihan Form Percabangan 2

Tampilan Input
Tampilan Output :
Ketentuan Soal :
1. Ketentuan untuk kota tujuan dan harganya :
a. Jika Solo, maka harga 450000
b. Jika Semarang, maka harga 350000,
c. Jika Yogyakarta, maka harga 400000
d. Jika Surabaya, maka harga 550000
2. Total Harga : Harga tiket x Jumlah Beli

3. Ketentuan untuk jumlah beli dan diskon :

a. Jika jumlah beli lebih dari sama dengan 3, maka diskon 10% dari Total Harga.
b. Jika kurang dari 3, maka tidak dapat diskon.
4. Total Bayar : Total Harga – diskon
5. Jika klik Kembali, maka akan kembali ke halaman input

PERTEMUAN 5
Basis Data, Migration dan Seeding
5.1. Basis Data
Basis data bisa dipahami sebagai suatu kumpulan data terhubung (interrelated data) yang
disimpan dengan bersama-sama pada suatu media, tanpa mengatap satu dan yang lainnya
atau tidak memerlukan suatu kerangkapan data (meskipun ada maka kerangkapan data itu
harus seminimal mungkin dan terkontrol (controlled redundancy), data disimpan dengan cara
tertentu sehingganya mudah untuk digunakan dan ditampilkan kembali, data bisa
digunakan satu atau bahkan lebih program-program aplikasi secara optimal, data disimpan
tanpa ketergantungan dengan program yang akan menggunakannya, data disimpan
sedemikian rupa sehingga proses pengambilan, penambahan, dan modifikasi data dapat
dilakukan dengan sangat mudah dan terkontrol.
Pada Laravel, interaksi dengan basis data dibuat dengan sangat sederhana di berbagai basis
data menggunakan SQL, query dan Eloquent ORM. Saat ini Laravel dapat mendukung 4
aplikasi sistem manajemen basis data, yaitu:
a. MySQL.
b. PostgreSQL.
c. SQLite.
d. SQL Server.
5.1.1. Konfigurasi Koneksi Basis Data

Untuk dapat bekerja dengan basis data, sebelumnya harus dilakukan konfigurasi koneksi
basis data terlebih dahulu. Laravel sudah menyediakan file konfigurasi basis data yang
disimpan pada direktori config/database.php yang isinya seperti dibawah ini:
'mysql' => [
'driver' => 'mysql',
'url' => env('DATABASE_URL'),
'host' => env('DB_HOST', '127.0.0.1'),
'port' => env('DB_PORT', '3306'),
'database' => env('DB_DATABASE', 'forge'),
'username' => env('DB_USERNAME', 'forge'),
'password' => env('DB_PASSWORD', ''),
'unix_socket' => env('DB_SOCKET', ''),
'charset' => 'utf8mb4',
'collation' => 'utf8mb4_unicode_ci',
'prefix' => '',
'prefix_indexes' => true,
'strict' => true,
'engine' => null,
'options' => extension_loaded('pdo_mysql') ? array_filter([
PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
]) : [],
],
File tersebut berfungsi untuk menyimpan konfigurasi koneksi database aplikasi Laravel, pada
file tersebut ada beberapa opsi driver database apa yang akan digunakan seperti mysql, pgsql
untuk postgreSQL, sqlite dan sqlsrv untuk MSSQL. Kode di atas merupakan konfigurasi untuk
mysql, isikan host dengan host server mysql kita, misalnya 127.0.0.1 atau localhost, kemudian

isikan user dan password untuk mysql di host tersebut, kemudian isi nama database yang
akan kita gunakan. Namun bila diperhatikan ternyata file tersebut menggunakan fungsi
env(“DB_HOST”, “127.0.0.1”), artinya file itu akan menggunakan nilai yang ada pada
variabel lingkungan (telah kita pelajari pada bab instalasi dan konfigurasi). Maka, kita isikan
konfigurasi koneksi kita pada file .env di root direktori aplikasi kita. Coba kita buka file .env
tersebut maka kita dapati blok kode seperti ini:
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=dbpa1
DB_USERNAME=root
DB_PASSWORD=
Penjelasan Kode: File ini merupakan file untuk menyimpan variabel lingkunan, di sini kita bisa
mendefinisikan konfigurasi koneksi database kita. DB_CONNECTION merupakan setingan
global settingan konfigurasi apa yang akan dipakai untuk connect ke database, nilainya mysql
karena kita akan menggunakan konfigurasi mysql pada file config/database.php. Kemudian,
alih-alih kita mengisi langsung detail koneksi seperti DB_HOST langsung di
config/database.php, kita menaruhnya di file .env. Sehingga kita isikan semua detail koneksi
di sini seperti DB_HOST, DB_PORT, DB_DATABASE, DB_USERNAME, DB_PASSWORD.
Selanjutnya konfigurasi ini akan diakses oleh file konfigurasi config/database.php
menggunakan fungsi env(DB_HOST, ‘nilai default’), env(DB_PORT, ‘nilai default’) dst.
5.1.2. Metode Dalam Berinteraksi Dengan Basis Data pada Laravel

Bekerja dengan basis data menggunakan laravel agak sedikit berbeda apabila dibandingkan
dengan pengembangan aplikasi tanpa framework (native). Secara umum alur untuk bekerja
dengan basis data secara native adalah dimulai dari membuat desain basis data kemudian
membuat tabel dan struktur melaui GUI, koneksi aplikasi ke basis data dan menerapkan query
pada kode program. Sedangkan jika menggunakan laravel, framework tersebut sudah memiliki
tools yang memudahkan dalam mengelola basis data melalui kode yang terdapat pada laravel.
Metode berinteraksi dengan basis data pada laravel terbagi menjadi dua kelompok, yaitu:
1. Code First.
Pada metode ini pemrogram tidak perlu merancangan, membuat basis data bahkan
memasukkan data awal melalui aplikasi yang biasa digunakan seperti phpMyAdmin,
Terminal, Adminer, dll. Perancangan dan pembuatan basis data dapat dilakukan
dengan memanfaatkan fitur yang terdapat pada laravel yang disebut Migration,
sedangkan input data awal dapat dilakukan menggunakan fitur Seeding.
2. Database First.
Metode ini dilakukan jika sudah memiliki basis data, tabel dan skemanya sehingga
dapat langsung menggunakannya tanpa harus membuat basis data baru. Jika ingin
menggunakan metode ini maka tidak perlu melakukan Migration dan Seeding.
5.2. Migration.
Migration adalah sebuah fitur yang berfungsi sebagai Control Version System untuk basis data
yang memungkinkan mengelola basis data dengan lebih mudah. Artinya dengan migration kita
dapat membuat, mengubah atau menghapus struktur tabel dan field basis data tanpa
membuka aplikasi GUI manajemen basis data seperti phpMyAdmin, SQLYog atau terminal.
5.2.1. Membuat Tabel dengan Migration
Sebelum membuat tabel dengan fitur migration, sebelumnya harus dibuat dulu database
sesuai dengan project yang akan dibangun. Membuat database bisa dilakukan dengan
menggunakan GUI DBMS phpMyAdmin dengan cara sebagai berikut:
1. Aktifkan service Server dan basis data melalui Xampp-Control dengan cara klik Start
pada module Apache dan MySQL.
2. Buka phpMyAdmin melalui web browser, ketik pada url localhost/phpMyAdmin.

3. Klik Tab Basis Data pada konten PhpMyAdmin, kemudian akan tampil halaman Buat
Basis Data.
4. Pada kolom Nama Basis Data, masukkan nama basis data dbpa1, lalu klik
Buat/Create.
5. Maka akan muncul basis data baru dengan nama dbpa1 seperti gambar dibawah ini.
Setelah basis data berhasil dibuat berikutnya membuat tabel dengan menggunakan fitur
migration laravel. Pertama buat file migration dimana file ini dapat dieksekusi agar dapat
mengubah struktur tabel sesuai dengan perintah yang dituliskan pada file tersebut. Untuk
membuat file migration dilakukan dengan menuliskan perintah dengan format seperti dibawah
ini pada terminal.
Format : php artisan make:migration NamaMigration
Tuliskan perintah dibawah ini pada terminal untuk membuat file migration dengan nama
Mahasiswa.
php artisan make:migration Mahasiswa

Jika berhasil dijalankan maka akan tampil notifikasi seperti gambar dibawah ini:
Perintah diatas setelah dieksekusi akan menghasilkan sebuah file migration pada direktori
database/migration dengan nama 2020_04_16_114021.php, 2020_04_16_114021
merupakan stempel waktu kapan file tersebut dibuat sedangkan students merupakan nama
migration yang didefinisikan. File tersebut berisi kode seperti dibawah ini:
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
class Mahasiswa extends Migration

{
/**
* Run the migrations.

*
* @return void
*/
public function up()
{
//
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
//
}
}
Pada kode diatas terdapat dua metode yaitu up() yang berfungsi untuk menuliskan perintah
membuat atau mengubah struktur tabel, sedangkan down() berfungsi untuk menuliskan
perintah yang membatalkan perintah yang telah dieksekusi di metode up().
Sebagai contoh kita akan membuat tabel “mahasiswa” dengan struktur tabel sebagai berikut:
Nama Kolom/Field Tipe Size

Id* INT
NIM VARCHAR 8
Nama_mhs VARCHAR 30
Jurusan VARCHAR 40
Untuk membuat struktur tabel mahasiswa masukkan kode berikut pada metode up().
<?php
class Mahasiswa extends Migration

{
/**
*
* @return void
*/
{
Schema::create('mahasiswa', function (Blueprint $table){
$table->increments('id');
$table->string('nim', 8);

$table->string('nama_mhs', 30);
$table->string('jurusan', 255);
$table->timestamps();
});
}
/**
*
* @return void
*/
{
Schema::dropIfExists( 'mahasiswa' );
}
}
Untuk mengeksekusi perintah tersebut masukan perintah dibawah ini pada terminal.
php artisan migrate

jika berhasil maka akan tampil notifikasi seperti dibawah ini.
Kemudian buka PhpMyAdmin pada database dbpa1 akan muncul tabel mahasiswa yang
baru saja dibuat menggunakan migration dengan struktur seperti gambar dibawah ini.
5.2.2. Mengisi Data Pada Tabel Menggunakan Seeding

Seeding merupakan salah satu fitur yang dimiliki oleh Laravel untuk mengisi data pada tabel
dalam database, namun biasanya data yang digunakan pada seeding adalah data dummy
atau data sembarang yang digunakan untuk keperluan pengujian fitur tertentu apakah sudah
berjalan sesuai dengan kebutuhan atau tidak.
Konsep penggunaan seeding sama seperti migration, pertama harus dibuat dulu file seeder
dengan memasukkan perintah menggunakan terminal dengan perintah seperti dibawah ini.
php artisan make:seeder MahasiswaSeeder

Perintah diatas setelah dieksekusi akan menghasilkan sebuah file migration pada direktori
database/seeds/ dengan nama MahasiswaSeeder.php, dimana file tersebut berisi kode
seperti dibawah ini:
<?php
use Illuminate\Database\Seeder;
class MahasiswaSeeder extends Seeder

{
/**
* Run the database seeds.
*
* @return void
*/
public function run()
{
//
}
}
Kode diatas merupakan class yg terbentuk hasil kompilasi perintah php artisan make:seeder
yang dijalankan melalui terminal, class tesebut hanya memiliki satu metode yaitu run(), pada
metode tersebut dituliskan kode untuk mengisi data ke dalam tabel students. Sebagai contoh
masukan data students dengan data sebagai berikut:
Id NIM Nama Jurusan

1 11192938 Selvy Permatahati Sistem Informasi Akuntansi
2 12190832 Razqa Rafisqy Sistem Informasi
Sebelum melakukan penambahan data menggunakan seeder diperlukan model yang

bertugas sebagai penghubung setiap alur program yang berinteraksi dengan basis data. Sama
seperti migration dan seeder, membuat model dilakukan dengan memasukkan perintah
melalui terminal. Perintah untuk membuat model adalah seperti dibawah ini.
php artisan make:model NamaModel

Sebagai contoh buat model dengan nama Students yang digunakan untuk melakukan
pengolahan data pada tabel mahasiswa, kode untuk membuat model tersebut adalah
php artisan make:model Mahasiswa


Perintah diatas setelah dieksekusi akan menghasilkan sebuah file model pada direktori app/
dengan nama Mahasiswa.php, dimana file tersebut berisi kode seperti dibawah ini:
<?php
namespace App;

{
//
}
Pada dasarnya penamaan tabel dengan menggunakan migration pada Laravel akan di
representasikan dengan nama jamak, sehingga ketika seeder dieksekusi tidak jarang akan
terjadi error dikarenakan seeder akan membaca nama tabel secara jamak misalnya siswas,
dosens, dsb. Untuk mengatasi hal tersebut perlu dilakukan konvensi model yang merupakan
fitur untuk menjaga agar nama tabel yang didefinisikan oleh model dengan tabel yg berada di
basis data tetap sama. Untuk melakukan konvensi model dilakukan dengan menambahkan
satu baris kode seperti dibawah ini.
<?php
namespace App;

{
//Konvensi Model
protected $table = "Mahasiswa";
}
Setelah model terbentuk dan menambahkan konvensi model didalamnya, kemudian buka file
MahasiswaSeeder.php yang sudah dibuat sebelumnya, kemudian masukan kode seperti
dibawah ini.
<?php
use App\Mahasiswa;
class MahasiswaSeeder extends Seeder

{
/**
*
* @return void
*/
{

$mhs1 = new Mahasiswa;

$mhs1->nim="11192938";
$mhs1->nama_mhs="Selvy Permatahati";
$mhs1->jurusan="Sistem Informasi Akuntansi";
$mhs1->save();
$mhs2 = new Mahasiswa;

$mhs2->nim="12190832";
$mhs2->nama_mhs="Razqa Rafisqy";
$mhs2->jurusan="Sistem Informasi";
$mhs2->save();
}
}
Sebelum menjalankan seeder untuk memasukan data ke dalam tabel, pada file
MahasiswaSeeder.php harus menambahkan satu baris kode untuk menggunakan model
mahasiswa (baris ke empat pada kode diatas) yaitu use App\Mahasiswa;, jika sudah lalu
jalankan perintah dibawah ini menggunakan terminal
php artisan db:seed --class=MahasiswaSeeder

Jike berhasil maka tampil notifikasi seperti dibawah ini.
Buka tabel students pada PhpMyAdmin, klik tab Browse/Jelajahi maka akan terlihat data
yang sudah ditambahkan menggunakan seeder seperti gambar dibawah ini.
LATIHAN
1. Buatlah tabel baru dengan nama Jurusan dengan struktur seperti dibawah ini.
Nama Kolom/Field Tipe Size

Id* INT
jrs VARCHAR 5
Nama_jrs VARCHAR 30
Fakultas VARCHAR 30
2. Isi data tersebut menggunakan Seeder dengan data sebagai berikut:
Idprodi jrs Nama_jrs Fakultas

1 11 Sistem Informasi Akuntansi Teknik dan Informatika
2 12 Sistem Informasi Teknik dan Informatika
3 13 Teknologi Komputer Teknik dan Informatika

PERTEMUAN 6
Create Read Update Delete (CRUD) Form
Setelah mempelajari pembuatan database dan tabel menggunakan migration serta pengisian
data menggunakan seeder, pada bab ini akan membahas pembuatan tampilan atau user
interface untuk pengelolaan data dalam basis data. CRUD kependekan dari Create Read
Update Delete yang merupakan istilah yang sering digunakan oleh pengembang program
dalam pengelolaan data seperti menambah, menampilkan, mengubah dan menghapus data
dalam basis data. Selanjutnya akan dibuat form user interface
6.1. Form CRUD Data Mahasiswa.

1. Membuat Controller Mahasiswa.
Sebelum membuat tampilan form, harus dibuat terlebih dahulu controller Mahasiswa dengan
menggunakan terminal dengan memasukkan perintah dibawah ini.
php artisan make:controller MahasiswaController --resource

Jika perintah tersebut berhasil, maka akan tampil notifikasi seperti gambar dibawah ini.
Perintah --resource disebut sebagai Controller Resource yang berfungsi untuk membuat
action standard pada controller, action tersebut antara lain index, create, show, edit, update
dan destroy dimana pada masing-masing action nantinya akan dimasukan perintah sesuai
dengan fungsi dari masing-masing action. Buka file MahasiswaController.php maka akan
terlihat kode seperti dibawah ini.
<?php
class MahasiswaController extends Controller

{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
{
//
}
/**
* Show the form for creating a new resource.
*
*/

public function create()

{
//
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
*/
public function store(Request $request)
{
//
}
/**
* Display the specified resource.
*
* @param int $id
*/
public function show($id)
{
//
}
/**
* Show the form for editing the specified resource.
*
* @param int $id
*/
public function edit($id)
{
//
}
/**
* Update the specified resource in storage.
*
* @param int $id
*/
public function update(Request $request, $id)
{
//
}
/**
* Remove the specified resource from storage.
*
* @param int $id

*/
public function destroy($id)
{
//
}
}
Kode yang dihasilkan antara Controller biasa dengan Controller Resource berbeda, dengan
controller resource akan secara otomatis terbentuk function sebagai action yang akan
digunakan dalam CRUD data. Selanjutnya atur route, buka file web.php kemudian tambahkan
kode seperti dibawah ini.
Route::resource( 'mahasiswa' , 'MahasiswaController' );
2. Membuat tampilan data mahasiswa.

Tampilan ini berisi data data mahasiswa yang tersimpan dalam tabel dan beberapa aksi untuk
menambah, mengubah dan menghapus data. Agar file dalam project terorganisir dengan baik,
sebaiknya dibuat folder sesuai dengan modul yang dikerjakan pada folder “resources\views”.
Buat folder baru dengan nama mahasiswa, kemudian buat file pada file tersebut dengan cara
klik kanan pada folder mahasiswa lalu pilih New File lalu berikan nama file index.blade.php
kemudian ketikan kode seperti dibawah ini.
<head>
<title>Data Mahasiswa</title>
</head>
<body>
<div>
<div>
<table border="1" align="left" >
<thead>
<tr>
<td align="right" colspan="4" align="center"><a href=
"{{route( 'mahasiswa.create')}}">[Tambah Data]</a></td>
</tr>
<tr>
<th><b>NIM</b></th>
<th><b>Nama</b></th>
<th><b>Jurusan</b></th>
<th><b>Actions</b></th>
</tr>
</thead>
<tbody>
@foreach ($mahasiswa as $mhs)
<tr>
<td>{{$mhs->nim}}</td>
<td>{{$mhs->nama_mhs}}</td>
<td>{{$mhs->jurusan}}</td>
<td>

<a href="{{route( 'mahasiswa.edit' ,[$mhs-

>id])}}">[ Edit ]</a>
-
<a href="/mahasiswa/hapus/{{ $mhs-
>id }}" onclick="return confirm('Yakin Ingin menghapus data?')">[ Delete
]</span></a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</body>
Untuk menampilkan data yang terdapat pada tabel mahasiswa pada halaman index,
tambahkan kode untuk mengambil data pada file MahasiswaController.php, pada action index
tuliskan kode berikut ini.

{
$mahasiswa = \App\Mahasiswa::All();
return view( 'Mahasiswa.index' , ['mahasiswa' => $mahasiswa]);
}
Untuk melakukan konvensi model, buka file Model Mahasiswa.php dan tambahkan kode

{
//Konvensi Model
protected $table = "Mahasiswa";
}
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/mahasiswa,

3. Membuat Tampilan Input Data Mahasiswa.

Tampilan ini berisi formulir input data mahasiswa, buat file pada file tersebut dengan cara klik
kanan pada folder mahasiswa lalu pilih New File lalu berikan nama file create.blade.php
<head>
<title>Input Data Mahasiswa</title>
</head>
<body>
<form enctype="multipart/form-data" class="bg-white shadow-sm p-
3" action="{{route('mahasiswa.store')}}" method="POST">
@csrf
<table bgcolor="aqua" border="0" align="center" width="40%">
<tr">
<td colspan="3" align="center"><h2>INPUT DATA MAHASISWA</h2><hr><
/td>
</tr>
<tr>
<td>NIM</td>
<td>:</td>
<td><input type="text" name="nim" placeholder="Masukkan NIM Anda"
size="40" maxlength="8"></td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td><input type="text" name="nama" placeholder="Masukkan Nama and
a" size="40"></td>
</tr>
<tr valign="top">
<td>Jurusan</td>
<td>:</td>
<td>
<select name="jurusan">
<option value="">--Pilih Jurusan--</option>
<option value="Sistem Informasi Akuntansi">11 - Sistem In
formasi Akuntansi</option>
<option value="Sistem Informasi">12 - Sistem Informasi</o
ption>
<option value="Teknologi Komputer">13 - Teknologi Kompute
r</option>
</select>
</td>
</tr>
<tr>

<input type="reset" value="BATAL" onclick="history.go(-

1)"><hr>
</td>
</tr>
</table> <br>
</form>
</body>
Untuk menampilkan halaman input data mahasiswa, perlu ditambahkan kode pada file
MahasiswaController.php pada action create dengan menuliskan kode berikut ini.

{
return view('Mahasiswa.create');
}
Untuk melihat hasil luarannya klik menu Tambah Data pada halaman data mahasiswa, maka
akan tampil seperti dibawah ini.
Untuk menyimpan data yang diinput pada form input data mahasiswa, buka file
MahasiswaController.php pada action store masukan kode seperti dibawah ini.

{
//Menangkap Data Yang Diinput
$nim=$request->get('nim');
$nama=$request->get('nama');
$jurusan=$request->get('jurusan');
//Menyimpan data kedalam tabel

$save_mhs = new \App\Mahasiswa;
$save_mhs->nim=$nim;
$save_mhs->nama_mhs=$nama;
$save_mhs->jurusan=$jurusan;
$save_mhs->save();
return redirect()->route( 'mahasiswa.index' );

}

Input data melalui form input data mahasiswa dengan lengkap, lalu klik simpan data. Jika
berhasil maka data akan bertambah.
4. Form Ubah Data Mahasiswa.

Tampilan ini berisi formulir untuk mengubah data mahasiswa, buat file pada file tersebut
dengan cara klik kanan pada folder mahasiswa lalu pilih New File lalu berikan nama file
edit.blade.php kemudian ketikan kode seperti dibawah ini.
<head>
<title>Edit Data Mahasiswa</title>
</head>
<body>
3" action="{{route('mahasiswa.update', [$mahasiswa-
>id])}}" method="POST">
@csrf
<input type="hidden" value="PUT" name="_method">
<table bgcolor="yellow" border="0" align="left" width="40%">
<tr">
<td colspan="3" align="center"><h2>UBAH DATA MAHASISWA</h2><hr></
td>
</tr>
<tr>
<td>NIM</td>
<td>:</td>
<td><input type="text" name="nim" value="{{$mahasiswa-
>nim}}" size="40"></td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td><input type="text" name="nama" value="{{$mahasiswa-
>nama_mhs}}" size="40"></td>
</tr>
<tr valign="top">
<td>Jurusan</td>
<td>:</td>
<td>
<select name="jurusan">
<option value="{{$mahasiswa->jurusan}}">{{$mahasiswa-
>jurusan}}</option>
<option value="Sistem Informasi Akuntansi">11 - Sistem In
formasi Akuntansi</option>
<option value="Sistem Informasi">12 - Sistem Informasi</o
ption>
<option value="Teknologi Komputer">13 - Teknologi Kompute
r</option>
</select>

</td>
</tr>
<tr>
<input type="submit" value="UPDATE DATA">
1)"><hr>
</td>
</tr>
</table>
<br>
</form>
</body>
Untuk menampilkan halaman edit data mahasiswa, perlu ditambahkan kode pada file
MahasiswaController.php pada action Edit dengan menuliskan kode berikut ini.

{
$mhs_edit = \App\Mahasiswa::findOrFail($id);
return view( 'Mahasiswa.edit', ['mahasiswa' => $mhs_edit]);
}
Untuk melihat hasil luarannya klik menu Edit pada halaman data mahasiswa, maka akan
tampil seperti dibawah ini.
Untuk menyimpan perubahan data form edit data mahasiswa, buka file
MahasiswaController.php pada action update masukan kode seperti dibawah ini.

{
$mhs = \App\Mahasiswa::findOrFail($id);
$mhs->nim=$request->get('nim');
$mhs->nama_mhs=$request->get('nama');
$mhs->jurusan=$request->get('jurusan');
$mhs->save();
return redirect()->route( 'mahasiswa.index' , [$id]);

}

edit data yang dipilih melalui form edit data mahasiswa dengan lengkap, lalu klik Update Data.
Jika berhasil maka data akan berubah.
5. Menghapus data mahasiswa.

Untuk menghapus data tidak perlu membuat form user interface, cukup dengan
menambahkan kode pada kode pada MahasiswaController.php pada action destroy, seperti
dibawah ini.

{
$mhs = \App\Mahasiswa::findOrFail($id);
$mhs->delete();
return redirect()->route( 'mahasiswa.index');

}
Setelah itu perlu menambahkan kode pada file route web.php seperti dibawah ini.
Route::get('/mahasiswa/hapus/{id}','MahasiswaController@destroy');
Untuk melihat apakah aksi hapus dapat berfungsi klik menu hapus pada data yang dipilih,
kemudian akan muncul konfirmasi “Yakin Ingin Menghapus Data?”, jika klik Ya maka data
yang dipilih aka dihapus, jika tidak maka akan kembali ke halaman data mahasiswa.
6.2. Form CRUD Data Jurusan

1. Membuat Controller Jurusan.
Buat terlebih dahulu controller Jurusan dengan menggunakan terminal dengan memasukkan
perintah dibawah ini.
php artisan make:controller JurusanController --resource

Buka file JurusanController.php maka akan terlihat kode seperti dibawah ini.
<?php
class JurusanController extends Controller

{
/**
* Display a listing of the resource.
*

*/
{
//
}
/**
* Show the form for creating a new resource.
*
*/
{
//
}
/**
* Store a newly created resource in storage.
*
*/
{
//
}
/**
* Display the specified resource.
*
* @param int $id
*/
{
//
}
/**
* Show the form for editing the specified resource.
*
* @param int $id
*/
{
//
}

/**
* Update the specified resource in storage.
*
* @param int $id
*/
{
//
}
/**
* Remove the specified resource from storage.
*
* @param int $id
*/
{
//
}
}
Selanjutnya atur route, buka file web.php kemudian tambahkan kode seperti dibawah ini.
Route::resource( 'jurusan' , 'JurusanController' );
2. Membuat tampilan data Jurusan.

Tampilan ini berisi data data Jurusan yang tersimpan dalam tabel dan beberapa aksi untuk
menambah, mengubah dan menghapus data. Buat folder baru dengan nama jurusan,
kemudian buat file pada file tersebut dengan cara klik kanan pada folder jurusan lalu pilih New
File lalu berikan nama file index.blade.php kemudian ketikan kode seperti dibawah ini.
<div>
<div>
<table border="1" align="center" >
<thead>
<tr>
<td align="right" colspan="4" align="center"><a href=
"{{route( 'jurusan.create')}}">[Tambah Data]</a></td>
</tr>
<tr>
<th><b>Kode Jurusan</b></th>
<th><b>Nama Jurusan</b></th>
<th><b>Fakultas</b></th>
<th><b>Actions</b></th>
</tr>
</thead>
<tbody>

@foreach ($jurusan as $jrs)

<tr>
<td>{{$jrs->jrs}}</td>
<td>{{$jrs->nama_jrs}}</td>
<td>{{$jrs->fakultas}}</td>
<td>
<a href="{{route( 'jurusan.edit' ,[$jrs-
>id])}}">[ Edit ]</a>
-
<a href="/jurusan/hapus/{{ $jrs-
>id }}" onclick="return confirm('Yakin Ingin menghapus data?')">[ Delete
]</span></a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
Untuk menampilkan data yang terdapat pada tabel jurusan pada halaman index, tambahkan
kode untuk mengambil data pada file JurusanController.php, pada action index tuliskan kode
berikut ini.

{
$jurusan = \App\Jurusan::All();
return view( 'jurusan.index' , [ 'jurusan' => $jurusan]);
}
Untuk melakukan konvensi model, buka file Model jurusan.php dan tambahkan kode seperti
dibawah ini.
class Jurusan extends Model

{
//Konvensi Model
protected $table = "Jurusan";
}
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/jurusan, seperti
gambar dibawah ini.

3. Membuat Tampilan Input Data Jurusan.

Tampilan ini berisi formulir input data jurusan, buat file pada file tersebut dengan cara klik
kanan pada folder Jurusan lalu pilih New File lalu berikan nama file create.blade.php
<head>
<title>Input Data Jurusan</title>
</head>
<body>
3" action="{{route('jurusan.store')}}" method="POST">
@csrf
<table bgcolor="blue" border="0" align="left" width="40%">

<tr">
<td colspan="3" align="center"><h2>INPUT DATA JURUSAN</h2><hr></t
d>
</tr>
<tr>
<td>Kode Jurusan</td>
<td>:</td>
<td><input type="text" name="kdjrs" placeholder="Masukkan Kode Ju
rusan" size="40" maxlength="2"></td>
</tr>
<tr>
<td>Nama Jurusan</td>
<td>:</td>
<td><input type="text" name="namajrs" placeholder="Masukkan Nama
jurusan" size="40"></td>
</tr>
<tr valign="top">
<td>Jurusan</td>
<td>:</td>
<td>
<select name="fakultas">
<option value="">--Pilih Fakultas--</option>
<option value="Fakultas Teknik dan Informatika">Fakultas
Teknik dan Informatika</option>
<option value="Fakultas Ekonomi dan Binsis">Fakultas Ekon
omi dan Binsis</option>
<option value="Fakultas Komunikasi dan Bahasa">Fakultas K
omunikasi dan Bahasa</option>
</select>
</td>
</tr>
<tr>


1)"><hr>
</td>
</tr>
</table> <br>
</form>
</body>
Untuk menampilkan halaman input data jurusan, perlu ditambahkan kode pada file
JurusanController.php pada action create dengan menuliskan kode berikut ini.

{
return view('Jurusan.create');
}
Untuk melihat hasil luarannya klik menu Tambah Data pada halaman data jurusan, maka akan
Untuk menyimpan data yang diinput pada form input data jurusan, buka file
JurusanController.php pada action store masukan kode seperti dibawah ini.

{
//Menangkap Data Yang Diinput
$jrs=$request->get('kdjrs');
$nama=$request->get('namajrs');
$fakultas=$request->get('fakultas');
$save_jrs = new \App\Jurusan;
$save_jrs->jrs=$jrs;
$save_jrs->nama_jrs=$nama;
$save_jrs->fakultas=$fakultas;
$save_jrs->save();
return redirect()->route( 'jurusan.index' );

}

Input data melalui form input data Jurusan dengan lengkap, lalu klik simpan data. Jika berhasil
maka data akan bertambah.
4. Form Ubah Data Jurusan.

Tampilan ini berisi formulir untuk mengubah data jurusan, buat file pada file tersebut dengan
cara klik kanan pada folder jurusan lalu pilih New File lalu berikan nama file edit.blade.php
<head>
<title>Edit Data Jurusan</title>
</head>
<body>
3" action="{{route('jurusan.update', [$jurusan->id])}}" method="POST">
@csrf
<input type="hidden" value="PUT" name="_method">
<table bgcolor="magenta" border="0" align="left" width="40%">
<tr">
<td colspan="3" align="center"><h2>UBAH DATA JURUSAN</h2><hr></td
>
</tr>
<tr>
<td>Kode Jurusan</td>
<td>:</td>
<td><input type="text" name="kdjrs" value="{{$jurusan-
>jrs}}" size="40"></td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td><input type="text" name="namajrs" value="{{$jurusan-
>nama_jrs}}" size="40"></td>
</tr>
<tr valign="top">
<td>Jurusan</td>
<td>:</td>
<td>
<select name="fakultas">
<option value="{{$jurusan->fakultas}}">{{$jurusan-
>fakultas}}</option>
<option value="Fakultas Teknik dan Informatika">Fakultas
Teknik dan Informatika</option>
<option value="Fakultas Ekonomi dan Binsis">Fakultas Ekon
omi dan Binsis</option>
<option value="Fakultas Komunikasi dan Bahasa">Fakultas K
omunikasi dan Bahasa</option>
</select>
</td>
</tr>

<tr>
<input type="submit" value="UPDATE DATA">
1)"><hr>
</td>
</tr>
</table>
<br>
</form>
</body>
Untuk menampilkan halaman edit data mahasiswa, perlu ditambahkan kode pada file
JurusanController.php pada action Edit dengan menuliskan kode berikut ini.

{
$jrs_edit = \App\Jurusan::findOrFail($id);
return view( 'Jurusan.edit', ['jurusan' => $jrs_edit]);
}
Untuk melihat hasil luarannya klik menu Edit pada halaman data jurusan, maka akan tampil
Untuk menyimpan perubahan data form edit data jurusan, buka file JurusanController.php
pada action update masukan kode seperti dibawah ini.

{
$jrs = \App\Jurusan::findOrFail($id);
$jrs->jrs=$request->get('kdjrs');
$jrs->nama_jrs=$request->get('namajrs');
$jrs->fakultas=$request->get('fakultas');
$jrs->save();
return redirect()->route( 'jurusan.index' , [$id]);

}

edit data yang dipilih melalui form edit data Jurusan dengan lengkap, lalu klik Update Data.
5. Menghapus data Jurusan.

Untuk menghapus data tidak perlu membuat form user interface, cukup dengan
menambahkan kode pada kode pada JurusanController.php pada action destroy, seperti
dibawah ini.

{
$jrs = \App\Jurusan::findOrFail($id);
$jrs->delete();
return redirect()->route( 'jurusan.index');

}
Route::get('/jurusan/hapus/{id}','JurusanController@destroy');
yang dipilih aka dihapus, jika tidak maka akan kembali ke halaman data jurusan.
Latihan CRUD
Buatlah tampilan untuk pengolahan data dosen, dengan table dan tampilan seperti dibawah
ini:
1. Gunakan database yang sama yaitu dbpa1, buatlah table dosen dengan struktur dibawah
ini:
2. Buatlah tampilan untuk tampil data, input data, dan edit data dosen.


PERTEMUAN 7
Review dan Latihan

PERTEMUAN 9
Project Baru, Login dan Home Admin
Templating merupakan sebuah teknik dalam pemrograman web dimana menggunakan
template dasar untuk merancang antarmuka pengguna (User Interface). Antarmuka pengguna
dalam pengembangan web direpresentasikan dengan HyperText Markup Language (HTML)
dan Cascading Style Sheet (CSS). Pada pembahasan ini akan dijelaskan tentang penerapan
teknik templating dalam framework Laravel.
9.1. Pembuatan Project Baru Laravel

Buat project baru Laravel melalui terminal dengan nama ProjectSIA, buka
terminal/commandprompt lalu ketik perintah “cd C:\xampp\htdocs” seperti dibawah ini untuk
masuk ke folder tempat penyimpanan project di xampp server.
Setelah masuk ke folder C:\xampp\htdocs, selanjutnya ketikan perintah dibawah ini untuk
membuat project baru dengan nama ProjectSIA.
composer create-project --prefer-dist laravel/laravel="^7.0" ProjectSIA
Kemudian composer akan memasang semua komponen Laravel kedalam folder ProjectSIA.
Setelah proses pemasangan selesai maka akan terbentuk satu folder baru dengan nama
ProjectSIA didalam Htdocs, kemudian pindahkan direktori ke ProjectSIA dengan perintah CD
ProjectSIA.
Kemudian lakukan pemasangan dependency project yang akan dibangun melalui terminal
dengan perintah dibawah ini.
Composer install
Jika berhasil makan akan tampil notifikasi seperti gambar dibawah ini dan project tersebut
siap untuk dibangun.

Setelah semua komponen pada project berhasil diinstal, selanjutnya lakukan buat database
baru dengan nama projectsia kemudian lakukan pengaturan koneksi database dengan cara
buka file .env lalu ubah kode menjadi seperti dibawah ini.
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=projectsia
DB_USERNAME=root
DB_PASSWORD=
9.2. Membuat User Authentication
Authentication berasal dari kata authentic, yang berarti asli, original. Secara istilah maksudnya
adalah proses untuk memastikan keaslian atau kebenaran. Sehingga user authentication
dapat diartikan sebagai proses untuk memastikan keaslian atau kebenaran pengguna yang
mengakses aplikasi. Sederhananya, proses ini sering kamu jumpai dalam bentuk pengecekan
menggunakan username dan password. Pada framework Laravel terdapat fitur untuk
membuat user authentication secara otomatis yang terdiri dari login, registrasi dan lupa
password hanya dengan menjalankan satu perintah melalui terminal.
Untuk membuat user authentication pada Laravel langkah pertama yang harus dilakukan
adalah melakukan pemasangan package authentication assets melalui terminal dengan
perintah seperti dibawah ini.
composer require laravel/ui:^2.4
Hasil kompilasi perintah diatas akan melakukan pemasangan laravel/ui, jika berhasil maka

Langkah selanjutnya adalah membuat fitur authentication dengan perintah dibawah ini.
php artisan ui vue --auth
Perintah diatas digunakan untuk membuat beberapa file yang digunakan untuk user
authentication seperti form login, form register dan lupa password. Jika perintah tersebut
berhasil dijalankan maka akan tampil notifikasi dan membuat beberapa file seperti dibawah
ini.

Untuk melihat hasilnya buka web browser lalu masukan pada url localhost:8000/, maka
tampilan halaman awal project Laravel akan menjadi seperti gambar dibawah ini.
Tampilan halaman login.
Tampilan halaman Register.

Form login dan register diatas masih berantakan dikarenakan belum memiliki template, oleh
karena itu untuk membuat tampilan login lebih bagus selanjutnya dilakukan proses templating.
9.3. Memulai Templating

Template yang akan digunakan pada pembahasan ini adalah template bootstrap admin,
template tersebut bisa dengan mudah didapatkan dengan mengunduh di situs penyedia
template bootstrap. Selain template bootstrap bisa juga menggunakan template css lainnya.
Pada pembahasan ini template sudah disediakan dengan nama folder template yang berisi
file seperti gambar dibawah ini.
Berikut link untuk mendownload template yang sudah disediakan :
http://bit.ly/TemplateProjectSIA
Folder asset berisi kumpulan library yang digunakan untuk mendukung tampilan pada
template yang berisi file CSS, JS, JQuery, gambar dan sebagainya. Sedangkan file home.php
merupakan file yang berisi kode untuk menampilkan halaman dashboard.
Copy folder asset yang terdapat pada template lalu paste ke dalam folder ProjectSIA/public/.
Kemudian copy file home.php pada folder template lalu paste pada folder layouts. Rename file
home.php menjadi layout.blade.php Sehingga struktur directory sekarang menjadi seperti
gambar dibawah ini.

A. Menyesuaikan Tampilan Form Login

Halaman form login sudah tersedia hasil kompilasi perintah php artisan ui vue --auth,
namun tampilan belum disesuaikan dengan template yang ada. Untuk menyesuaikan tampilan
halaman login dengan templatenya, buka file login.blade.php yang berada pada folder
“resources/views/auth” lalu ganti kode yang ada dengan kode berikut ini.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-
scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Pemrograman Akuntansi I</title>

<link href="{{ asset('asset/vendor/fontawesome-
free/css/all.min.css')}}" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300
,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">

<link href="{{ asset('asset/css/sb-admin-
2.min.css')}}" rel="stylesheet">
</head>
<body class="bg-gradient-dark">
<div class="container">

<div class="row justify-content-center">

<div class="col-xl-5 col-lg-12 col-md-9">

<div class="card o-hidden border-0 shadow-lg my-5">
<div class="card-body p-0">

<div class="center">
<div class="col-lg-6 d-none d-lg-block "></div>
<div class="col-lg-20">
<div class="p-5">
<div class="text-center">
<h1 class="h4 text-gray-900 mb-
4">Sistem Informasi Akuntansi<br>Fakultas Teknik dan Informatika<br>
<br><img src="{{ asset('asset/img/logo_ubsi.png')}}"
width="160"></h1>
</div>
<form method="POST" action="{{ route('login') }}">
@csrf
<div class="form-group row">
<label for="email" class="col-md-12 col-form-
label text-md-left">{{ __('E-Mail Address') }}</label>
<div class="col-md-12">
<input id="email" type="email" class="for
m-control @error('email') is-
invalid @enderror" name="email" value="{{ old('email') }}" required autoc
omplete="email" autofocus>
@error('email')
<span class="invalid-
feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<label for="password" class="col-md-12 col-
form-label text-md-left">{{ __('Password') }}</label>
<input id="password" type="password" clas
s="form-control @error('password') is-
invalid @enderror" name="password" required autocomplete="current-
password">
@error('password')
<span class="invalid-
feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>

<div class="col-md-12 offset-md-12">

<div class="form-check">
<input class="form-check-
input" type="checkbox" name="remember" id="remember" {{ old('remember') ?
'checked' : '' }}>
<label class="form-check-
label" for="remember">
{{ __('Remember Me') }}
</label>
</div>
</div>
</div>
<div class="form-group row mb-0">
<div class="col-md-12 offset-md-12">
<button type="submit" class="btn btn-
primary">
{{ __('Login') }}
</button>
@if (Route::has('password.request'))
<a class="btn btn-
link" href="{{ route('password.request') }}">
{{ __('Forgot Your Password?') }}
</a>
@endif
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<script src="{{ asset('asset/vendor/jquery/jquery.min.js')}}"></script>
<script src="{{ asset('asset/vendor/bootstrap/js/bootstrap.bundle.min.j
s')}}"></script>

<script src="{{ asset('asset/vendor/jquery-
easing/jquery.easing.min.js')}}"></script>

<script src="{{ asset('asset/js/sb-admin-2.min.js')}}"></script>
</body>
</html>

Untuk melihat hasilnya klik login pada halaman depan Laravel, atau masukan url
127.0.0.1:8000/login pada web browser, maka tampilan halaman login yang baru menjadi
Mengisi data pengguna
Form tersebut belum bisa digunakan karena belum ada data pengguna atau user dalam
database, oleh karena itu berikutnya akan dibuat sebuah tabel user dan mengisi tabel tersebut
dengan menggunakan Seeder. Buka file create_users_table.php yang berada pada folder
“database/migrations/”, kemudian masukan kode berikut ini.
<?php
class CreateUsersTable extends Migration

{
/**
*
* @return void
*/
{
Schema::create('users', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('email')->unique();
$table->string( "username")->unique();
$table->string('password');
$table->string( "roles");

$table->text( "address");
$table->string( "phone");
$table->enum( "status", ["ACTIVE", "INACTIVE"]);
});
}
/**
*
* @return void
*/
{
Schema::dropIfExists('users');
}
}
Setelah disimpan jalankan perintah php artisan migrate melalui terminal untuk mengeksekusi
pembuatan tabel users kedalam database. Jika berhasil maka akan tabel users akan
terbentuk.
Berikutnya mengisi tabel users dengan menggunakan seeding, buat file seeder baru melalui
terminal dengan nama PenggunaSeeder dengan perintah berikut ini.
Php artisan make:seeder PenggunaSeeder
Buka file PenggunaSeeder.php pada folder “database/seeds/” kemudian masukan kode

berikut ini.
<?php
class PenggunaSeeder extends Seeder

{
/**

*
* @return void
*/
{
$pengguna = new \App\User;
$pengguna->username = "admin";
$pengguna->name = "Administrator";
$pengguna->email = "adminpa1@bsi.ac.id";
$pengguna->roles = json_encode(["ADMIN"]);
$pengguna->password = \Hash::make( "admin");
$pengguna->phone = "081851851851";
$pengguna->address = "Jl Raya Jatiwaringin No. 101";
$pengguna->status = "ACTIVE";
$pengguna->save();
$this->command->info( "User Admin berhasil diinsert");
}
}
Simpan file tersebut kemudian eksekusi melalui terminal dengan perintah berikut ini.
php artisan db:seed --class=PenggunaSeeder
Jika berhasil maka akan tampil notifikasi seperti gambar dibawah ini.
B. Menyesuaikan halaman Home.

Tahapan selanjutnya adalah menyesuaikan halaman dashboard/home admin, jika form
login dicoba masuk menggunakan username dan password yang sudah didefinisikan, jika
berhasil maka akan diarahkan ke halaman home admin.

Halaman home admin tersebut masih belum rapih, oleh karena itu harus disesuaikan dengan
menggunakan templatenya, buka file home.blade.php pada folder “resource/views/” lalu ganti
kode yang sudah ada dengan kode berikut ini.
@extends('layouts.layout')
@section('content')
<div class="card">
<div class="card-header">Selamat Datang {{ Auth::user()-
>name }}</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
Anda berada pada halaman Home Admin.
</div>
</div>
</div>
</div>
</div>
@endsection
Penjelasan kode:
@extends(‘layouts.layout’) digunakan untuk memanggil atau menggunakan
layout.blade.php yang tersimpan pada folder layouts dimana file tersebut berisi kode
master template bootstrap yang digunakan.
@section(‘konten’) bertugas untuk mendefinisikan kode yang berisi tampilan halaman
web, setiap section harus diakhiri dengan @endsection. Simpan perubahan tersebut,
kemudian refresh browsernya jika berhasil maka tampilan halaman home admin saat ini seperi
gambar dibawah ini.

Buka file layout.blade.php yang berada pada folder resources/views/layouts/,

kemudian hapus kodingan dari baris 173 sampai dengan 178 ganti dengan kode
@yield(‘content’).
Menjadi
Fungsi dari @yield(‘content’) pada kode diatas digunakan untuk pemanggilan

@section(‘content’) pada file home.blade.php, penamaan @section dan @yield harus
sesuai.
Setelah disimpan refresh kembali web browsernya, maka tampilan halaman home
admin akan menjadi seperti gambar dibawah ini.
Untuk mempertahankan tampilan template agar tidak berubah, maka jalur pengaksesan file
pendukung css yang terdapat pada folder “public/asset/” harus dibuat statis. Ubah coding pada
file layout.blade.php baris 13 sampai dengan 17 dengan kode dibawah ini.
<link href="{{ asset('asset/vendor/fontawesome-

free/css/all.min.css')}}" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,3
00i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">


<link href="{{ asset('asset/css/sb-admin-2.min.css')}}" rel="stylesheet">

<link href="{{ asset('asset/vendor/datatables/dataTables.bootstrap4.min.c
ss')}}" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js
"></script>
Ubah juga coding pada file layout.blade.php baris 222 sampai dengan 240 dengan kode
berikut ini.


<script src="{{ asset('asset/vendor/jquery/jquery.min.js')}}"></script>
<script src="{{ asset('asset/vendor/bootstrap/js/bootstrap.bundle.min.js'
)}}"></script>


<script src="{{ asset('asset/vendor/jquery-
easing/jquery.easing.min.js')}}"></script>


<script src="{{ asset('asset/js/sb-admin-2.min.js')}}"></script>


<script src="{{ asset('asset/vendor/chart.js/Chart.min.js')}}"></script>
<script src="{{ asset('asset/vendor/datatables/jquery.dataTables.min.js')
}}"></script>
<script src="{{ asset('asset/vendor/datatables/dataTables.bootstrap4.min.
js')}}"></script>


<script src="{{ asset('asset/js/demo/chart-area-demo.js')}}"></script>
<script src="{{ asset('asset/js/demo/chart-pie-demo.js')}}"></script>
<script src="{{ asset('asset/js/demo/datatables-demo.js')}}"></script>
Untuk menampilkan nama pengguna yang sedang login pada halaman home admin dibagian
kanan atas, ubah coding pada file layout.blade.php baris 149 dan 150 dengan kode berikut ini.
<span class="mr-2 d-none d-lg-inline text-gray-

600 small">{{ Auth::user()->name }}</span>
<img class="img-profile rounded-
circle" src="{{ asset('asset/img/avatar2.png')}}">
Untuk membuat menu logout dapat berjalan sebagaimana mestinya, ubah script pada file
layout.blade.php baris 216 dengan script dibawah ini
<a class="btn btn-primary" href="{{ route('logout') }}"

onclick="event.preventDefault();document.getElementById('logout-
form').submit();">
{{ __('Logout') }}
</a>

<form id="logout-form" action="{{ route('logout') }}" method="POST"

style="display: none;">
@csrf
</form>

PERTEMUAN 10
Pembuatan Tabel dan Form Master
10.1. Pembuatan Tabel.
Buat tabel baru pada database projectsia menggunakan migration dengan struktur sebagai
berikut :
1. Tabel Akun
Field Tipe Data Size Keterangan
Id Int 20 Primary Key
Kdakun Varchar 10
Nmakun Varchar 50
Klasifikasi Varchar 30
SubKlasifikasi Varchar 100
2. Tabel KasKeluar
Nokk Varchar 10
tglkk Date
Memokk Text
Jmlkk double
3. Tabel KasKeluarDet
Idkk Int 20 Foreign Key
Idakun Int 20 Foreign Key
Nilcr Double
4. Tabel BukuBesar
Id Int 20
Idtrans Int 11
Notran Varchar 10
Catatan Varchar 255
Jmldb Double
Jmlcr Double
Buat file tiga model dan migration menggunakan terminal dengan nama Akun, KasKeluar,
KasKeluarDet dan BukuBesar untuk membuat empat tabel diatas dengan perintah sebagai
berikut.
Php artisan make:model Akun -m
Php artisan make:model KasKeluar -m
Php artisan make:model KasKeluarDet -m
Php artisan make:model BukuBesar -m

Perintah diatas merupakan perintah untuk membuat model dan migration dalam satu
statement, flag -m yang bertugas membuat file migration sesuai dengan nama modelnya.
1. Modifikasi kode file migration dan model akun.
Buka file migration create_akuns_table.php pada folder /database/migration/ lalu pada
function up() tambahkan kode seperti dibawah ini.
{
Schema::create('akun', function (Blueprint $table) {
$table->id();
$table->string('kdakun',10);
$table->string('nmakun',50);
$table->string('klasifikasi',30);
$table->string('subklasifikasi',100);
});
}
Kode diatas merupakan perintah untuk membuat tabel dengan nama akun yang berisi
beberapa fields. Kemudian buka file model akun.php pada folder /App/ kemudian
tambahkan kode berikut ini.
class Akun extends Model

{
protected $table = "akun";
protected $fillable = [
'id', 'kdakun', 'nmakun', 'klasifikasi', 'subklasifikasi', 'jmlcr'
];
}
2. Modifikasi kode file migration Kas Keluar.

Buka file migration create_kas_keluars_table.php pada folder /database/migration/ lalu
pada function up() tambahkan kode seperti dibawah ini.
{
Schema::create('kas_keluar', function (Blueprint $table) {
$table->id();
$table->string('nokk', 10);
$table->date('tglkk');
$table->text('memokk');
$table->double('jmkk');
});
}
Buka file model KasKeluar.php pada folder /App/ kemudian tambahkan kode berikut ini.
class KasKeluar extends Model

{
protected $table = "kas_keluar";

'id', 'nokk', 'tglkk', 'memokk', 'jmkk'
];
}
3. Modifikasi kode file migration kas keluar detail.

Buka file migration create_kas_keluar_dets_table.php pada folder /database/migration/ lalu
{
Schema::create('kas_keluar_det', function (Blueprint $table) {
$table->unsignedBigInteger('idkk');
$table->unsignedBigInteger('idakun');
$table->double('nilcr');
});
}
Buka file model KasKeluarDet.php pada folder /App/ kemudian tambahkan kode berikut ini.
class KasKeluarDet extends Model
{
protected $table = "kas_keluar_det";
'idkk', 'idakun', 'nilcr'
];
}
4. Modifikasi kode file migration buku besar.

Buka file migration create_buku_besar_table.php pada folder /database/migration/ lalu
{
Schema::create('buku_besar', function (Blueprint $table) {
$table->id();
$table->Integer('idtrans');
$table->string('notran', 10);
$table->string('catatan', 255);
$table->double('jmldb')->nullable();
$table->double('jmlcr')->nullable();
});
}
Buka file model BukuBesar.php pada folder /App/ kemudian tambahkan kode berikut ini.
class BukuBesar extends Model
{
protected $table = "buku_besar";

'id', 'idtrans', 'notran', 'catatan', 'jmldb', 'jmlcr'

];
}
Kode protected $table diatas digunakan untuk mengatur pemanggilan nama tabel dalam
basis data, karena secara default Laravel akan memanggil tabel dengan nama yang jamak
(berakhiran s). Sedangkan protected $fillable digunakan untuk menjaga agar nama
field pada tabel tidak berubah.
Setelah selesai memodifikasi tiga file migration dan model diatas, konversi file tersebut
menjadi sebuah tabel dalam basis data projectsia memasukan perintah seperti dibawah ini.
php artisan migrate
Jika perintah tersebut berhasil dijalankan maka akan tampil notifikasi pada terminal dan
terbentuk tabel baru pada basis data projectsia seperti gambar dibawah ini.
10.2. Form Pengolahan Data User

1. Membuat Controller User
Buat controller resource baru dengan nama User dengan menggunakan terminal dengan
php artisan make:controller UserController --resource

Atur route dengan membuka file web.php kemudian tambahkan kode seperti dibawah ini.
Route::resource( '/user' , 'UserController' );
2. Membuat tampilan halaman data user

Buat folder baru dengan nama user, kemudian buat file pada file tersebut dengan cara klik
kanan pada folder akun lalu pilih New File lalu berikan nama file user.blade.php kemudian
ketikan kode seperti dibawah ini.
@section('content')
<div class="d-sm-flex align-items-center justify-content-between mb-4">
<h1 class="h3 mb-0 text-gray-800">Data Pengguna</h1>
</div><hr>
<div class="card-header py-3" align="right">
<a href="{{route('user.create')}}" class="d-none d-sm-inline-
block btn btn-sm btn-primary shadow-sm">
<i class="fas fa-plus fa-sm text-white-50"></i> Tambah </a>
</div>
<div class="table-responsive">
<table class="table table-
bordered" id="dataTable" width="100%" cellspacing="0">
<thead>
<tr align="center">
<th width="10%">User Name</th>
<th width="25%">Nama</th>
<th width="20%">Email</th>
<th width="15%">Roles</th>
<th width="15%">Status</th>
<th width="15%">Aksi</th>
</tr>
</thead>
<tbody>
@foreach ($user as $usr)
<tr>
<td>{{$usr->username}}</td>
<td>{{$usr->name}}</td>
<td>{{$usr->email}}</td>
<td>{{$usr->roles}}</td>
<td>{{$usr->status}}</td>
<td align="center">
<a href="{{route( 'user.edit' ,[$usr->id])}}" class="d-
none d-sm-inline-block btn btn-sm btn-success shadow-sm">
<i class="fas fa-edit fa-sm text-white-50"></i> Edit
</a>

<a href="/user/hapus/{{ $usr-

>id }}" onclick="return confirm('Yakin Ingin menghapus data?')" class="d-
none d-sm-inline-block btn btn-sm btn-danger shadow-sm">
<i class="fas fa-trash-alt fa-sm text-white-50"></i> Hapus
</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
@endsection
Untuk menampilkan data yang terdapat pada tabel user pada halaman index akun,
tambahkan kode untuk mengambil data pada file UserController.php, pada action index

{
$user = \App\User::All();
return view( 'user.user' , ['user' => $user]);
}
Untuk melihat hasil luarannya aktifkan server localhost melalui terminal dengan perintah
php artisan serve, setelah server dijalankan ketik pada web browser url
http://localhost:8000/user maka tampil seperti gambar dibawah ini.

3. Membuat tampilan input data user.

Buat file baru dengan cara klik kanan pada folder User lalu pilih New File lalu berikan nama
file input.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<form action="{{route('user.store')}}" method="POST">
@csrf
<fieldset>
<legend>Input Data Pengguna</legend>
<label for="usname">Username</label>
<input id="usname" type="text" name="usname" class="form-
control" required>
</div>
<label for="nama">Nama Lengkap</label>
<input id="nama" type="text" name="nama" class="form-
control" required>
</div>
</div>
<label for="roles">Roles</label>
<select id="roles" name="roles[]" class="form-control" required>
<option value="">--Pilih Roles--</option>
<option value="ADMIN">Admin</option>
<option value="STAFF">Staff</option>
</select>
</div>
<label for="email">Email</label>
<input id="email" type="email" name="email" class="form-
control" required>
</div>
</div>
<label for="alamat">Alamat</label>
<textarea id="alamat" name="alamat" class="form-
control" required></textarea>
</div>
<label for="tlp">Nomor Telpon</label>
<input id="tlp" type="text" name="tlp" class="form-
control" required>
</div>
</div>


<label for="passw">Password</label>
<input id="passw" type="password" name="passw" class="form-
control" required>
</div>
<label for="kpassw">Konfirm Password</label>
<input id="kpassw" type="password" name="kpassw" class="form-
control" required>
</div>
</div>
<label for="status">Status</label>
<select id="status" name="status" class="form-control" required>
<option value="">--Pilih Status--</option>
<option value="ACTIVE">AKTIF</option>
<option value="INACTIVE">NON AKTIF</option>
</select>
</div>
</div>
<input type="submit" class="btn btn-success btn-send" value="Simpan" >
<input type="Button" class="btn btn-primary btn-
send" value="Kembali" onclick="history.go(-1)">
</div><hr>
</fieldset>
</form>
@endsection
Untuk menampilkan halaman input data user, perlu ditambahkan kode pada file
UserController.php pada action create dengan menuliskan kode berikut ini.

{
return view('user.input');
}
Untuk melihat hasil luarannya klik menu Tambah pada halaman data user, maka akan

Untuk menyimpan data yang diinput pada form input data user, buka file UserController.php
pada action store masukan kode seperti dibawah ini.

{
$pass=$request->get('passw');
$kpass=$request->get('kpassw');
if ($pass == $kpass){
$save_user = new \App\User;
$save_user->name=$request->get('nama');
$save_user->email=$request->get('email');
$save_user->username=$request->get('usname');
$save_user->password=\Hash::make($request->get( 'passw' ));
$save_user->roles=json_encode($request->get('roles'));
$save_user->address=$request->get('alamat');
$save_user->phone=$request->get('tlp');
$save_user->status=$request->get('status');
$save_user->save();
}
return redirect()->route('user.index');
}
Input data melalui form input data user dengan lengkap, lalu klik simpan data. Jika berhasil
4. Membuat form ubah data user.

Buat file baru dengan cara klik kanan pada folder user lalu pilih New File lalu berikan nama
file edit.blade.php kemudian ketikan kode seperti dibawah ini.

@section('content')
<form action="{{route('user.update', [$user->id])}}" method="POST">
@csrf
<input type="hidden" name="_method" value="PUT">
<fieldset>
<legend>Input Data Pengguna</legend>
<label for="usname">Username</label>
<input id="usname" type="text" name="usname" class="form-
control" value="{{$user->username}}">
</div>
<label for="nama">Nama Lengkap</label>
control" value="{{$user->name}}">
</div>
</div>
<label for="roles">Roles</label>
<select id="roles" name="roles[]" class="form-control" required>
<option value="{{$user->roles}}">{{$user->roles}}</option>
<option value="">--Pilih Roles--</option>
<option value="ADMIN">Admin</option>
<option value="STAFF">Staff</option>
</select>
</div>
<label for="email">Email</label>
<input id="email" type="email" name="email" class="form-
control" value="{{$user->email}}">
</div>
</div>
<label for="alamat">Alamat</label>
<textarea id="alamat" name="alamat" class="form-
control" value="{{$user->address}}">{{$user->address}}</textarea>
</div>
<label for="tlp">Nomor Telpon</label>
<input id="tlp" type="text" name="tlp" class="form-
control" value="{{$user->phone}}">
</div>
</div>

<input type="checkbox" name="ubahpass" value="ubah" > Ubah Password

</div>
<label for="passw">Password</label>
<input id="passw" type="password" name="passw" class="form-
control" value="{{$user->password}}">
</div>
<label for="kpassw">Konfirm Password</label>
<input id="kpassw" type="password" name="kpassw" class="form-
control" value="{{$user->password}}">
</div>
</div>
<label for="status">Status</label>
<select id="status" name="status" class="form-control" required>
<option value="{{$user->status}}">{{$user->status}}</option>
<option value="">--Pilih Status--</option>
<option value="ACTIVE">AKTIF</option>
<option value="INACTIVE">NON AKTIF</option>
</select>
</div>
</div>
<input type="submit" class="btn btn-success btn-send" value="Update" >
</div><hr>
</fieldset>
</form>
@endsection
Untuk menampilkan halaman edit data user, perlu ditambahkan kode pada file
UserController.php pada action Edit dengan menuliskan kode berikut ini.

{
$user_edit = \App\User::findOrFail($id);
return view( 'user.edit' , ['user' => $user_edit]);
}
Untuk melihat hasil luarannya klik menu Edit pada halaman data user, maka akan tampil

Untuk menyimpan perubahan data form edit data user, buka file UserController.php pada
action update masukan kode seperti dibawah ini.

{
$pass=$request->get('passw');
$kpass=$request->get('kpassw');
$user = \App\User::findOrFail($id);
if($request->get('ubahpass') == 'ubah'){
if ($pass == $kpass){
$user->name=$request->get('nama');
$user->email=$request->get('email');
$user->username=$request->get('usname');
$user->roles=json_encode($request->get('roles'));
$user->address=$request->get('alamat');
$user->phone=$request->get('tlp');
$user->status=$request->get('status');
$user->password=\Hash::make($request->get( 'passw' ));
$user->save();
}
}else{
$user->name=$request->get('nama');
$user->email=$request->get('email');
$user->username=$request->get('usname');
$user->roles=json_encode($request->get('roles'));
$user->address=$request->get('alamat');
$user->phone=$request->get('tlp');
$user->status=$request->get('status');
$user->save();
}

return redirect()->route( 'user.index');
edit data yang dipilih melalui form edit data User dengan lengkap, lalu klik Update Data.
5. Menghapus data User

Untuk menghapus data user buka file UserController.php kemudian tambahkan kode
dibawah ini pada action destroy.
{
$user = \App\User::findOrFail($id);
$user->delete();
return redirect()->route( 'user.index');

}
Route::get('/user/hapus/{kode}','UserController@destroy');
yang dipilih akan dihapus, jika tidak maka akan kembali ke halaman data user.
10.3. Form Pengolahan Data Akun

1. Membuat Controller Akun
Buat controller resource baru dengan nama Akun dengan menggunakan terminal dengan
php artisan make:controller AkunController --resource
Route::resource( '/akun' , 'AkunController' );
2. Membuat tampilan halaman data akun

Buat folder baru dengan nama akun, kemudian buat file pada file tersebut dengan cara klik
kanan pada folder akun lalu pilih New File lalu berikan nama file akun.blade.php kemudian
ketikan kode seperti dibawah ini.

@section('content')
<h1 class="h3 mb-0 text-gray-800">Data Akun Rekening</h1>
</div><hr>
<a href="{{route('akun.create')}}" class="d-none d-sm-inline-
</div>
<thead>
<tr align="center">
<th width="15%">Kode Akun</th>
<th width="30%">Nama Akun</th>
<th width="20%">Sub Klasifikasi</th>
<th width="20%">Klasifikasi</th>
</tr>
</thead>
<tbody>
@foreach ($akun as $akn)
<tr>
<td>{{$akn->kdakun}}</td>
<td>{{$akn->nmakun}}</td>
<td>{{$akn->subklasifikasi}}</td>
<td>{{$akn->klasifikasi}}</td>
<td align="center">
<a href="{{route( 'akun.edit' ,[$akn->id])}}" class="d-none d-
sm-inline-block btn btn-sm btn-success shadow-sm">
<i class="fas fa-edit fa-sm text-white-50"></i> Edit
</a>
<a href="/akun/hapus/{{ $akn-
</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>

@endsection
Untuk menampilkan data yang terdapat pada tabel akun pada halaman index akun,
tambahkan kode untuk mengambil data pada file AkunController.php, pada action index

{
$akun = \App\Akun::All();
return view( 'akun.akun' , ['akun' => $akun]);
}
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/akun maka
tampil seperti gambar dibawah ini.
3. Membuat tampilan input data akun.

Buat file baru dengan cara klik kanan pada folder Akun lalu pilih New File lalu berikan
nama file input.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<form action="{{route('akun.store')}}" method="POST">
@csrf
<fieldset>
<legend>Input Data Akun</legend>
<label for="kode">Kode Akun</label>
<input id="kode" type="text" name="kode" class="form-control">
</div>

<label for="nama">Nama Akun</label>

<input id="nama" type="text" name="nama" class="form-control">
</div>
</div>
<label for="klasifikasi">Klasifikasi Akun</label>
<select id="klasifikasi" name="klasifikasi"class="form-control">
<option value="">--Pilih Klasifikasi--</option>
<option value="Harta">Harta</option>
<option value="Kewajiban">Kewajiban</option>
<option value="Modal">Modal</option>
<option value="Pendapatan">Pendapatan</option>
<option value="Biaya Atas Pendapatan">Biaya Atas Pendapatan</optio
n>
<option value="Pengeluaran Operasional">Pengeluaran Operasional</o
ption>
<option value="Pendapatan Lain">Pendapatan Lain</option>
</select>
</div>
<label for="no_hp">Sub Klasifikasi</label>
<input id="subklas" type="text" name="subklas" class="form-control">
</div>
</div>
</div><hr>
</fieldset>
</form>
@endsection
Untuk menampilkan halaman input data akun, perlu ditambahkan kode pada file
AkunController.php pada action create dengan menuliskan kode berikut ini.
{
return view('akun.input');
}
Untuk melihat hasil luarannya klik menu Tambah pada halaman data akun, maka akan

Untuk menyimpan data yang diinput pada form input data akun, buka file
AkunController.php pada action store masukan kode seperti dibawah ini.

{
$save_akun = new \App\Akun;
$save_akun->kdakun=$request->get('kode');
$save_akun->nmakun=$request->get('nama');
$save_akun->klasifikasi=$request->get('klasifikasi');
$save_akun->subklasifikasi=$request->get('subklas');
$save_akun->save();
return redirect()->route( 'akun.index' );

}
Input data melalui form input data Akun dengan lengkap, lalu klik simpan data. Jika berhasil
4. Membuat form ubah data akun.

Buat file baru dengan cara klik kanan pada folder akun lalu pilih New File lalu berikan
nama file edit.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<form action="{{route('akun.update', [$akun->id])}}" method="POST">
@csrf
<input type="hidden" name="_method" value="PUT">
<fieldset>
<legend>Input Data Akun</legend>

<label for="kode">Kode Akun</label>

<input id="kode" type="text" name="kode" class="form-
control" value="{{$akun->kdakun}}">
</div>
<label for="nama">Nama Akun</label>
control"value="{{$akun->nmakun}}">
</div>
</div>
<label for="klasifikasi">Klasifikasi Akun</label>
<select id="klasifikasi" name="klasifikasi"class="form-control">
<option value="{{$akun->klasifikasi}}">{{$akun-
>klasifikasi}}</option>
<option value="">--Pilih Klasifikasi--</option>
<option value="Harta">Harta</option>
<option value="Kewajiban">Kewajiban</option>
<option value="Modal">Modal</option>
<option value="Pendapatan">Pendapatan</option>
<option value="Biaya Atas Pendapatan">Biaya Atas Pendapatan</option>
<option value="Pengeluaran Operasional">Pengeluaran Operasional</opt
ion>
<option value="Pendapatan Lain">Pendapatan Lain</option>
</select>
</div>
<label for="no_hp">Sub Klasifikasi</label>
<input id="subklas" type="text" name="subklas" class="form-
control" value="{{$akun->subklasifikasi}}">
</div>
</div>
<input type="submit" class="btn btn-success btn-send" value="Update" >
</div><hr>
</fieldset>
</form>
@endsection
Untuk menampilkan halaman edit data akun, perlu ditambahkan kode pada file
AkunController.php pada action Edit dengan menuliskan kode berikut ini.

{
$akun_edit = \App\Akun::findOrFail($id);
return view( 'akun.edit' , ['akun' => $akun_edit]);

Untuk melihat hasil luarannya klik menu Edit pada halaman data akun, maka akan tampil
Untuk menyimpan perubahan data form edit data akun, buka file AkunController.php pada
action update masukan kode seperti dibawah ini.

{
$akun = \App\Akun::findOrFail($id);
$akun->kdakun=$request->get('kode');
$akun->nmakun=$request->get('nama');
$akun->klasifikasi=$request->get('klasifikasi');
$akun->subklasifikasi=$request->get('subklas');
$akun->save();
return redirect()->route( 'akun.index');

}
edit data yang dipilih melalui form edit data Akun dengan lengkap, lalu klik Update Data.
5. Menghapus data akun

Untuk menghapus data akun buka file AkunController.php kemudian tambahkan kode
dibawah ini pada action destroy.

{
$akun = \App\Akun::findOrFail($id);

$akun->delete();
return redirect()->route( 'akun.index');

}
Route::get('/akun/hapus/{kode}','AkunController@destroy');
yang dipilih aka dihapus, jika tidak maka akan kembali ke halaman data akun.

PERTEMUAN 11
Form Kas Keluar dan Buku Besar
11.1. Form Transaksi Kas Keluar

1. Membuat Controller KasKeluar
Buat controller resource baru dengan nama KasKeluar dengan menggunakan terminal
dengan perintah dibawah ini.
php artisan make:controller KasKeluarController --resource
Route::resource( '/kaskeluar', 'KaskeluarController');
Pada form transaksi kas keluar akan memanggil data akun, oleh karena itu pada file
KasKeluarController.php wajib menambahkan kode pada baris ke 6 dan 7 berikut ini.
use App\Akun;
use App\BukuBesar;
use DB;
Kode use App\Akun; diatas digunakan untuk pemanggilan model Akun untuk berinteraksi
dengan tabel akun, sedangkan use DB; digunakan untuk melakukan query pada tabel
dalam database.
2. Membuat tampilan halaman Kas Keluar

Buat folder baru dengan nama KasKeluar, kemudian buat file pada file tersebut dengan
cara klik kanan pada folder akun lalu pilih New File lalu berikan nama file
kaskeluar.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<h1 class="h3 mb-0 text-gray-800">Data Kas Keluar</h1>
</div><hr>
<a href="{{route('kaskeluar.create')}}" class="d-none d-sm-inline-
</div>

<thead>
<tr align="center">
<th width="20%">No Transaksi</th>
<th width="15%">Tanggal</th>
<th width="35%">Memo</th>
<th width="15%">Jumlah</th>
</tr>
</thead>
<tbody>
@foreach ($kaskeluar as $kk)
<tr>
<td>{{$kk->nokk}}</td>
<td>{{$kk->tglkk}}</td>
<td>{{$kk->memokk}}</td>
<td>{{$kk->jmkk}}</td>
<td align="center">
<a href="{{route( 'kaskeluar.show' ,[$kk ->id])}}" class="d-
none d-sm-inline-block btn btn-sm btn-dark shadow-sm">
<i class="fas fa-edit fa-sm text-white-50"></i> Detail
</a>
<a href="/kaskeluar/hapus/{{ $kk-
</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
@endsection
Untuk menampilkan data yang terdapat pada tabel kas_keluar pada halaman index kas
keluar, tambahkan kode untuk mengambil data pada file KasKeluarController.php, pada
action index tuliskan kode berikut ini.

{
$kk = \App\KasKeluar::All();
return view( 'kaskeluar.kaskeluar' , ['kaskeluar' => $kk]);
}

Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/kaskeluar
maka tampil seperti gambar dibawah ini.
3. Membuat tampilan input kas keluar.

Buat file baru dengan cara klik kanan pada folder kaskeluar lalu pilih New File lalu berikan
nama file input.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<form action="{{route('kaskeluar.store')}}" method="POST">
@csrf
<fieldset>
Nomor Transaksi<input id="notran" type="text" name="notrans" class="
form-control" value="{{$nomor}}" required>
</div>
Tanggal transaksi<input id="tgltr" type="date" name="tgltr" value=""
class="form-control" required>
</div>
</div>
Memo<textarea id="memo" type="text" name="memo" class="form-
control" required></textarea>
</div>
</div>
<hr>

Akun
@for($i=1;$i<=3;$i++)
<select id="idakun{{$i}}" name="idakun{{$i}}" class="form-control">
<option value="0">--Pilih Akun--</option>
@foreach ($akun as $akn)
<option value="{{$akn->id}}">{{$akn->kdakun}} | {{$akn-
>nmakun}}</option>
@endforeach
</select>
@endfor
</div>
Jumlah Pengeluaran
@for($i=1;$i<=3;$i++)
<input id="txt{{$i}}" type="text" name="txt{{$i}}" class="form-
control" value="0" onkeyup="sum();">
@endfor
<input id="idkk" type="hidden" name="idkk" class="form-
control" value="{{$nomorawal}}" required>
</div>
</div>
<div class="col-md-10">Total Pengeluaran
<input id="total" type="text" name="total" class="form-
control" required>
</div>
</div>
</div>
</div><hr>
</fieldset>
</form>
<script>
function sum() {
var text1 = document.getElementById('txt1').value;
var result = parseFloat(text1) + parseFloat(text2) + parseFloat(text3);
if (!isNaN(result)) {
document.getElementById('total').value = result;
}
}
</script>
@endsection

Untuk menampilkan halaman input data kas keluar dan penomoran otomatis, perlu
ditambahkan kode pada file KasKeluarController.php pada action create dengan
menuliskan kode berikut ini.

{
$akun = \App\Akun::All();
$akun2 = Akun::paginate(3);
$AWAL = 'KK';
// karna array dimulai dari 0 maka kita tambah di awal data kosong
// bisa juga mulai dari "1"=>"I"
$bulanRomawi = array("", "I","II","III", "IV", "V","VI","VII","VIII"
,"IX","X", "XI","XII");
$noUrutAkhir = \App\kaskeluar::max('id');
$nomorawal=$noUrutAkhir+1;
$no = 1;
if($noUrutAkhir) {
//echo "No urut surat di database : " . $noUrutAkhir;
//echo "<br>";
$nomor=sprintf($AWAL . '-' ."%05s", abs($noUrutAkhir + 1));
}
else
{
//echo "No urut surat di database : 0" ;
//echo "<br>";
$nomor=sprintf($AWAL . '-' ."%05s", $no);
}
return view('kaskeluar.input', ['nomor'=>$nomor,'nomorawal'=>$nomora
wal,'akun'=>$akun,'akn'=>$akun2]);
}
Untuk melihat hasil luarannya klik menu Tambah pada halaman data kas keluar, maka
akan tampil seperti dibawah ini.

Untuk menyimpan data yang diinput pada form input kas keluar, buka file
KasKeluarController.php pada action store masukan kode seperti dibawah ini.

{
//Menyimpan Data Ke Tabel Kas_Keluar
$save_kk = new \App\KasKeluar;
$save_kk->nokk=$request->get('notrans');
$save_kk->tglkk=$request->get('tgltr');
$save_kk->memokk=$request->get('memo');
$save_kk->jmkk=$request->get('total');
$save_kk->save();
//Menyimpan Data Ke Tabel Buku_Besar

$savebb= new \App\BukuBesar;
$savebb->idtrans=$request->get('idkk');
$savebb->notran=$request->get('notrans');
$savebb->catatan=$request->get('memo');
$savebb->jmldb=$request->get('total');
$savebb->jmlcr=0;
$savebb->save();
//Menyimpan Data Ke Tabel Kas_Keluar_det

for($i=1;$i<=3;$i++)
{
$idkk=$request->get('idkk');
$idakn=$request->get('idakun'.$i);
$nil=$request->get('txt'.$i);
if($idakn==0 or $nil==0 or empty($idakn))

{
return redirect()->route( 'kaskeluar.index' );
}
else{
$savedet = new \App\KasKeluarDet;
$savedet->idkk=$idkk;
$savedet->idakun=$idakn;
$savedet->nilcr=$nil;
$savedet->save();
}
}
return redirect()->route( 'kaskeluar.index' );
}
Input data melalui form input data transaksi kas keluar dengan lengkap, lalu klik simpan
data. Jika berhasil maka data akan bertambah.

4. Membuat form tampil transaksi kas keluar.

Buat file baru dengan cara klik kanan pada folder kaskeluar lalu pilih New File lalu berikan
nama file detail.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<form action="" method="POST">
@csrf
<fieldset>
Nomor Transaksi<input type="text" class="form-
control" value="{{$kaskeluar->nokk}}" disabled>
</div>
Tanggal transaksi<input type="date" value="{{$kaskeluar-
>tglkk}}" class="form-control" disabled>
</div>
</div>
Memo<textarea type="text" class="form-
control" disabled>{{$kaskeluar->memokk}}</textarea>
</div>
</div>
<div class="col-md-10">Total Pengeluaran
<input type="text" class="form-control" value="{{$kaskeluar-
>jmkk}}" disabled>
</div>
</div>
<div class="col-md-10">Data Akun Yang Digunakan
<table class="table table-bordered" width="100%" cellspacing="0">
<thead>
<tr align="center">
<td width="20%">Id Akun</td><td width="20%">Kode Akun</t
d><td width="30%">Jumlah Debit</td>
</tr>
<tbody>
@foreach ($kaskeluardet as $detail)
<tr align="center">
<td>{{$detail->kdakun}}</td><td>{{$detail-
>nmakun}}</td><td>{{$detail->nilcr}}</td>
</tr>
@endforeach
</tbody>
</thead>

</table>
</div>
</div>
</div>
</div><hr>
</fieldset>
</form>
@endsection
Untuk menampilkan halaman tampil data kaskeluar, perlu ditambahkan kode pada file
KasKeluarController.php pada action Show dengan menuliskan kode berikut ini.

{
$kk = \App\KasKeluar::findOrFail($id);
//Query Mengambil Data Detail
$detail = DB::select('SELECT akun.kdakun, akun.nmakun,kas_keluar_det
.nilcr FROM kas_keluar_det, akun WHERE akun.id=kas_keluar_det.idakun AND idk
k = :id', ['id' => $kk->id]);
return view( 'kaskeluar.detail' , ['kaskeluar' => $kk, 'kaskeluarde
t' => $detail]);
Untuk melihat hasil luarannya klik menu Detail pada halaman data kas keluar, maka akan

5. Menghapus data Kas Keluar

Untuk menghapus data kas keluar buka file KasKeluarController.php kemudian tambahkan
kode dibawah ini pada action destroy.

{
$kk = \App\KasKeluar::findOrFail($id);
$kk->delete();
DB::table('kas_keluar_det')->where('idkk','=',$kk->id)->delete();
DB::table('buku_besar')->where('notran','=', $kk->nokk)->delete();
return redirect()->route( 'kaskeluar.index');

}
Route::get('/kaskeluar/hapus/{id}','KaskeluarController@destroy');
yang dipilih aka dihapus, jika tidak maka akan kembali ke halaman data kas keluar.
11.2. Form Buku Besar

Buku besar merupakan rekapitulasi pendapatan dan pengeluaran yang telah dilakukan, data
yang tersimpan pada buku besar merupakan data otomatis dari transaksi kas masuk dan kas
keluar. Oleh karena itu pada halaman buku besar tidak perlu dibuat CRUD, namun hanya
membuat halaman untuk menampilkan data transaksi yang sudah terjadi.
Untuk membuat halaman tampilan data buku besar perlu dibuat controller, oleh karena itu buat
controller baru dengan nama BukubesarController melalui terminal dengan perintah berikut
ini.
php artisan make:controller BukubesarController
Route::resource( '/bukubesar' , 'BukubesarController' );
Untuk membuat tampilan halaman buku besar, buat folder baru dengan nama bukubesar,
kemudian buat file pada file tersebut dengan cara klik kanan pada folder akun lalu pilih New
File lalu berikan nama file bukubesar.blade.php kemudian ketikan kode seperti dibawah ini.
@section('content')
<h1 class="h3 mb-0 text-gray-800">Data Buku Besar</h1>
</div><hr>

<thead>
<tr align="center">
<th width="15%">Tanggal Transaksi</th>
<th width="35%">Catatan</th>
<th width="15%">Debet</th>
<th width="15%">Kredit</th>
</tr>
</thead>
<tbody>
@foreach ($bukubesar as $bb)
<tr align="center">
<td>{{$bb->notran}}</td>
<td>{{$bb->tgltran}}</td>
<td>{{$bb->catatan}}</td>
<td>Rp. {{$bb->jmldb}}</td>
<td>Rp. {{$bb->jmlcr}}</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
@endsection
Untuk menampilkan data yang terdapat pada tabel buku_besar pada halaman index
bukubesar, tambahkan kode untuk mengambil data pada file BukubesarController.php, pada
action index tuliskan kode berikut ini.

{
$bb = \App\Bukubesar::orderBy('created_at', 'DESC')->get();
return view( 'bukubesar.bukubesar' , ['bukubesar' => $bb]);
}
Untuk melihat hasil luarannya ketik pada web browser url http://localhost:8000/bukubesar
maka tampil seperti gambar dibawah ini.

Tugas:
1. Buatlah tabel baru dengan nama kas_masuk dan kas_masuk_det dengan struktur
seperti dibawah ini dengan menggunakan migration dan model.
Tabel Kas_masuk
Nokm Varchar 10
tglkm Date
Memokm Text
Jmlkmd double
Tabel Kas_masuk_det
Idkm Int 20 Foreign Key
Idakun Int 20 Foreign Key
Nildb Double
2. Buat halaman transaksi kas masuk dengan konsep yang sama seperti transaksi kas
keluar, namun pada transaksi kas masuk semua jumlah pemasukan akan tersimpan
pada debit seperti gambar dibawah ini.
a. Tampil Data Kas Masuk.

b. Input Kas Masuk.
c. Detail kas masuk.
d. Hapus kas masuk.

PERTEMUAN 12
Laporan & Menu Navigasi
12.1. Pembuatan Laporan
Laporan yang dibuat terdiri dari tiga jenis yaitu laporan buku besar, laporan kas keluar dan
laporan kas masuk dimana ketiga laporan tersebut bisa mencetak data per periode.
1. Install library DOMPDF.
Salah satu cara untuk membuat laporan dengan format PDF pada Laravel adalah dengan
menggunakan library DOMPDF, library tersebut merupakan library PHP yang bisa
digunakan untuk membuat laporan dengan format PDF, konsep DOMPDF adalah
mengubah halaman atau konten web menjadi file format PDF.
Tahap pertama yang harus dilakukan adalah melakukan pemasangan library DOMPDF
pada project dengan cara mendownload package DOMPDF menggunakan composer
melalui terminal. Perintah untuk mendownload package DOMPDF adalah sebagai berikut.
Composer require barryvdh/laravel-dompdf
Jika proses download dan pemasangan berhasil akan muncul notifikasi pada terminal
Tunggu sampai proses download dan pemasangan package selesai. Kemudian lakukan
integrasi package DOMPDF dengan project yang dibuat dengan cara menambahkan class
DOMPDF pada file app.php yang terdapat pada folder “\config”. Buka file app.php lalu
pada bagian providers dan aliases tambahkan kode seperti dibawah ini.
'providers' => [
.........
Barryvdh\DomPDF\ServiceProvider::class,
],
'aliases' => [
.........
'PDF' => Barryvdh\DomPDF\Facade::class,
],

Simpan kembali file app.php tersebut, maka library DOMPDF siap digunakan untuk
membuat laporan dengan format PDF paa project.
2. Membuat controller laporan.

Buat controller baru dengan nama laporanController melalui terminal dengan kode seperti
dibawah ini.
Php artisan make:controller LaporanController
Buka file laporanController.php yang sudah dibuat, pada file tersebut akan dibuat dua action
yaitu index() untuk menampilkan halaman utama laporan dan show() untuk mencetak
laporan dalam format PDF. Tambahkan kode pada file laporanController.php seperti
dibawah ini.
<?php
use PDF;
use DB;
class LaporanController extends Controller

{
{
return view('laporan');
}
public function show(Request $request)

{
$periode=$request->get('periode');
$jenis=$request->get('jenis');
if($jenis=='bukubesar')
{
if($periode == 'All')
{
$bb = \App\BukuBesar::All();
$pdf = PDF::loadview('bukubesar.bukubesar_pdf',['bukubesa
r'=>$bb])->setPaper('A4','landscape');
return $pdf->stream();
}elseif($periode == 'periode'){
$tglawal=$request->get('tglawal');
$tglakhir=$request->get('tglakhir');
$bb=DB::table('buku_besar')
->whereBetween('tgltran', [$tglawal,$tglakhir])
->orderby('tgltran','ASC')
->get();
$pdf = PDF::loadview('bukubesar.bukubesar_pdf',['bukubesa
r'=>$bb])->setPaper('A4','landscape');
}

}
elseif($jenis=='kaskeluar')
{
{
$data = \App\KasKeluar::All();
$pdf = PDF::loadview('kaskeluar.kaskeluar_pdf',['kaskelua
r'=>$data])->setPaper('A4','landscape');
$data=DB::table('kas_keluar')
->whereBetween('tglkk', [$tglawal,$tglakhir])
->orderby('tglkk','ASC')
->get();
$pdf = PDF::loadview('kaskeluar.kaskeluar_pdf',['kaskelua
r'=>$data])->setPaper('A4','landscape');
}
}
elseif($jenis=='kasmasuk')
{
{
$data = \App\KasMasuk::All();
$pdf = PDF::loadview('kasmasuk.kasmasuk_pdf',['kasmasuk'=
>$data])->setPaper('A4','landscape');
$data=DB::table('kas_masuk')
->whereBetween('tglkm', [$tglawal,$tglakhir])
->orderby('tglkm','ASC')
->get();
$pdf = $pdf = PDF::loadview('kasmasuk.kasmasuk_pdf',['kas
masuk'=>$data])->setPaper('A4','landscape');
}
}
}
}
Penjelasan Kode:
a. PDF::loadview digunakan untuk mengkonversi tampilan pada file laporan kedalam

bentuk PDF.
b. setPaper('A4','landscape') digunakan untuk mengatur ukuran kertas dan posisi
laporan yang akan ditampilkan.

c. $pdf->stream() digunakan untuk menampilkan laporan dalam format PDF yang

telah dibuat. Fungsi stream() bisa diganti dengan save(lokasi_penyimpanan,
‘namafile.pdf’) untuk menyimpan file pdf pada lokasi yang ditentukan dan
download(‘namafile.pdf’) untuk mengunduh otomatis file pdf.
d. $data=DB::table('kas_keluar')->whereBetween('tglkk', [$tglawal,tglakhir])-
>orderby('tglkk','ASC')->get() digunakan untuk menyeleksi data berdasarkan
tanggal transaksi yang ditentukan.
3. Membuat tampilan halaman laporan.

Buat file baru pada folder “\views” dengan nama laporan.blade.php lalu masukan kode
berikut ini.
@section('content')
<div class="card">
<div class="card-
header">Laporan Transaksi Buku Besar</div>
<form action="/laporan/bukubesar" method="PUT" target="_b
lank">
@csrf
<fieldset>
<label for="klasifikasi">Periode Transaksi
Buku Besar</label>
<input id="jenis" type="hidden" name="jenis"
value="bukubesar" class="form-control">
<select id="periode" name="periode"class="for
m-control">
<option value="">--Pilih Periode Laporan--
</option>
<option value="All">Semua</option>
<option value="periode">Per Periode</option>
</select>
</div>
<label for="no_hp">Tanggal Awal</label>
<input id="tglawal" type="date" name="tglawal
" class="form-control">
</div>
<label for="no_hp">Tanggal Akhir</label>
<input id="tglakhir" type="date" name="tglakh
ir" class="form-control">
</div>
</div>

<input type="submit" class="btn btn-success btn-
send" value="Cetak" >
</div>
</fieldset>
</form>
</div>
</div>
<div class="card">
<div class="card-
header">Laporan Transaksi Kas Keluar</div>
<form action="/laporan/kaskeluar" method="PUT" target="_b
lank">
@csrf
<fieldset>
<label for="klasifikasi">Periode Transaksi</l
abel>
value="kaskeluar" class="form-control">
m-control">
</option>
</select>
</div>
</div>
</div>
</div>
</div>
</fieldset>
</form>
</div>
</div>

<div class="card">
<div class="card-header">Laporan Kas Masuk</div>
<form action="/laporan/kaskeluar" method="PUT" target="_b
lank">
@csrf
<fieldset>
<label for="klasifikasi">Periode Transaksi
kas Masuk</label>
value="kasmasuk" class="form-control">
m-control">
</option>
</select>
</div>
</div>
</div>
</div>
</div>
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
Buat route baru untuk mengatur jalur halaman laporan, buka file web.php pada folder
routes kemudian tambahkan kode berikut ini.
Route::resource( '/laporan' , 'LaporanController' );

Untuk melihat hasil luaran tampilan laporan, masukan url pada web browser
127.0.0.1:8000/laporan, maka tampilan halaman laporan akan seperti gambar dibawah ini.
4. Membuat laporan pdf buku besar.

Buat file baru pada folder bukubesar dengan nama bukubesar_pdf.blade.php kemudian
masukan kode berikut ini.
<!DOCTYPE html>
<html>
<head>
<title>Laporan Buku Besar</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/
4.3.1/css/bootstrap.min.css" integrity="sha384-
ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigi
n="anonymous">
<style type="text/css">
table tr td,
table tr th{
font-size: 10pt;
}
</style>
</head>
<body>
<table class="table table-bordered" width="100%" align="center">
<tr align="center"><td><h2>Laporan Buku Besar<br>PT. XYZ</h2><hr></td></
tr>
</table>
<thead>
<tr>
<th width="5%">No</th>

<th width="15%">Tanggal Transaksi</th>

<th width="25%">Catatan</th>
<th width="15%">Debet</th>
<th width="15%">Kredit</th>
</tr>
</thead>
<tbody>
@php $i=1 @endphp
@foreach ($bukubesar as $bb)
<tr align="center">
<td>{{$i++}}</td>
<td>{{$bb->notran}}</td>
<td>{{$bb->tgltran}}</td>
<td>{{$bb->catatan}}</td>
<td>{{$bb->jmldb}}</td>
<td>{{$bb->jmlcr}}</td>
</tr>
@endforeach
</tbody>
</table>
<div align="right">
<h6>Tanda Tangan</h6><br><br><h6>{{ Auth::user()->name }}</h6>
</div>
</body>
</html>
Penjelasan Kode:
Kode diatas merupakan kode untuk membuat tampilan laporan buku besar dalam format
PDF. Untuk melihat hasilnya pilih periode transaksi pada halaman bagian laporan buku
besar kemudian klik tombol cetak, maka hasil luaran dari kode diatas adalah seperti
gambar dibawah ini.

5. Membuat laporan pdf kas keluar.

Buat file baru pada folder kaskeluar dengan nama kaskeluar_pdf.blade.php kemudian
<!DOCTYPE html>
<html>
<head>
<title>Laporan Kas Keluar</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/boots
trap/4.3.1/css/bootstrap.min.css" integrity="sha384-
ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossor
igin="anonymous">
table tr td,
table tr th{
font-size: 10pt;
}
</style>
</head>
<body>
<tr align="center"><td><h2>Laporan Kas keluar<br>PT. XYZ</h2><hr></td
></tr>
</table>
<thead>
<tr align="center">
</tr>
</thead>
<tbody>
@php $i=1 @endphp
@foreach ($kaskeluar as $kk)
<tr>
<td>{{$i++}}</td>
<td>{{$kk->nokk}}</td>
<td>{{$kk->tglkk}}</td>
<td>{{$kk->memokk}}</td>
<td>{{$kk->jmkk}}</td>
</tr>
@endforeach
</tbody>
</table>
<div align="right">


</div>
</body>
</html>
Penjelasan Kode:
Kode diatas merupakan kode untuk membuat tampilan laporan kas keluar dalam format
PDF. Untuk melihat hasilnya pilih periode transaksi pada halaman bagian laporan kas
keluar kemudian klik tombol cetak, maka hasil luaran dari kode diatas adalah seperti
gambar dibawah ini.
6. Membuat laporan pdf kas masuk.

Buat file baru pada folder kaskeluar dengan nama kasmasuk_pdf.blade.php kemudian
<!DOCTYPE html>
<html>
<head>
<title>Laporan Kas Masuk</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/boots
trap/4.3.1/css/bootstrap.min.css" integrity="sha384-
ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossor
igin="anonymous">
table tr td,
table tr th{
font-size: 10pt;
}
</style>
</head>
<body>

<tr align="center"><td><h2>Laporan Kas Masuk<br>PT. XYZ</h2><hr></td>

</tr>
</table>
<thead>
<tr align="center">
</tr>
</thead>
<tbody>
@php $i=1 @endphp
@foreach ($kasmasuk as $km)
<tr>
<td>{{$i++}}</td>
<td>{{$km->nokm}}</td>
<td>{{$km->tglkm}}</td>
<td>{{$km->memokm}}</td>
<td>{{$km->jmkm}}</td>
</tr>
@endforeach
</tbody>
</table>
<div align="right">
</div>
</body>
</html>
Penjelasan Kode:
Kode diatas merupakan kode untuk membuat tampilan laporan kas masuk dalam format
PDF. Untuk melihat hasilnya pilih periode transaksi pada halaman bagian laporan kas
masuk kemudian klik tombol cetak, maka hasil luaran dari kode diatas adalah seperti
gambar dibawah ini.

12.2. Pembuatan Menu Navigasi

Setelah semua modul dan laporan dibuat, selanjutnya akan dibuat menu navigasi untuk
mempermudah pengguna dalam mengakses modul yang tersedia dalam web. Pada file
layout.blade.php sudah terdapat menu namun belum disesuaikan dengan modul atau konten.
Oleh karena itu pada pembahasan ini akan dijelaskan pembuatan menu utama.
Buka file layout.blade.php yang terdapat pada folder “resources/views/layout/”, Hapus kode
pada baris 44 sampai dengan 86 kemudian ganti dengan kode berikut ini.
<li class="nav-item">
<a class="nav-link collapsed" href="#" data-
toggle="collapse" data-target="#collapsePages" aria-expanded="true" aria-
controls="collapsePages">
<i class="fas fa-fw fa-folder-open"></i>
<span>Menu Master</span>
</a>
<div id="collapsePages" class="collapse" aria-
labelledby="headingPages" data-parent="#accordionSidebar">
<div class="bg-white py-2 collapse-inner rounded">
<a class="collapse-item fas fa-arrow-circle-
right" href="{{route('user.index')}}"> Data Pengguna</a>
right" href="{{route('akun.index')}}"> Data Akun</a>
</div>
</div>
</li>
<a class="nav-link collapsed" href="#" data-
toggle="collapse" data-target="#collapsePages1" aria-
expanded="true" aria-controls="collapsePages1">
<i class="fas fa-fw fa-folder-open"></i>
<span>Menu Transaksi</span>
</a>
<div id="collapsePages1" class="collapse" aria-
labelledby="headingPages" data-parent="#accordionSidebar">

<div class="bg-white py-2 collapse-inner rounded">

right" href="{{route('kasmasuk.index')}}"> Kas Masuk</a>
right" href="{{route('kaskeluar.index')}}"> Kas Keluar</a>
right" href="{{route('bukubesar.index')}}"> Buku Besar</a>
</div>
</div>
</li>

<a class="nav-link" href="{{route('laporan.index')}}">
<i class="fas fa-fw fa-table"></i>
<span>Laporan</span></a>
</li>
<a class="nav-link" href="#" data-toggle="modal" data-
target="#logoutModal">
<i class="fas fa-fw fa-share"></i>
<span>Keluar</span></a>
</li>
Untuk melihat hasil tampilannya jalankan perintah php artisan serve melalui terminal,
kemudian masukan url pada web browser 127.0.0.1:8000/login, masukan email dan
password untuk masuk ke halaman home admin. Maka tampilan menu utama saat ini sudah
berubah menjadi seperti gambar dibawah ini.

PERTEMUAN 13
Review dan Pembahasan Tugas

PERTEMUAN 14 & 15
Presentasi Tugas Kelompok

Daftar Pustaka
Abdulloh, Rohi. 2018. “7 in 1 Pemrograman Web Tingkat Lanjut”. Jakarta: Elex Media
Komputindo.
Akbar, Nuris. “Membuat Laporan PDF Dengan DOMPDF Pada Laravel”.

https://belajarphp.net/laporan-pdf-dompdf-laravel/ (diakses pada bulan Juni 2020)
Azamudin, Muhammad. Mukhlasin, Hafid. 2018. "Laravel: The PHP framework for web
artisans". Jakarta: Kungfu Koding.
Hadi, Diki Alfarabi. 2019. "Membuat Laporan PDF dengan DOMPDF".

https://www.malasngoding.com/membuat-laporan-pdf-dengan-dompdf-laravel/ (diakses
pada bulan Juni 2020)
________. 2019. "Session Laravel". https://www.malasngoding.com/session-laravel/ (diakses

pada bulan Mei 2020)
________. 2019. “Sistem Template Blade Laravel”. https://www.malasngoding.com/sistem-

template-blade-laravel/ (diakses pada bulan Mei 2020)
Junirianto, Eko. 2018. "Pemrograman Web Dengan Framework Laravel". Ponorogo: Penerbit
Wade.
Kiddy. 2017. "Tutorial Laravel 5.4-Templating". https://medium.com/@kiddy.xyz/halo-semua-

kali-ini-gue-mau-ngajarin-templating-pake-laravel-9e3510f8a5ef (diakses pada bulan
mei 2020)
Sandi, Anugrah. 2019. "Mengolah Data Relasi Antar Table Menggunakan Eloquent".
https://daengweb.id/mengolah-data-relasi-antar-table-menggunakan-eloquent (diakses
pada bulan mei 2020)
Supardi, Yuniar. Sulaeman. 2019. "Semua Bisa Menjadi Programmer Laravel Basic". Jakarta:
Elex Media Komputindo.
Yudhanto, Yudho. Prasetyo, Helmi Adi. 2019. "Mudah Menguasai Framework Laravel".
Jakarta: Elex Media Komputindo.

MODUL PU1 Laravel Ok

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

MODUL PU1 Laravel Ok

Diunggah oleh

Hak Cipta:

Format Tersedia

MODUL PRAKTIKUM

Fakultas Teknik dan Informatika

Modul praktikum ini dibuat sebagai pendukung proses pembelajaran matakuliah

Jakarta, Juli 2021

1. Adi Supriyatna, M.Kom

Penggunaan Laravel bertujuan untuk meningkatkan kualitas perangkat lunak dengan

1.1.1. Sejarah Laravel

Program Studi Sistem Informasi Akuntansi

Versi: Tanggal rilis Versi: Tanggal rilis

1.0 01 Juni 2011 5.1 LTS 09 Juni 2015

1.1.2. Fitur Unggulan Laravel

1.2. Arsitektur Laravel

Program Studi Sistem Informasi Akuntansi

Program Studi Sistem Informasi Akuntansi

1.3. Instalasi dan Konfigurasi

Program Studi Sistem Informasi Akuntansi

1.3.1. Instalasi Xampp

Program Studi Sistem Informasi Akuntansi

5. Tunggu beberapa menit hingga proses intalasi selesai.

Program Studi Sistem Informasi Akuntansi

6. Setelah proses pemasangan selesai, akan muncul pemberitahuan untuk langsung

1.3.2. Instalasi Composer

Program Studi Sistem Informasi Akuntansi

Program Studi Sistem Informasi Akuntansi

5. Untuk memastikan bahwa Composer sudah terinstall, bisa dilakukan dengan

d. Ketik exit pada commandprompt untuk menutup commandprompt.

Program Studi Sistem Informasi Akuntansi

1.4. Memulai Project Laravel.

c. Jika berhasil maka direktori path pada terminal akan berubah.

1.4.2. Unduh Laravel Installer

Program Studi Sistem Informasi Akuntansi

1.4.3. Membuat aplikasi Laravel baru

composer create-project --prefer-dist laravel/laravel="^7.0" NamaProject

composer create-project --prefer-dist laravel/laravel="^7.0" LaravelSIA

Program Studi Sistem Informasi Akuntansi

path direktori pada terminal berubah menjadi “C:\xampp\htdocs\laravelSIA” seperti gambar

Program Studi Sistem Informasi Akuntansi

Terdapat empat jenis route yang terdapat pada Laravel, yaitu:

Mendefinisikan route - Buka file routes/web.php lalu tambahkan kode berikut,

Program Studi Sistem Informasi Akuntansi

“php artisan make:controller NamaController”.

Contoh: Buat sebuah controller dengan nama DasarController.

Program Studi Sistem Informasi Akuntansi

Latihan Route dan Controller

public function index()

1.5. Struktur Navigasi

Program Studi Sistem Informasi Akuntansi

1. Struktur Navigasi Linier

2. Struktur Navigasi Hirarki

Program Studi Sistem Informasi Akuntansi

3. Struktur Navigasi Non-Linier

4. Struktur Navigasi Campuran

Program Studi Sistem Informasi Akuntansi

Program Studi Sistem Informasi Akuntansi

File Mahasiswa.php tersebut berisi kode seperti ini.

class Mahasiswa extends Model

Program Studi Sistem Informasi Akuntansi

Program Studi Sistem Informasi Akuntansi

php artisan make:controller LatihanController

File LatihanController.php tersebut berisi kode seperti ini.

Program Studi Sistem Informasi Akuntansi

class LatihanController extends Controller

Kode diatas menjelaskan ketika mengakses localhost:8000/home maka akan diarahkan

2.4. HTML (HyperText Markup Language)