fbpx

Order Now - Dedicated Server High Performance

Panduan

Cara Coding HTML di Visual Studio Code Dengan Mudah 

Wiliam

HTML merupakan dasar bagi bizzie yang sedang belajar bahasa pemrograman. HTML sendiri merupakan singkatan dari HyperText Markup Language. Dimana artinya adalah bahasa markup yang digunakan dalam membuat atau menuliskan kode program sehingga terbentuk dalam suatu halaman website. HTML disusun dengan menggunakan tanda (mark) atau disebut juga tag. Dimana tanda tag ini berfungsi untuk menandai tipe text tertentu pada halaman website. 

Dalam menyusun sebuah website, HTML harus disimpan dalam bentuk file dengan ekstensi .html. Sedangkan Visual Studio Code merupakan salah satu text editor (penyunting) kode sumber (source code) yang dikembangkan oleh Microsoft. Dimana Visual Studio Code ini bisa diakses melalui OS Windows, Linux atau Mac. Dengan menggunakan perangkat lunak ini, bizzie akan mengetahui cara coding HTML di Visual Studio Code. 

Melalui Visual Studio Code bizzie juga bisa menulis dan menyunting kode dalam berbagai bahasa pengkodean, salah satunya adalah HTML. Namun, bagaimana cara coding HTML di Visual Studio Code. Tenang, ada beberapa ekstension dari VSCode ini yang bisa bizzie gunakan untuk menjalankan kode HTML secara mudah. Selain itu, bizzie juga bisa menjalankan berkas HTML dengan menggunakan Terminal. Berikut ini ada penjelasan cara coding HTML di Visual Studio Code. 

Cara Coding HTML di Visual Studio Code 

1. Membuat, Membuka dan Menyimpan Berkas HTML 

●       Cara coding HTML di Visual Studio Code pertama adalah membuka Visual Studio Code yang berbentuk pita biru. Kemudian jalankan Visual Studio Code dengan mengklik ikonnya. Bizzie bisa menemukan ikon ini di dalam menu Start (Windows), folder Applications (Mac) atau menu Apps (Linux). Namun, apabila tidak punya maka bizzie bisa mengunduhnya secara gratis.

●       Selanjutnya buka atau buat berkas baru dengan cara melakukan salah satu langkah berikut ini:

●       Membuat berkas baru dengan mengklik File pada bilah menu di bagian sisi atas dan melanjutkan dengan klik New File. Nah, bizzie sudah bisa mulai mengetik kode HTML.

●       Membuka berkas yang sudah ada dengan mengklik File pada bilah menu di bagian sisi atas dan melanjutkan dengan klik Open File. Kemudian cari berkas HTML yang bizzie inginkan dan pilih berkas tersebut dengan mengkliknya, setelah itu klik Open.

●       Setelah itu bizzie sudah siap untuk menjalankan berkas HTML di Visual Studio Code. Simpan berkas tersebut dalam bentuk HTML. Jika berkas sudah tersimpan maka bizzie bisa menjalankannya sesuka bizzie. 

2. Cara coding HTML di Visual Studio Code dengan Menggunakan Terminal 

●       Cara coding HTML di Visual Studio Code yang pertama adalah membuka Visual Studio Code dan menjalankannya dengan mengklik ikonnya. Bizzie bisa menemukan VS Code ini di dalam menu Start pada Windows, folder Applications pada Mac dan menu Apps pada Linux.

●       Kemudian buka berkas HTML yang sudah ada, jika belum bizzie bisa membuat berkas HTML baru lalu simpan dalam format HTML. Apabila berkas HTML tersebut sudah terbuka, lalu klik tab yang berisikan berkas HTML di bagian sisi atas layar untuk menampilkannya.

●       Cara coding HTML di Visual Studio Code selanjutnya adalah dengan membuka terminal baru. Lakukan cara ini dengan mengklik Terminal di bagian sisi atas layar dan mengklik New Terminal. Terminal ini sendiri merupakan satu-satunya cara untuk membuka berkas HTML di Visual Studio Code tanpa harus menggunakan ekstensi. Caranya juga terbilang paling rumit dibandingkan ekstensi. Sebagai alternatifnya bizzie bisa mengklik View di bagian sisi atas dan mengklik Terminal.

●       Cara coding HTML di Visual Studio Code berikutnya bizzie akan diarahkan ke lokasi berkas HTML. Bizzie bisa menuliskan cd yang diikuti dengan path berkas HTML-nya lalu tekan enter. Contohnya apabila berkas HTML berada di folder Documents, maka klik cd\users\namapengguna\Documents dan tekan tombol enter.

●       Apabila berkas HTML disimpan di drive lain (bukan drive yang sama dengan sistem operasi komputer) maka gantilah drive tersebut di terminal agar bizzie bisa membuka path ke berkas HTML.

●       Jika bizzie lupa dengan lokasi penyimpanan berkas HTML, maka klik kanan tab untuk berkas HTML tersebut di sisi atas layar. Kemudian pilih Copy Path klik cd di terminal, lalu tempelkan path berkas HTML langsung di sebelahnya.

●       Apabila nama folder di dalam path berkas HTML memiliki spasi, maka Terminal tidak akan bisa membuka folder tersebut. Oleh karena itu, gunakan File Explorer untuk membuka folder yang memiliki spasi tersebut. Kemudian gantilah nama foldernya dengan cara menghilangkan spasinya. 

●       Cara coding HTML di Visual Studio Code dengan menggunakan Terminal yang terakhir adalah mengetik Start yang diikuti dengan nama berkas HTML kemudian tekan enter. Contohnya, jika bizzie ingin membuka berkas HTML bernama index, maka ketik startindex.html dan tekan tombol enter. Maka berkas HTML tersebut akan dibuka di jendela yang baru sehingga bizzie dapat melihat pratinjaunya. Apabila bizzie ingin menutup pratinjau maka klik ikon X di sisi atas jendela. 

Nah, itu dia tadi penjelasan singkat bagaimana cara coding HTML di Visual Studio Code dengan menggunakan beberapa metode. Semoga penjelasan yang kami jelaskan diatas dapat dengan mudah dimengerti. Terutama bagi bizzie yang menggunakan Visual Studio Code. Jangan lupa untuk terus mempelajari dunia coding atau bahasa pemrograman agar kemampuan bizzie semakin terasah, tentunya dengan bantuan text editor seperti Visual Studio Code. 

Baca Juga