Tutorial Authentication Dengan Laravel, Inertia.js dan React.js #1 : Installasi dan Persiapan Laravel


Tutorial Authentication Dengan Laravel, Inertia.js dan React.js #1 : Installasi dan Persiapan Laravel

Halo teman-teman semuanya, pada kesempatan kali ini kita semua akan belajar bagaimana cara membuat authentication di dalam Laravel, Inertia.js dan React.js.

Sebelumnya saya juga pernah membahas materi pembuatan aplikasi sederhana atau CRUD menggunakan Laravel, Inertia.js dan React.js. Teman-teman bisa cek pada link berikut ini :

https://santrikoding.com/tutorial-set/tutorial-laravel-inertiajs-reactjs.

Laravel merupakan web framework yang dikembangkan menggunakan bahasa pemrogramman PHP dan menggunakan arsitektur MVC atau biasa disebut Model, View dan Controller. Laravel bersifat open source, sehingga teman-teman bisa menggunakannya secara gratis.

Laravel di Indonesia sangat populer, karena komunitasnya sangat besar dan ekosistem pendukungnya sangat melimpah. Di dalam Laravel juga banyak fitur-fitur magic yang akan mempermudah teman-teman dalam mengembangkan sebuah aplikasi maupun website.

Inertia.js merupakan sebuah adapter yang bertugas menggantikan peran Rest API dalam menghubungkan antara backend dan frontend dengan lebih mudah dan cepat. Tidak hanya itu, Inertia.js juga mampu membuat aplikasi atau website yang kita kembangkan berjalan secara SPA atau biasa disebut dengan Single Page Application.

Untuk mengetahui lebih jauh tentang Inertia.js, teman-teman bisa baca artikel di link berikut ini :

https://santrikoding.com/apa-itu-inertia-js

React.js merupakan library JavaScript yang digunakan untuk mengembangkan user interface aplikasi / website menjadi interaktif dan cepat. React.js pertama kali dikembangkan oleh Facebook dan sekarang sudah banyak kontributor diseluruh dunia yang ikut mengembangkan library tersebut.

Pada kesempatan kali ini, kita semua akan belajar melakukan installasi dan persiapan di dalam project Laravel.

Langkah 1 - Installasi Composer

Composer merupakan dependency manager dari bahasa pemrogramman PHP yang digunakan untuk mempermudah dalam melakukan installasi library.

Untuk installasi Composer bisa ikuti langkah-langkahnya sesuai dengan sistem operasi yang digunakan :

Untuk mengetahui apakah Composer berhasil terinstall, kita bisa menjalankan perintah berikut ini di dalam terminal/CMD :

composer

Langkah 2 - Membuat Project Laravel

Karena sudah berhasil melakukan installasi Composer, maka sekarang kita bisa lanjutkan membuat project Laravel menggunakan Composer.

Sekarang silahkan masuk ke dalam folder dimana teman-teman akan menyimpan project-nya, kemudian jalankan perintah berikut ini di dalam terminal/CMD :

composer create-project --prefer-dist laravel/laravel:9.3.0 inertia-react-auth

INFORMASI : minimal menggunakan PHP versi 8.1.x

Jika perintah di atas berhasil dijalankan, maka kita akan dibuatkan project Laravel baru dengan nama inertia-react-auth dan silahkan teman-teman tunggu sampai proses installasinya selesai.

Langkah 3 - Menjalankan Project Laravel

Setelah proses installasi project-nya selesai, maka kita akan belajar baagaimana cara menjalankan project tersebut agar bisa diakses melalui browser.

Silahkan teman-teman jalankan perintah berikut ini di dalam terminal/CMD :

cd inertia-react-auth

Perintah cd di atas digunakan untuk melakukan navigasi atau masuk ke dalam folder project, yaitu inertia-react-auth.

Jika sudah berada di dalam project-nya, silahkan teman-teman jalankan perintah berikut ini di dalam terminal/CMD :

php artisan serve

Jika perintah di atas berhasil dijalankan, maka project akan dijalankan di dalam localhost menggunakan port 8000.

Kita bisa membukanya di dalam localhost dengan http://localhost:8000. Jika berhasil, maka kurang lebih seperti berikut ini :

Langkah 4 - Konfigurasi Koneksi Database

Karena akan berhubungan dengan proses register dan login, maka kita akan membutuhkan sebuah database. Untuk itu, kita akan melakukan konfigurasi koneksi database terlebih dahulu.

Silahkan teman-teman buka file .env, kemudian cari kode berikut ini.

DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=

Dan ubahlah menjadi seperti berikut ini.

DB_DATABASE=db_inertia_react_auth
DB_USERNAME=root
DB_PASSWORD=

Di atas, untuk DB_DATABASE merupakan nama database yang akan kita gunakan nanti, dan di atas kita atur dengan nama db_inertia_react_auth.

Kemudian untuk DB_USERNAME silahkan disesuaikan dengan konfigurasi dari MySQL masing-masing, jika menggunakan XAMPP, maka secara default adalah root.

Dan untuk DB_PASSWORD silahkan disesuaikan juga dengan konfigurasi dari MySQL dan jika menggunakan XAMPP, maka defaultnya adalah kosong atau tidak perlu diisi.

Langkah 5 - Membuat Database

Kita lanjutkan membuat database di dalam MySQL. Silahkan teman-teman buka link berikut ini http://localhost/phpmyadmin dan buat database baru dengan nama db_inertia_react_auth.

Langkah 6 - Menjalankan Migration

Secara default, Laravel memberikan kita migration user, dimana nantinya akan digenerate menjadi table users. Disini sangat menguntungkan para developer, karena sudah tidak perlu membuatnya lagi secara manual.

Karena sudah dibuatkan, maka kita perlu menjalankan proses migrate, agar table users digenerate ke dalam database. Silahkan jalankan perintah berikut ini di dalam terminal/CMD dan pastikan berada di dalam projectnya.

php artisan migrate

Jika muncul proses seperti berikut ini, maka proses migrasi berhasil dilakukan.

Jika kita cek pada database, maka kita akan berhasil mendapatkan table users yang nanti digunakan untuk proses register dan login di dalam website.

Sampai disini pembahasan kita tentang bagaimana cara melakukan installasi project Laravel dan menjalankan project tersebut serta melakukan konfigurasi database.

Terima Kasih



Fika Ridaul Maulayya
Full-Stack Developer, Content Creator and CO-Founder SantriKoding.com

Suka dengan tulisan di SantriKoding? Kamu bisa memberikan dukungan dengan berdonasi atau bagikan konten ini di sosial media. Terima kasih atas dukungan Anda!

KEBIJAKAN KOMENTAR

Saat memberikan komenatar silahkan memberikan informasi lengkap tentang error, seperti: screenshot, link kode, dll. Baca aturan komentar kami