VueJS adalah salah satu framework JavaScript yang paling popular saat ini disamping ReactJS dan AngularJS, dan sepertinya akan tetap menjadi pilihan para Frontend Developer ditahun mendatang yaitu tahun 2020. Dalam melakukan pengembangan website atau aplikasi, para Frontend Developer pastinya membutuhkan tools-tools yang dapat membantu atau mempercepat mereka dalam melakukan pengerjaannya. Berikut ini 11 tools yang dapat digunakan untuk membantu pekerjaan mereka:

1. Vue CLI

Seperti framework JavaScript kebanyakan, tidak banyak yang dapat kamu lakukan tanpa Vue CLI. Vue CLI memungkinkan kamu untuk membuat struktur proyek dengan cepat dan deploy boilerplates serta memungkinkan kamu membuat prototype dengan mudah untuk menunjukan fitur terbaru.

Sebagai tambahan, Vue CLI menawarkan banyak support untuk tools development seperti TypeScript, Babel, PostCSS, ESLint, Unit Testing, PWA dan End-to-End Testing. Vue CLI juga bisa dipasangkan dengan third-party yang dibuat oleh komunitas.

https://cli.vuejs.org/

2. Nuxt JS

NuxtJS adalah sebuah framework untuk VueJS. Sama seperti framework pada umumnya, dengan NuxtJS kamu tidak perlu membuat sebuah boilerplate dari awal. NuxtJS memberikan beberapa pilihan aplikasi yang akan dibuat seperti Server Side Rendering (SSR), Progressive Web Applications (PWA), Single Page Applications (SPA) dan web statis.

NuxtJS memiliki sistem modular dan mempunyai lebih dari 50 modul yang dapat kamu gunakan untuk mempercepat proses development.

https://nuxtjs.org/

3. Bit for Vue

Bit adalah cara yang bagus untuk membangun library komponen Vue di tim kamu. Bit memecahkan masalah sharing dan kolaborasi komponen UI yang berada di folder yang berbeda. Dan juga sangat powerful untuk menyusun UI dengan komponen yang dikembangkan bersama, dikembangkan secara independen, memiliki versi dan terupdate.

Pada Bit, kamu dapat mengorganisasikan komponen kamu sendiri. Jika komponen diibaratkan dengan album CD, maka Bit bisa disebut seperti iTunes.

https://bit.dev/frontend-teams

4. Vue-router

Jika kamu familiar dengan framework JavaScript selain VueJS, konsep routing seharusnya bukan hal baru untuk kamu. Router digunakan untuk membuat peta URL aplikasi ke dalam komponen. Vue router melakukan hal ini dengan baik dan support konfigurasi router berbasis komponen.

Sebagai tambahan, Vue router juga support router dengan parameter, query dan wildcards untuk memungkinkan membuat routing yang kompleks. Vue router mempunyai fitur transisi antar halamannya sehingga lebih attractive di mata user. Vue router juga memberikan pilihan routing menggunakan HTML5 history atau hash mode.

https://router.vuejs.org/

5. Vuex

Vuex adalah state management sebagaimana Redux pada ReactJS. Vuex digunakan untuk membuat state terpusat sehingga state dapat dimutasi dengan cara yang dapat diprediksi. Menggunakan Vuex akan sangat berasa jika kamu mengembangkan aplikasi yang cukup besar.

https://vuex.vuejs.org/

6. Axios

Axios adalah library yang digunakan untuk membuat dan mengelola Ajax Request. Axios bersifat universal, support pembatalan dan menggunakan definisi TypeScript.

https://github.com/axios/axios

7. Vuetify

Vuetify adalah kombinasi dari kata “Vue” dan “Beautify” dan hal itu akan terjadi di aplikasi kamu jika kamu menggunakannya. Vuetify adalah library yang memungkinkan kamu membuat aplikasi dengan tampilan yang indah walaupun kamu bukanlah seorang desainer. Vuetify memiliki lebih dari 80 komponen berbasis Material Design yang mana komponen tersebut dapat membantu kamu lebih cepat dalam mendesain aplikasi.

https://vuetifyjs.com/en/

8. Vue Apollo

GraphQL adalah tools yang sangat powerfull dalam memanfaatkan APIs. GraphQL memungkinkan kamu untuk menentukan data apa saja yang dibutuhkan oleh aplikasi yang sedang kamu kembangkan, sehingga data yang ditampilkan oleh API benar-benar data yang dibutuhkan saja. Vue Apollo adalah salah satu cara termudah menggunakan GraphQL untuk Vue.

https://vue-apollo.netlify.com/

9. Mocha

Testing adalah salah satu aspek penting dalam pembuatan aplikasi. Dengan melakukan testing, kamu dapat memastikan bahwa harapan klien terpenuhi dan pengembangan telah dilakukan dengan cara yang tepat. Kami memilih Mocha dibanding Unit Testing lainnya karena Mocha dapat berjalan baik di Back-end mau pun Front-end.

https://mochajs.org/

10. Vue.js DevTools for browsers

Debugging sangat penting agar development lebih efisien. Hampir mustahil untuk mengetahui apa yang terjadi saat development tanpa alat debugging yang baik. Dan ini adalah alat debugging yang direkomendasikan oleh tim VueJS dan tersedia baik di Chrome atau Firefox dan tentunya user-friendly.

https://github.com/vuejs/vue-devtools

11. Official Vue.js Guide

Yang terakhir dan tidak kalah pentingnya adalah panduan resmi belajar VueJS. Itu adalah tempat terbaik untuk belajar VueJS. Panduan tersedia untuk semua versi Vue sehingga kamu dapat dengan mudah memulai membuat aplikasi dengan VueJS dan juga dapat membandingkan perubahan yang terjadi pada setiap versi terbarunya.

Sebagai tambahan, pada panduan juga tersedia Video, segmen kode dan aplikasi yang interaktif sehingga pembelajaran lebih interaktif dan mudah dipahami.

https://vuejs.org/v2/guide/

Referensi:
https://blog.bitsrc.io/top-10-vuejs-developer-tools-becd61375447