Skodev
Belajar coding dalam bahasa Indonesia
DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja
Skodev
Belajar coding dalam bahasa Indonesia
Semakin besar aplikasi kamu, kebutuhan di bagian frontendnya juga akan semakin meningkat. Tidak mudah untuk mengorganisir kodenya, apalagi banyak bagian kode yang akan dipakai berulang-ulang. Untuk memulainya kamu bisa belajar Vue.JS , framework ini menyebut dirinya “progressive framework” yang artinya kamu bisa mengimplementasikannya secara perlahan dan bertahap di website yang sudah jadi, tanpa perlu mengubah semuanya. Tentu saja kamu bisa memulai membuat aplikasi kamu berikutnya dengan Vue.JS sejak awal, membuatnya jadi lebih rapi. Meskipun masih terhitung baru, dengan dokumentasi yang jelas dan dukungan komunitas yang kuat, Vue.JS yang awalnya dimulai dari Evan You sendiri, sekarang sudah jauh berkembang. Kamu akan mengenal konsep two-way data binding, component dan masih banyak lagi nantinya. Ekosistem Vue.js juga tidak kalah menari, kamu sudah bisa membuat aplikasi SPA (Single Page Application) dengan data yang terorganisir melalui bantuan Vuex atau membuat SSR(server side render) dengan Nuxt.js
Berkenalan dengan vue js, melalui kelas-kelas ini kita akan melihat dasar vuejs, membuat contoh sederhana sampai membuat API dan menggunakan AJAX melalui bantuan vuejs resource
Daftar isi Belajar vuejs 101
Perkenalan kelas belajar vuejs, library javascript yang tidak kalah populer Link: Vue.JS
Mulai belajar Vue js dengan membuat instance Vue dan mendeklarasikan propery-propertynya
Mengenal konsep data binding, untuk menggabungkan property yang ada pada DOM agar mudah memanipulasinya secara langsung
Membuat satu propery selalu tergantung dengan property lainnya dengan computed properties dari vue
Mengenal apa itu directive pada vuejs dan juga melihat contoh penggunaan conditional directive pada template html
Mengenal apa itu loop/list directive pada vuejs dan juga melihat contoh penggunaan list directive pada vue js
Metode metode pada javascript bisa kita gunakan seperti biasa pada list directive vue js
Di vue.js 2 fungsi filter sudah berbeda dari video ini Cek filter di Vue v2 Belajar menggunakan filter pada vue js, baik pada single property atau property yang kita loop dengan orderBy atau filterBy
Belajar menggunakan methods pada vue js, dan juga menggabungkannya dengan event melalui v-on directive
Belajar lebih banyak tentang penggunaan v-on dan juga v-bind sebagai property pada vuejs
Membuat input dari user bersatu dengan konsep data-binding. Sehingga apapun yang dimasukkan oleh user, kita langsung bisa melihat hasilnya
Salah satu feature dari vue js yaitu component, membuat sistem template untuk bagian-bagian html yang ingin kita tampilkan berkali-kali
Salah satu feature dari vue js yaitu component bagian 2, membuat sistem template untuk bagian-bagian html yang ingin kita tampilkan berkali-kali
Masih tentang component, kali ini kita akan berkenalan dengan konsep dynamic component pada Vuejs, yang bisa kita manfaatkan sebagai sistem routing sederhana untuk membuat SPA (Single Page Application)
Melakukan transisi (transition) css dengan mudah melalui attribut di vuejs Daftar isi Komentar dan Vote Vuejs
Perkenalan kelas membuat komentar dan vote pada vuejs, untuk latihan setelah belajar dasar-dasar dari vuejs
Mulai membuat siste komentar dan vote pada vuejs. Kita akan menggunakan semua yang telah kita pelajari pada dasar-dasar vuejs disini
Menambahkan komentar baru beserta votenya pada sistem yang sudah ada dengan menggunakan v-model, v-on dan menggabungkannya dengan methods dari vue js Daftar isi Vue JS todolist dan API
Belajar bagaimana cara membuat todolist pada vuejs, dengan memanfaatkan apa saja yang sudah kita pelajar pada dasar vue js
Belajar menggunakan localstorage pada html dan javascript untuk menyimpan data sementara pada sisi browser untuk data todolist yang dibuat
Belajar membuat API sederhana dengan PHP, kita juga akan menggunakan vue js resource untuk melakukan AJAX ke API yang dibuat
Menyimpan data ke database dengan metode post yang sudah disediakan oleh vuejs resource
Merubah data yang sudah ada pada database dengan metode patch untuk mengubah status dari todolist yang sudah dibuat
Melihat kesalahan yang kita lakukan di video sebelumnya kenapa fungsi post tidak bekerja pada versi 0.9 dari vuejs Daftar isi Membuat sistem tag dengan Vuejs
Intro untuk kelas membuat sistem tag dengan vue js, dengan ini kita bisa membuat sistem tag yang bisa diimplementasikan seperti pada forum, blog, dan lain-lain
Mulai dengan membuat html dan css sebagai kerangka aplikasi yang dibuat. Selain itu kita belajar memecahkan tugas besar menjadi tugas-tugas kecil yang bisa dikerjakan satu per satu dalam bahasa manusia
Ketika user mulai mengetik sesuatu pada input, kita akan memunculkan daftar tag yang tersedia, dan akan disembunyikan ketika tidak ada input
Memilih tag mana yang akan digunakan dengan menggunakan event keyboard pada saat panah ke bawah ditekan
Memilih tag mana yang akan digunakan dengan menggunakan event keyboard pada saat panah ke atas ditekan
karena tidak perlu menampilkan semuanya sekaligus, maka kita akan memunculkan daftar tag berdasarkan apa yang user ketik pada input
Memilih salah satu tag dengan event keyboard enter, jadi selain sudah bisa terhighlight dengan tanda panah, kita juga sudah bisa memilih tagnya
Bagaimana jika user ingin menghapus tag yang sudah terpilih, kita mulai dengan menggunakan event keyboard backspace ataupun delete untuk menghapus entri terakhir
Bagaimana jika user ingin menghapus tag yang sudah terpilih sebelumnya namun bukan entri terakhir, kita lihat cara menghapus berdasarkan yang diklik
selain memilih dengan tanda panah keyboard, kita juga harus bisa memilih berdasarkan mouse, tergantung apa yang dihighlight dan apa yang diklik
Jika satu tag sudah dipilih sebelumnya, maka tidak perlu lagi ditampilkan pada entri berikutnya, dengan ini kita mencegah ada tag yang sama pada satu entri Daftar isi Membuat single page app dengan vuex
Kita mulai dengan install vue cli dan juga vuex. Kita juga akan melihat struktur folder yang direkomendasikan untuk aplikasi yang menggunakan vuex
Kenalan dengan state dan juga getter sebagai tempat awal mengambil data pada aplikasi vuex
membuat component yang akan dipakai di beberapa tempat pada aplikasi member menggunakan vuex
Mengenal dan melihat perbedaan antara action dan mutation pada vuex yang bertanggung jawab untuk melakukan manipulasi pada data awal. Kita juga akan membuat singleview pada aplikasi member ini.
Bagaimana cara mengedit component secara langsung melalui aplikasi vuex yang kita buat?
Menambah member atau data baru, kita akan mempertajam bagaimana alur pada vuex, ketika kita ingin memanipulasi data yang ada pada state melalui action dan mutation
Menghapus member atau data, kita akan mempertajam lagi bagaimana alur pada vuex, ketika kita ingin memanipulasi data yang ada pada state melalui action dan mutation
Bikin aplikasi member yang dibuat dengan vuex ini jadi jauh lebih cantik dengan CSS tentunya
Ada hal yang bisa kita tambahkan untuk memaksimalkan user experience alias cara user berinteraksi dengan aplikasi ini Daftar isi NuxtJS membuat aplikasi vuejs universal
Kenalan dengan NuxtJS dan cara menginstall nuxtjs, membuat vuejs universal untuk aplikasi kita berikutnya
Kita intip dulu bagaimana halaman dasar dari NuxtJS, dimana starting pointnya, apa aja default yang tersedia buat kita
Cara load custom css dan framework css dari luar di aplikasi nuxtjs
Bagaimana cara menginstall plugin di nuxtjs. Kita akan melihat contohnya dengan menggunakan axios di nuxtjs
Cara menampilkan data yang kita terima dari axios dengan v-for pada halaman vue js file
Memindahkan data yang awalnya di vue file jadi store (Vuex store) pada nuxt.js untuk mengatur state datanya
Cara membuat component di nuxtjs, sama seperti membuat component pada vue
Navigasi menu yang muncul pada semua halaman di vue nuxt.js
Mengoper Property di component vuejs agar dinamis dan membuat transisi pada halaman lebih cantik di nuxtjs
Bagaimana dengan membuat halaman dinamis pada nuxt.js seperti berdasarkan id user atau slug pada nama blog misalnya
Salah satu masalah yang sebelumnya kita temukan pada Vue js adalaha SEO, atau bagaimana nanti dia di search engine, seperti title atau meta data linenya agar menjadi dinamis sesuai halamannya Daftar isi CRUD API di Nuxtjs
Trailer menggunakan nuxt js untuk mengakses API dengan axios
Kita akan membuat API local menggunakan json-server, kamu bisa melihatnya disini Link: Jsonplaceholder
Bagaimana menginstall plugin seperti axios atau css framework dan menggunakannya di proyek nuxt.js
Memindahkan data dari .vue file ke vuex store
Bagaimana cara menambahkan data ke API menggunakan nuxtjs
Selain menggunakan mapaction dan spread syntax, ada penulisan lain untuk mengakses action dan state di vuex store kita dari .vue file
Kita rapikan dulu tampilan dari proyek ini!
Menghapus dari dengan API di nuxt.js
Mengupdate data dari API di nuxt.js
Membuat sistem search dengan computed property di vuejs
Belajar Vue js 3 mulai dari dasar. Kita akan melihat salah satu framework javascript yang sangat populer dan berhasil bersaing dengan framework raksasa seperti Angular dan React.
Intro belajar vuejs, apa alasan kenapa harus belajar vue js 3
bagaimana cara install dan contoh membuat website dasar yang menggunakan vuejs
Kita bisa membuat fungsi atau metode biasa di javascript dengan event di vueJS
Menggabungkan input dan langsung membaca nilainya bisa dengan two way data binding vuejs
Bagaimana cara melakukan loops atau perulangan data di vuejs
Bagaimana cara melakukan conditional rendering vuejs atau menggunakan if else
Bagaimana cara menghias vuejs dengan css menggunakan metode class dan style vuejs
Apa itu computed properties di vue js 3? Ia akan menjadi fungsi yang dinamis untuk bereaksi ketika ada nilai yang berubah
Mengintip dasar apa itu komponen di vuejs, dengan komponen kita bisa membuat sesuatu satu kali dan menggunakannya berkali kali
Bagaimana cara mengoper nilai dari komponen bawah ke komponen atas atau parent menggunakan emit event di vuejs 3
latihan membuat mini aplikasi degan vuejs 3