Tutorial CRUD Laravel dan Nuxt Js #1 : Installasi dan Persiapan Laravel


Fika Ridaul Maulayya
Full-Stack Web Developer, Content Creator and CO-Founder Santri Koding. I share everything i know with Articles, Screencasts and E-Books at SantriKoding.com

Halo teman-teman semuanya, pada kesempatan kali ini kita semua akan belajar bagaimana cara membuat sebuah operasi CRUD menggunakan Laravel dan Nuxt Js. Konsepnya adalah kita akan menggunakan Laravel untuk membuat RESTful API dan Nuxt Js untuk mengkonsumsi atau menggunakan API yang telah dibuat di Laravel. Seperti menampilkan data, input data, edit dan update dan yang terakhir adalah delete data.

Pertama, kita semua akan belajar bagaimana cara melakuakn installasi dan konfigurasi membuat project baru di Laravel. Dan syarat pertama yang harus kita miliki adalah Composer, karena kita akan membuat project Laravel menggunakan Composer tersebut.

Untuk installasi Composer, silahkan 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

Jika berhasil, maka akan mendapatkan output kurang lebih seperti berikut ini :

Langkah 1 - Install Laravel Dengan Composer

Setelah berhasil menginstall Composer di dalam komputer, maka kita sekarang sudah bisa melakukan installasi atau membuat project baru dengan Laravel. Pertama, silahkan masuk ke dalam folder dimana kita akan menyimpan project tersebut dan jalankan perintah berikut ini di dalam terminal/CMD :

composer create-project laravel/laravel:^8.0 laravel-api

Perintah di atas kita gunakan untuk menginstall project Laravel baru dengan versi 8.x dan kita berikan nama project tersebut dengan laravel-api.

CATATAN: minimal versi PHP yang digunakan adalah 7.3

Langkah 2 - Menjalankan Project Laravel

Setelah berhasil terinstall, sekarang kita akan mencoba menjalankan project tersebut, silahkan jalankan perintah berikut ini di dalam terminal/CMD :

cd laravel-api

Perintah cd di atas digunakan untuk masuk ke dalam sebuah folder dan folder yang akan dituju adalah laravel-api.

Kemudian, untuk memastikan kita sudah berada di dalam folder project, kita bisa jalankan perintah berikut ini di dalam terminal/CMD :

ls

Jika berhasil, maka kurang lebih seperti berikut ini :

Kemudian, untuk menjalankan project Laravel, silahkan jalankan perintah berikut ini di dalam terminal/CMD :

php artisan serve

Jika berhasil, maka project Laravel akan di jalankan di dalam localhost dengan port 8000, kita bisa membukanya di browser dengan mengetikkan http://localhost:8000 dan kurang lebih seperti ini hasilnya :

Langkah 3 - Konfigurasi Database

Sekarang kita lanjutkan untuk melakukan konfigurasi database, pertama kita akan atur terlebih dahulu untuk koneksi database-nya di dalam project Laravel dan selanjutnya kita akan membuat database tersebut di dalam PhpMyAdmin.

Silahkan buka project Laravel dengan text editor, seperti vscode, sublime text dan lain-lain. Dan buka file yang bernama .env dan cari kode berikut ini :

DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=

Kemudian, ubahlah menjadi seperti berikut ini :

DB_DATABASE=db_laravel_api
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_laravel_api.

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.

Setelah konfigurasi untuk koneksi database selesai dibuat, sekarang kita lanjutkan untuk membuat database baru melalui PhpMyAdmin. Silahkan buka melalui http://localhost/phpmyadmin dan buat database baru dengan nama db_laravel_api, kurang lebih seperti berikut ini :

Langkah 4 - Membuat Model dan Migration

Setelah berhasil melakukan konfigurasi database, selanjutnya kita akan belajar bagaimana cara membuat model dan juga migration. Silahkan jalankan perintah berikut ini di dalam terminal/CMD dan pastikan menjalankannya di dalam project Laravel :

php artisan make:model Post -m

Perintah di atas digunakan untuk membuat model baru dengan nama Post dan diikuti dengan flag -m yang artinya akan dibuatkan sebuah migration untuk model tersebut.

Dan jika perintah di atas berhasil, maka kita akan mendapatkan 2 file baru, yaitu :

  • app/Models/Post.php
  • database/migrations/2021_04_03_003257_create_posts_table.php

Untuk nama file migration akan random sesuai dengan tanggal pembuatannya.

Kita lanjutkan, pertama kita akan lakukan konfigurasi untuk model Post terlebih dahulu. SIlahkan buka file app/Models/Post.php kemudian ubah kode-nya menjadi seperti berikut ini :

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Post extends Model
{
    use HasFactory;
    
    /**
     * fillable
     *
     * @var array
     */
    protected $fillable = [
        'title', 'content'
    ];

}

Dari perubahan kode di atas, kita tambahkan sebuah properti baru dengan nama $fillable, properti tersebut digunakan untuk mengizinkan sebuah attribute agar dapat menyimpan data ke dalam database. Dan di dalam properti tersebut kita berikan dua value, yaitu title dan juga content.

Properti $fillable ini dinamakan dengan Mass Assigment di dalam Laravel.

Selanjutnya, kita akan menambahkan attribute baru di dalam file migration. SIlahkan buka file database/migrations/2021_04_03_003257_create_posts_table.php dan pada function up silahkan ubah menjadi seperti berikut ini :

public function up()
{
  Schema::create('posts', function (Blueprint $table) {
     $table->id();
     $table->string('title');
     $table->text('content');
     $table->timestamps();
  });
}

Di atas, kita menambahkan 2 attribute baru yaitu title dan content.

Setelah itu, kita akan menjalankan proses migrasi agar kita mendapatkan table-table baru di dalam database, table-table ini akan digenerate dari file migration yang sudah kita buat di atas.

Silahkan jalankan perintah berikut ini di dalam terminal/CMD dan di dalm project Laravel tentunya :

php artisan migrate

Jika perintah di atas berhasil, maka kita akan mendapatkan table-table baru di dalam database, kurang lebih seperti berikut ini :

Sampai disini pembahasan tentang installasi dan persiapan Laravel, dimana di atas kita sudah belajar banyak hal seperti installasi Composer, membuat project Laravel baru, menjalankannya dan sampai membuat migrasi database.

Di artikel selanjutnya kita bersama-sama akan belajar bagaimana cara membuat RESTful API menggunakan Laravel. Terima Kasih



Fika Ridaul Maulayya
Full-Stack Web Developer, Content Creator and CO-Founder Santri Koding. I share everything i know with Articles, Screencasts and E-Books at SantriKoding.com
KEBIJAKAN KOMENTAR

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

KOMENTAR