UDACODING

Posts

Simple Route With Laravel

58 Simple Route With Laravel

Pengenalan

Saat kita mengakses sebuah website, pasti kita familiar dengan sesuatu seperti domain.com/home atau mungkin domain.com/login . Yap! Biasanya setiap halaman pada sebuah website memiliki kata kunci yang berbeda-beda. Contohnya, saat kita mengakses halaman login, biasanya URL yang kita akses adalah  domain.com/login dari sebuah website, atau dalam dunia pemrograman kami menyebutnya dengan endpoint atau routing.

Oleh karena itu di kesempatan kali ini, kita akan sedikit mempelajari soal routing, dan untuk platform yang akan kita gunakan adalah Laravel PHP Framework.

Persiapan

Membuat Project

Oke, pertama-tama kita akan membuat _project _baru dengan nama test-routing. Kita bisa menggunakan perintah di bawah ini untuk membuatnya.

Menggunakan Laravel Installer


$ laravel new test-routing

Menggunakan Composer Create-Project


$ composer create-project laravel/laravel test-routing

Jika project sudah di buat, kita masuk dulu ke directory project kita dengan menggunakan $ cd test-routing, setelah itu kita jalankan php artisan serve untuk menyalakan web server yang biasanya akan berjalan di http://localhost:8000:


$ cd test-routing

$ php artisan serve

Buka Di Browser

Setelah web server berjalan, kita coba buka browser, kemudian kita akses http://localhost:8000, sehingga tampilan awal yang kita lihat seharusnya seperti ini:

30412801-5aabcb8a-9944-11e7-92fd-1bf0e7a933ce Simple Route With Laravel

Jika tampilan saat kita mengakses http://localhost:8000 sudah seperti gambar di atas, berarti persiapan kita sudah selesai, dan saatnya ke tahap selanjutnya. berhasil tahap pertama! Next

Membuat Routing

Struktur File

Oke, untuk membuat routing di Laravel, pertama-tama kita buka dulu project test-routing di text editor masing-masing. Jika text editor sudah dibuka, kita akan melihat ke file dengan nama web.php. Secara defaultfile web.php ini terletak dengan struktur seperti ini:

test-routing
+-- app/
+-- bootstrap/
+-- config/
+-- database/
+-- public/
+-- resources/
+-- routes/
|   +-- api.php
|   +-- channels.php
|   +-- console.php
|   +-- web.php <-- file yang akan kita buka
+-- storage/
+-- tests/

Atau untuk lebih mudahnya kita juga bisa menggunakan fitur pencarian file yang sudah disediakan oleh text editor, biasanya sih Ctrl+p kemudian ketikkan routes/web.php.

Mengganti Routing

Jika kita sudah membuka web.php, maka di sana kita bisa melihat struktur seperti ini:

<?php

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

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

Coba kita perhatikan sejenak, di dalam file itu ada sesuatu seperti Route::get('/', function()) bukan? kalau ada sekarang kita coba ganti '/' yang ada di sana dengan '/hello', sehingga kita membuat sesuatu seperti ini:

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

Jika sudah diganti dan di-save. Sekarang kita kembali ke browser dan coba refresh halaman http://localhost:8000 tadi. Maka yang akan kita temui adalah error Sorry, the page you are looking for could not be found. seperti ini:

30414084-fe9c4498-994b-11e7-8a9d-18401be8b34d Simple Route With Laravel


Yang mana error di atas ini menunjukkan kalau tidak ada halaman yang bisa diakses dengan kata kunci /.

Oh iya, kalau kita mengakses URL tanpa kata kunci, seperti mengakses website.com atau  website2.com Maka kata kunci atau routing yang diakses secara default adalah /.

Oke, sekarang kita coba lagi, tapi halaman yang akan kita akses kali ini adalah http://localhost:8000/hello, dan tentu saja halaman yang akan muncul adalah ini:

30412801-5aabcb8a-9944-11e7-92fd-1bf0e7a933ce Simple Route With Laravel


Yap benar! Kita baru saja mengganti route atau kata kunci untuk mengakses suatu halaman, yang semula '/' atau http://localhost:8000 menjadi '/hello' atau http://localhost:8000/hello. Sangat mudah bukan?

Menambahkan Routing Baru

Oke selanjutnya, kita akan menambahkan routing baru, yang mana untuk melakukannya akan sangat mudah. Tapi sebelum itu kita harus kembali dulu ke web.php yang masih terbuka di text editor kita. Sekarang kita lihat bagian yang barusan kita ubah, yaitu bagian Route::get('/hello') tadi, selanjutnya sekarang kita coba tambahkan routing /hello di sana.

Tapi sebelum kita copy and paste, sebaiknya kita mulai dengan membuat pertanyaan seperti ini dulu.

Bagaimana bikinnya? Apa yang bakalan dimunculin? Ini maksudnya apa sih? Struktur kodenya harus sama persis kayak yang di atas?

Kalau sudah bertanya-tanya, sekarang saatnya kita membedah dulu sedikit bagaimana cara melakukannya.

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

Kalau kita lihat kode diatas, sebenarnya kita bisa mengartikannya dengan cara seperti ini:


_Routing dengan kata kunci /hello akan mengembalikan atau menampilkan tampilan atau view dengan nama welcome“.
atau
“Saat kita mengakses localhost:8000/hello, yang akan ditampilkan adalah tampilan atau view dengan nama welcome“._

Lalu? View dengan nama welcome itu maksudnya apa?
Nah, untuk view ini tentu akan kita bahas juga. Tapi sebelum itu, sekarang kita harus membuat routing /hello dengan arti yang kira-kira seperti ini:


“Saat kita mengakses localhost:8000/salam, yang akan ditampilkan adalah tulisan Hello World!“.

Oke, dari arti di atas maka kita bisa membuat Routing dengan struktur yang kira-kira akan berbentuk seperti ini:

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

Route::get('/salam', function () {
    echo "Hello World!";
});

Oke sekarang kita coba akses localhost:8000/salamuntuk memastikan Hello World! kita sudah ditampilkan atau belum, dan kalau sudah muncul berarti routing kita berjalan dengan baik. next!

Bagaimana? Cukup mudah bukan membuat routing /salam ini? Apalagi masih berbasis PHP, yang tentu saja kita masih bisa menggunakan syntax-syntax PHP seperti echo, print_r, var_dump untuk menampilkan sesuatu.

Membuat Dan Memunculkan View

Baiklah kita kembali ke arti route yang ini:

_“Saat kita mengakses localhost:8000/hello, yang akan ditampilkan adalah tampilan atau view dengan nama welcome“._

Lalu kita kembali ke pertanyaan ini:

Lalu? View dengan nama welcome itu maksudnya apa?

Dan sekarang mari kita bahas soal ini.

Sederhananya, yang dimaksud dengan view dengan nama welcome ini adalah sebuah file dengan nama welcome.blade.php, dan untuk lebih jelasnya kita buka dulu file welcome.blade.php ini.

Biasanya file ini terletak dengan struktur resources/views/welcome.blade.php atau untuk memudahkan kita juga bisa menggunakan fitur pencarian file yang sudah disediakan oleh text editor.

Oke, kalau file welcome.blade.php tadi sudah dibuka, di dalam file itu kita bisa lihat kalau struktur bahasanya kebanyakan menggunakan html, css, dan javascript sehingga di sini kita akan sangat dimudahkan untuk membuat tampilan suatu website, dan tentunya akan menggunakan 3 komponen tadi sebagai pondasi untuk pembuatannya.

Baiklah agar lebih mudah, bagaimana kalau kita langsung praktek dengan routing /salam tadi. Kita akan ubah arti route-nya menjadi seperti ini:

_“Saat kita mengakses localhost:8000/salam, yang akan ditampilkan adalah tampilan atau view dengan nama salam“._

Pertama-tama kita ubah dulu routing /salam yang ada di web.php hingga menjadi struktur seperti ini:

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

Setelah itu kita buat file baru dulu di directory resources/views dengan nama file-nya adalah salam.blade.php, kemudian di dalam file ini kita akan menampilkan tulisan Hello World! lagi, hanya saja kali ini kita akan menggunakan <h2> agar tulisan tadi terlihat lebih besar. Sehingga di dalam file salam.blade.php akan terlihat seperti ini.

<h2>Hello World!</h2>

Kemudian setelah kita save, kita kembali dulu ke browser, dan kita coba akses halaman http://localhost:8000/salam lagi.

30417769-082ae8fc-995b-11e7-9570-d146de658a6e Simple Route With Laravel

Setelah mengakses http://localhost:8000/salam dan yang muncul adalah tulisan yang sama tapi dengan ukuran yang berbeda, berarti view atau tampilan yang barusan kita buat tadi berjalan dengan lancar. next!

Cukup mudah bukan soal view ini? Apalagi kalau kita sudah terbiasa dengan 3 komponen tadi (html, css, javascript).

Penutup

Sampai sini sudah banyak yang kita bahas, mulai dari struktur file, mengganti routing, mengartikan routing, membuat routing, sampai menyambungkannya dengan view.

Baiklah, kira-kira seperti itu cara mudah untuk membuat route atau kata kunci di Laravel. Selamat bereksplorasi dengan kemudahan membuat route di Laravel dan sampai ketemu di artikel selanjutnya.

Leave a Reply :

* Your email address will not be published.