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

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

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.

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

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.