{"id":48482,"date":"2024-07-19T08:26:05","date_gmt":"2024-07-19T01:26:05","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=48482"},"modified":"2024-09-09T08:46:18","modified_gmt":"2024-09-09T01:46:18","slug":"belajar-laravel-bagian-3","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/belajar-laravel-bagian-3\/","title":{"rendered":"Belajar Laravel Bagian 3 : Model &#8211; View &#8211; Controller"},"content":{"rendered":"\n<p>Pada series belajar laravel sebelumnya, kita telah belajar tentang <a href=\"https:\/\/www.rumahweb.com\/journal\/belajar-laravel-bagian-2\/\">route dan view di Laravel<\/a>. Pada lanjutan series belajar Laravel bagian 3, kita akan belajar lebih dalam mengenai konsep MVC (Model-View-Controller) di Laravel.<\/p>\n\n\n\n\n\n<h2 class=\"wp-block-heading\">Apa itu konsep MVC?<\/h2>\n\n\n\n<p>Sebagaimana kebanyakan bahasa pemrograman lainnya, <a href=\"https:\/\/www.rumahweb.com\/journal\/laravel-adalah\/\" target=\"_blank\" rel=\"noopener\" title=\"laravel adalah\">Laravel<\/a> juga menggunakan konsep MVC untuk membangun program dan aplikasi. Konsep MVC digunakan untuk memisahkan logika program aplikasi menjadi tiga komponen utama, yakni:<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Model<\/h3>\n\n\n\n<p>Model adalah bagian yang bertugas untuk mengelola data dari database. Pada bagian ini, berisi logika pengolahan data seperti mengambil, menyimpan, merubah, menghapus data.<br \/><br \/>Laravel menggunakan Eloquent ORM (Object-Relational Mapping) untuk memudahkan dalam berinteraksi dengan database. Model di Laravel terletak pada path directory\u201c<strong>app\/Models<\/strong>\u201d. Saat Anda membuat Model baru, maka pembuatan file modelnya berada di folder tersebut.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">View<\/h3>\n\n\n\n<p>View bertugas sebagai tampilan website atau aplikasi. Data yang ditampilkan oleh view bisa berupa HTML, JSON, XML.<br \/><br \/>Letak path directory view ada di \u201c<strong>resources\/views<\/strong>\u201d. Di Laravel pembuatan view menggunakan <em>blade templating engine<\/em>. File view ditulis dengan format namafile.blade.php.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Controller<\/h3>\n\n\n\n<p>Controller bertugas sebagai penghubung antara Model dan View. Controller mendapatkan input dari pengguna melalui HTTP Request, selanjutnya memproses input yang diterima tersebut dengan berinteraksi dengan Model. Terakhir mengembalikan hasilnya pada View untuk ditampilkan ke pengguna.&nbsp;<br \/><br \/>Controller berada di path directory \u201c<strong>app\/Http\/Controllers<\/strong>\u201d. Controller yang akan berperan pada logika aplikasi dengan berinteraksi dengan Model dan View.<\/p>\n\n\n\n<p>Arsitektur MVC memisahkan antara logika, tampilan, serta kontroler sehingga membuat mudah dalam pemeliharaan dan pengembangan aplikasi secara menyeluruh.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Contoh Sederhana MVC di Laravel<\/h2>\n\n\n\n<p>Selanjutnya, kita akan mempraktikan cara membuat code sederhana menggunakan konsep MVC di Laravel.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 1. Membuat Database di phpMyAdmin<\/h3>\n\n\n\n<p>Silakan Anda <a href=\"https:\/\/www.rumahweb.com\/journal\/cara-membuat-database\/#Cara_membuat_database_di_XAMPP_localhost\">membuat database di locahost<\/a> melalui PHPMyAdmin. Sebagai contoh, kami membuat database dengan nama <strong>dbrw-laraveltutorial<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel.png\"><img loading=\"lazy\" decoding=\"async\" width=\"637\" height=\"252\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel.png\" alt=\"membuat database laravel\" class=\"wp-image-48492\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel.png 637w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel-300x119.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel-370x146.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel-270x107.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/membuat-database-laravel-570x225.png 570w\" sizes=\"auto, (max-width: 637px) 100vw, 637px\" \/><\/a><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 2. Isi Sample Data<\/h3>\n\n\n\n<p>Setelah itu, silakan inputkan script berikut dikolom SQL, untuk membuat table dan mengisi <em>sample <\/em>datanya.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/import-sql-database-laravel.png\"><img loading=\"lazy\" decoding=\"async\" width=\"426\" height=\"76\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/import-sql-database-laravel.png\" alt=\"import sql database laravel\" class=\"wp-image-48491\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/import-sql-database-laravel.png 426w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/import-sql-database-laravel-300x54.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/import-sql-database-laravel-370x66.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/import-sql-database-laravel-270x48.png 270w\" sizes=\"auto, (max-width: 426px) 100vw, 426px\" \/><\/a><\/figure>\n\n\n\n<p>Isi data berikut.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>-- Membuat database\nCREATE DATABASE IF NOT EXISTS sekolah;\n\n-- Menggunakan database yang telah dibuat\nUSE sekolah;\n\n-- Membuat tabel siswa\nCREATE TABLE IF NOT EXISTS siswa (\n    id INT AUTO_INCREMENT PRIMARY KEY,\n    nama VARCHAR(100) NOT NULL,\n    alamat VARCHAR(255),\n    tanggal_lahir DATE\n);\n\n-- Menambahkan beberapa contoh data siswa\nINSERT INTO siswa (nama, alamat, tanggal_lahir) VALUES\n('Andi Pratama', 'Jl. Jogja No. 10, Jakarta', '2005-01-15'),\n('Benny Santoso', 'Jl. Kuningan No. 5, Batang', '2004-11-20'),\n('Cici Dewi', 'Jl. Sukajadi No. 12, Solo', '2005-05-30'),\n('Dedi Permadi', 'Jl. Cempaka No. 8, Jakarta', '2004-07-25'),\n('Eni Putri', 'Jl. Melati No. 7, Yogyakarta', '2005-09-10');<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Step 3. Sesuaikan Config Database<\/h3>\n\n\n\n<p>Lakukan pengaturan config database di file <strong>.env<\/strong>.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>DB_CONNECTION=mysql\nDB_HOST=127.0.0.1\nDB_PORT=3306\nDB_DATABASE=dbrw-laraveltutorial\nDB_USERNAME=root\nDB_PASSWORD=<\/code><\/pre>\n\n\n\n<p><strong>Keterangan<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>DB_Database adalah nama database yang telah Anda buat.<\/li>\n\n\n\n<li>DB_Username adalah nama user databasenya. Secara default berisi root.&nbsp;<\/li>\n\n\n\n<li>DB_Password&nbsp; adalah password databasenya. Biasanya dilocalhost kosong<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Step 4. Model<\/h3>\n\n\n\n<p>Membuat model \u201cSiswa\u201d yang mana model ini akan berinterakhir dengan tabel \u201csiswa\u201d yang ada di database. Perintah artisannya sebagai berikut.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>php artisan make:model Siswa<\/code><\/pre>\n\n\n\n<p>Edit Model Siswa.php yang letak model siswa berada di direktori&nbsp; \u201c<strong>app\/Models\/Siswa.php<\/strong>\u201d.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php\n\nnamespace App\\Models;\n\nuse Illuminate\\Database\\Eloquent\\Factories\\HasFactory;\nuse Illuminate\\Database\\Eloquent\\Model;\n\nclass Siswa extends Model\n{\n    use HasFactory;\n\t\n\t\/\/ Nama tabel di database\n    protected $table = 'siswa';\n\n    \/\/ Kolom-kolom yang dapat diisi secara massal\n    protected $fillable = &#091;'nama', 'alamat'];\n\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Step 5. Controller<\/h3>\n\n\n\n<p>Selanjutnya membuat SiswaController untuk mengambil data yang ada di Model, kemudian mengirimkannya ke View. Membuat Controller menggunakan perintah artisan berikut.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>php artisan make:controller SiswaController<\/code><\/pre>\n\n\n\n<p>Letak filenya ada di app\/Http\/Controllers\/SiswaController.php. Isi file SiswaController.php menggunakan code berikut.&nbsp;<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php\n\nnamespace App\\Http\\Controllers;\n\nuse App\\Models\\Siswa;\nuse Illuminate\\Http\\Request;\n\nclass SiswaController extends Controller\n{\n    public function index()\n    {\n        \/\/ Mengambil semua data siswa\n        $siswa = Siswa::all();\n        \n        \/\/ Mengirim data ke view\n        return view('siswa.index', &#091;'siswa' =&gt; $siswa]);\n    }\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Step 6. View<\/h3>\n\n\n\n<p>Membuat view untuk menampilkan data Siswa, letak filenya ada di <em>resources\/views\/siswa\/index.blade.php<\/em>. Pastikan setelah folder Views Anda membuat folder siswa. Nantinya letak file index.blade.php berada didalam folder siswa.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\n&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n&lt;head&gt;\n    &lt;meta charset=\"UTF-8\"&gt;\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n    &lt;title&gt;Data Siswa&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n    &lt;h1&gt;Data Siswa&lt;\/h1&gt;\n    &lt;table border=\"1\"&gt;\n        &lt;thead&gt;\n            &lt;tr&gt;\n                &lt;th&gt;ID&lt;\/th&gt;\n                &lt;th&gt;Nama&lt;\/th&gt;\n                &lt;th&gt;Alamat&lt;\/th&gt;\n            &lt;\/tr&gt;\n        &lt;\/thead&gt;\n        &lt;tbody&gt;\n            @foreach($siswa as $s)\n                &lt;tr&gt;\n                    &lt;td&gt;{{ $s-&gt;id }}&lt;\/td&gt;\n                    &lt;td&gt;{{ $s-&gt;nama }}&lt;\/td&gt;\n                    &lt;td&gt;{{ $s-&gt;alamat }}&lt;\/td&gt;\n                &lt;\/tr&gt;\n            @endforeach\n        &lt;\/tbody&gt;\n    &lt;\/table&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Step 7. Routing<\/h3>\n\n\n\n<p>Sesuaikan Route yang berada di <strong>routes\/web.php <\/strong>untuk mengakses controller <strong>SiswaController<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>use App\\Http\\Controllers\\SiswaController;\n\n\/\/ Route untuk menampilkan data siswa\nRoute::get('\/siswa', &#091;SiswaController::class, 'index']);<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Step 8. Jalankan Aplikasi Laravel<\/h3>\n\n\n\n<p>Untuk menjalankan aplikasi Laravel di localhost menggunakan perintah artisan.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>php artisan serve<\/code><\/pre>\n\n\n\n<p>Akses aplikasi di browser dengan URL: <strong>http:\/\/localhost:8000\/siswa<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/contoh-mvc-laravel.png\"><img loading=\"lazy\" decoding=\"async\" width=\"461\" height=\"308\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/contoh-mvc-laravel.png\" alt=\"contoh mvc laravel - belajar laravel bagian 3\" class=\"wp-image-48490\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/contoh-mvc-laravel.png 461w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/contoh-mvc-laravel-300x200.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/contoh-mvc-laravel-370x247.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/contoh-mvc-laravel-270x180.png 270w\" sizes=\"auto, (max-width: 461px) 100vw, 461px\" \/><\/a><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Kesimpulan<\/h2>\n\n\n\n<p>MVC adalah singkatan dari Model, View, dan Controller, yaitu arsitektur yang digunakan untuk memisahkan logika aplikasi menjadi 3 bagian. Model bertanggung jawab atas pengelolaan data dan aturan, View mengatur tampilan antarmuka pengguna, sedangkan Controller berfungsi menghubungkan keduanya serta menangani aliran data dan logika aplikasi.<\/p>\n\n\n\n<p>Demikian series belajar Laravel bagian 3 yang menjelaskan tentang arsitektur MVC di Laravel. Simak series lanjutan kami di artikel berikutnya.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Pada series belajar laravel sebelumnya, kita telah belajar tentang route dan view di Laravel. Pada lanjutan series belajar Laravel bagian 3, kita akan belajar lebih dalam mengenai konsep MVC (Model-View-Controller) di Laravel. Apa itu konsep MVC? Sebagaimana kebanyakan bahasa pemrograman lainnya, Laravel juga menggunakan konsep MVC untuk membangun program dan aplikasi. Konsep MVC digunakan untuk [&hellip;]<\/p>\n","protected":false},"author":319,"featured_media":48606,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[7],"tags":[1587,796,1497],"class_list":{"0":"post-48482","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-web-programming","8":"tag-belajar-laravel","9":"tag-laravel","10":"tag-tutorial-laravel"},"aioseo_notices":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/banner-belajar-laravel-bagian-3.png","jetpack_shortlink":"https:\/\/wp.me\/p8n3G7-cBY","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/48482","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/319"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=48482"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/48482\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/48606"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=48482"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=48482"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=48482"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}