Jika Anda seorang web developer, tentunya anda mengetahui atau pernah menggunakan code editor yang paling terkenal yaitu Visual Studio Code atau yang sering dikenal dengan VS Code.
VS Code adalah source-code editor yang dikembangkan oleh Microsoft untuk platform Windows, Linux, dan macOS. VS Code memiliki fitur yang lengkap, diantaranya debugging, snippets, code refactoring, code completion, dan masih banyak lagi.
Namun, fitur yang sangat disegani dari VS Code ini adalah banyaknya extension yang dibuat oleh komunitas maupun perusahaan untuk menambah efisiensi pengguna dalam coding.
Kali ini kita akan membahas rekomendasi extension VS Code untuk framework front-end Vue.js.
Vue.js adalah sebuah framework front-end gratis dan open source berbasis bahasa pemrograman JavaScript yang digunakan untuk membuat user interface dan single page application. Vue.js merupakan salah satu framework front-end yang paling terkenal di kalangan web developer, bersama dengan React dan Angular.
Berikut adalah rekomendasi extension untuk framework Vue.js.
1. Vue Language Features (Volar)
Vue Language Features atau Volar adalah extension official untuk framework Vue.js. Volar menawarkan full language support untuk Vue 3, versi Vue.js yang terbaru, termasuk sintax Single File Component (SFC) standar.
Berikut beberapa fitur yang Volar sediakan:
- Highlight sintax Single File Component Vue 3.
- Highlight sintax CSS, LESS, dan SCSS.
- Auto rename tag.
- Auto close tag.
- Typescript support.
2. Vue VSCode Snippets
Extension ini menyediakan snippet atau template kode Vue.js yang dapat menambah efisien pengguna dalam melakukan setup kode Vue.js.
Berikut beberapa snippet yang tersedia:
- vbase => Template kode SFC
- vbase-3 => Template kode SFC Composition API
- vbase-3-setup => Template kode SFC Composition API dengan format setup
- vbase-css => Template kode SFC menggunakan styling CSS
- vbase-pcss => Template kode SFC menggunakan styling PostCSS
- vbase-ts => Template kode SFC bahasa Typescript
- vbase-ts-setup => Template kode SFC bahasa Typescript berformat setup
Dan masih banyak lagi.
3. Tailwind CSS IntelliSense
Jika Anda seorang front-end developer, tentunya sudah tidak asing dengan framework CSS yang satu ini, yaitu Tailwind CSS. Tailwind CSS menyediakan extension official untuk VS Code yang dapat menambah efisien coding front-end. Extension ini menyediakan fitur canggih diantaranya autocomplete, highlight sintax, dan hover preview untuk framework Tailwind CSS.
