Tutorial Membuat CRUD di Adonis JS #1 : Installasi & Persiapan - Halo teman-teman semuanya, pada kesempatan kali ini kita semua akan belajar bagaimana cara membuat sebuah CRUD di Adonis JS.
Apa itu Adonis JS ? Adonis JS merupakan salah satu Web Framework dari Node JS, Adonis JS sendiri menggunakan konsep / pola MVC yaitu memisahkan beberapa kode berdasarkan fungsinya masing-masing.
Adonis JS meruapkan Web Framework yang dikembangkan dengan bahasa pemrogramman JavaScript dan memiliki struktur, gaya dan juga bahasa yang mirip dengan Framework Laravel.
Cara Install Adonis JS
Sebelum menginstall atau memulai project dengan Adonis JS, kita diharuskan sudah menginstall Node JS di laptop atau komputer.
Untuk teman-teman yang belum menginstall Node JS bisa menginstallnya. Silahkan bisa melalui https://nodejs.org/en/ dan sesuaikan dengan operating system komputer teman-teman.
Untuk mengetahui apakah Node JS sudah terinstall dikomputer kita, kita bisa jalankan perintah dibawah ini di terminal atai CMD.
node -v
Dan jika kita lihat dari situs resmi Adonis JS, ada beberapa persyaratn yang harus kita penuhi sebelum membuat project baru, diantaranya :
- Node.js >= 8.0.0
- npm >= 3.0.0
- git
Setelah semua persyaratan terpenuhi, sekarang kita akan menginstall yang namanya Adonis CLI.
Install Adonis CLI
Apa itu Adonis JS CLI ? Adonis JS CLI merupakan command line tools yang akan membantu kita dalam pengembangan aplikasi dengan Adonis JS. Seperti halnya membuat project baru, membuat migrasi, controllers, models, views dan yang lainnya.
Silahkan jalankan perintah dibawah ini untuk menginstall Adonis JS CLI secara global di komputer kita :
npm i -g @adonisjs/cli
Setelah installasi berhasil dan selesai, sekarang kita sudah bisa membuat project baru dengan menggunakan bantuan Adonis JS CLI. Silahkan jalankan perintah dibawah ini untuk membuat project baru
adonis new MyApp
MyApp adalah nama project yang akan kita gunakan
Silahkan tunggu proses installasi sampai selesai. Sekarang kita menjalankan aplikasi kita dengan cara menjalankan perintah dibawah ini :
adonis serve --dev
Secara otomatis, Adonis JS akan menjalankan project menggunakan Port 3333, teman-teman bisa membukanya melalui web browser dengan mengetikkan :
http://localhost:3333
Jika berhasil, kurang lebih tampilannya seperti berikut ini :
Membuat Database
Setelah kita berhasil menginstall Adonis JS dan menjalankannya, sekarang saatnya kita membuat sebuah database baru, yang mana database ini akan kita gunakan untuk menyiimpan data nanti.
Silahkan buka http://loclahost/phpmyadmin dan silahkan buat database baru dengan nama "db_adonis_crud".
Setelah berhasil membuat database baru, sekarang kita atur koneksi database yang ada di Adonis JS. silahkan teman-teman buka file .env dan cari kode dibawah ini :
DB_CONNECTION=sqlite
DB_HOST=127.0.0.1
DB_PORT=3306
DB_USER=root
DB_PASSWORD=
DB_DATABASE=adonis
Sekarang kita ubah kode diatas, menjadi kurang lebih seperti berikut ini :
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_USER=root
DB_PASSWORD=
DB_DATABASE=db_adonis_crud
Silahkan teman-teman sesuaikan dengan koneksi databasenya. Dan perlu temaan-teman perhatikan, secara default Adonis JS menggunakan driver database SQLITE dan kita akan merubahnya menggunakan MYSQL.
Jika kita jalankan aplikasi kita tentu saja nanti kita akan mendapatkan sebuah error, karena MySQL belum terinstall di project Adonis JS kita.
Untuk menginstall MySQL di project Adonis JS kita, silahkan jalankan perintah dibawah ini :
npm install mysql --save
Setelah proses installasi MySQL selesai, kita akan lanjutkaan dengan membuat sebuaah Models dan Migration baru. Silahkan jalankaan perintah dibawah ini :
adonis make:model Post --migration
Maka dari perintah di atas, kita akan dibuatkan 2 file baru yaitu
- app/Models/Post.js
- database/migrations/1580816802795_post_schema.js
✔ create app/Models/Post.js
✔ create database/migrations/1580816802795_post_schema.js
Sekarang silahkan buka file migration kita database/migrations/1580816802795_post_schema.js dan silahkan cari kode dibawah ini :
up () {
this.create('posts', (table) => {
table.increments()
table.timestamps()
})
}
Dan kita ubah menjadi seperti berikut ini :
up () {
this.create('posts', (table) => {
table.increments()
table.string('title')
table.text('content')
table.timestamps()
})
}
Bisa teman-teman perhatikan, kita akan menambahkan 2 kolom baru di dalam tabel posts, yaitu title dan content.
Setelah itu silahkan teman-teman jalankan perintah dibawah ini untuk melakukan migration ke database :
adonis migration:run
Jika berhasil, teman-teman akan melihat output kurng lebih seperti berikut ini :
migrate: 1503248427885_user.js
migrate: 1503248427886_token.js
migrate: 1580816802795_post_schema.js
Database migrated successfully in 275 ms
Dan teman-teman juga bisa melihatnya melalui http://localhost/phpmyadmin pada database "db_adonis_crud", maka kurang lebih akan seperti berikut ini :
Sampai disini pembahasan tutorial tentang membuat CRUD di Adonis JS pertama, yaitu installasi dan persiapan.
Di artikel selanjutnya kita akan belajar menampilkan data dari database dengan Adonis JS. Terima Kasih