[Wajib] 11 Extension Vscode untuk Web Developer Pemula

10 Extension wajib di install di vscode - hallo teman-teman, pada kesemapatan ini saya akan memabagikan informasi manfaat bagi anda seorang perogrammer website. artikel ini saya bikin agar anda bagi pemula tau Extension yang bisa membantu pembuatan program website anda sendiri.

Saya mendapatkan ide artikel ini di Web Programming Unpas. Channel tersebut adalah tempat belajar programming website untuk saya. dari channel tersebut saya banyak mengetahui cara pembuatan website dan syntax-syntax bahasa program contohnya bahasa program php, javascript dan masih banyak lainnya.

Artikel ini bukan promosi dengan Web Programming Unpas, tetapi saya sendiri yang niat menulis dan menjadikan nya sebuah artikel bermanfaat.

Cara Install Extension

      Anda bisa mengarahkan ke arah kiri menu cari di paling bawah yang bernama Extension, atau tekan ctrl + shift + x atau di mac comment + shift + x.

10 Extension

1. Sublime Text Keymap

Bagi anda sebelumnya pengguna sublime text dan sudah tau shortcut yang berada di sublime text. anda bisa juga memiliki shortcut sublime text ke dalama visual studio code.
Contohnya, di sublime cara membuka sidebar dengan cara ctrl + k,b. tetapi di visual studio code tidak bisa, maka dari itulah anda harus menginstall Sublime Text Keymap.

2. Open In Browser

Cara membuka file html di sublime text dengan cara klik kanan lalu open browser, tetapi di visual studio code belum ada. maka nya anda harus install.

3. Live Server

Extension ini bukan hanya menampilkan hasil website anda dengan mudah, tetapi juga saat anda mengedit web tidak perlu di reload lagi dan anda tidak perlu pindah tab untuk merefrest. Extension ini otomatis, saat anda mengubah script akan berubah.

4. Auto Rename Tag

Membantu saat anda menganti sebuah tag, misalnya anda menulis h1 terus mau diganti menjado h2. anda tidak perlu manganti tag pembuka dan tag penutupnya, cukup ganti tag pembukanya otomatis tag penutupnya di ganti.

5. Intellisense For Css Clas Name

Membantu anda sebagai web desainer, apalagi anda lagi megerjakan menggunakan framework bootstrap, di bootstrap ada banyak class-class nya, kadang anda tidak hafal semua classnya. cara manualnya, anda buka documentasi bootstrap lalu anda bolak-balik. Extension ini berguna untuk memudahkan melihat class apa saja didalam file css yang sudah anda panggil

6. Css Peek

Mengintip element yang sudah anda buat terkena css apa. misalnya melihat file html terus anda mau tahu element ini sudah terkena class apa

7. Indent Rainbow

Extension ini sangat membantu saat anda membuat halaman html yang didalamnya ada banyak div, terkadang anda binggung. div yang ini tutupnya yang mana.

8. Bracket Pair Colorizer

Mirip seperti indent rainbow, tetapi ini untuk kurung kurawal. misalnya anda ngoding menggunakan php atau javascript

9. Beautify

Membantu formating coding anda. contohnya saat anda copy script bootstrap, waktu pertama simpan tagnya berantakan. saat meginstall Beautify maka code nya akan otomatis di formatkan, formatnya bisa anda bikin sendiri atau menggunakan format di dalam Beautify. sangat membantu saat anda bekerja di dalam team, pada akhirnya codenya digabungkan dan menggunakan format yang sama .

10. Php Intellisense

terutama anda bekerja di file php. ketika anda mengetik script php akan muncul auto complate. sebetulnya di vscode sudah ada tetapi tidak lengkap.

11. One Drark Pro

Sebetulnya ini bukan Extension tetapi theme yang paling populer digunakan di vscode, bagi anda yang tau kode editor yang bernama atom, thema warnanya itu banyak yang suka

Nonton Lebih Asik

Demikianlah Extension vscode wajib di gunakan oleh programmer, apabila bermanfaat, bantu bagikan artikel ini keteman-teman anda. agar blog ini berkembang terus ke depannya.
Source : Web Programming Unpas.

Surya Seorang mahasiswa yang senang membagikan informasi yang sudah saya dapatkan. Informasi yang saya tulis blog ini, sesuai pengalaman saya dari pertama blog.

Berbagi :