Cara Membuat Aplikasi TodoList Vue JS Part 7

Pada bagian sebelumnya kita sudah membuat todos dengan sistem LocalStorage  yang mana kita simpan datanya didalam LocalStorage browsernya kali ini kita akan bermain dengan database artinya kita akan menyimpan datanya didalam database. Jadi ada beberapa tahap yang pertama kita akan membuat database. Nama databasenya adalah e-todo sebagai berikut

Cara-Membuat-Aplikasi TodoList-Vue-JS-Part7-1

lalu didalamnya akan ada 3 kolom untuk satu table nama tablenya adalah todos. Kolomnya terdiri dari id PRIMARY KEY AUTO INCREMENT lalu akan ada kolom name dalam bentuk VARCHAR 30 lalu yang terakhir adalah kolom is_completed yang tipe datanya BOOLEAN nanti dia akan mengubah ke tipe data menjadi TINYINT sepert ini

Cara-Membuat-Aplikasi TodoList-Vue-JS-Part7-2

Karena pada database dia akan menyimpan antara nilai 1 atau 0. Angka 1 nilainya TRUE sedangkan Angka 0 nilainya FALSE. Langkah pertama dalam membuat database sudah berhasil. Kemudian langkah kedua kita akan siapkan library dari VUE JS. Nama package atau nama librarynya adalah Vue Resource.

Cara-Membuat-Aplikasi TodoList-Vue-JS-Part7-3

Bila teman teman mau install dari npm juga boleh atau teman teman bisa langsung ambil filenya dari CDN lalu copy link CDN vue resource yang minifynya sebagai berikut

Cara-Membuat-Aplikasi TodoList-Vue-JS-Part7-4

dan tentu pada akhirnya kita akan pasang ke dalam struktur HTMLnya dalam tag <script> setelah meload file dari VUE JS -nya. Pastikan bila kita reload halamannya tidak akan ada error. Jadi silahkan teman teman baca documentasinya ada banyak sekali yang bisa kita lakukan didalam library Vue Resource. Dari yang pertama kita bisa menggunakan request POST, GET, PUT/PATCH atau DELETE lalu ada optionsnya juga yang bisa kita manfaatin dari Vue Resource tersebut. Jadi pada bagian selanjutnya kita akan lihat cara penggunaanya dalam melakukan request-request kedatabase. Terima Kasih.

28 Agustus 2017

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Mini Bootcamp Backend Laravel 11 Bulan Mei 2024 di DUMET School
Webinar Selanjutnya Mei 2024

Minggu, 26 Mei 2024, 09.00-13.00 WIB

(4 Jam Membuat Backend di Laravel 11)

chat