Farih.co.id
Home Programming 10 Cara Anda Dapat Menggunakan ChatGPT Dengan Kode VS

10 Cara Anda Dapat Menggunakan ChatGPT Dengan Kode VS

ways to use chatgpt in vs code

Anda bisa menjadi bos dari tugas Anda dan meningkatkan produktivitas Anda saat Anda belajar memanfaatkan alat AI yang keluar dari laboratorium penelitian setiap hari. VS Code menampilkan ekstensi ChatGPT untuk memberi Anda lingkungan pengkodean yang mendukung OpenAI.


Anda dapat memanfaatkan model pengodean ChatGPT yang luas untuk menyelesaikan proyek Anda dengan lebih efisien dan lebih cepat—tepat di dalam IDE. Berikut adalah cara praktis Anda dapat menggunakan ChatGPT dengan Kode VS.


Cara Memasang dan Menggunakan Ekstensi ChatGPT di VS Code

Saat Anda mencari “ChatGPT” atau “Code GPT” di pasar ekstensi VS Code, banyak ekstensi terkait muncul. Tidak seperti GitHub Copilot, ini tidak resmi langsung dari OpenAI.

Namun, sebagian besar sampel ekstensi VS Code ChatGPT bekerja dengan cara yang sama. Tapi kami akan tetap berpegang pada Ekstensi ChatGPT EasyCode untuk artikel ini, karena cukup baik untuk mendemonstrasikan kasus penggunaan ChatGPT di VS Code. Ini mendukung GPT-4 dan GPT-3.5, memiliki tingkat gratis, dan tidak memerlukan kunci API.

Untuk menginstal ekstensi ChatGPT di VS Code:

  1. Buka Kode VS dan klik ikon pengaturan di kiri bawah sidebar kiri.
  2. Pergi ke Ekstensi.
    Opsi ekstensi Kode VS
  3. Atau, tekan Ctrl + Shift + X (Perintah + Shift + X untuk Mac) untuk langsung membuka pasar ekstensi.
  4. Ketik “ChatGPT – EasyCode” di bilah pencarian di kiri atas.
  5. Klik ekstensi saat terlihat.
  6. Terakhir, klik Install.
    Pasar ekstensi ChatGPT
  7. Anda akan melihat ikon ekstensi di sidebar kiri setelah dipasang.
  8. Klik ikon ekstensi. Klik Coba Tanpa Akun. Tapi jangan ragu untuk Masuk jika Anda memiliki akun atau Mendaftar untuk akun baru dengan penyedia ekstensi.
    Ekstensi ChatGPT di sidebar VS Code

Cara Menggunakan Ekstensi ChatGPT

  1. Untuk menggunakan prompt bawaan, sorot kode target dan klik kanan. Pilih salah satu petunjuk yang tersedia.
    Opsi Kode ChatGPT VS
  2. Untuk menulis custom prompt, klik kanan pada kode yang disorot dan pilih Ask GPT. Ketik prompt Anda di kotak obrolan di bagian atas dan tekan Memasuki.
    Permintaan debug

Cara Menggunakan Ekstensi ChatGPT Dengan Basis Kode Anda

Jika Anda telah membuka Kode VS ke direktori basis kode Anda dan ingin ChatGPT mengakses modul yang mendasarinya:

Contoh penggunaan ekstensi

  1. Klik ikon ekstensi di sidebar kiri. Kemudian periksa Tanyakan Basis Kode kotak.
  2. Salin kode target dan rekatkan ke kotak obrolan.
  3. Ketik prompt Anda di bawah kode (tekan Geser + Masuk) di kotak obrolan.
  4. Tekan Memasuki atau klik ikon kirim.

Sekarang mari kita lihat berbagai cara menggunakan ChatGPT di VS Code.

1. Refactor dan Modifikasi Kode

ChatGPT telah terbukti bermanfaat untuk memodifikasi kode prosedural, fungsional, dan berorientasi objek.

Misalnya, dengan menggunakan ekstensi ini, kami meminta ChatGPT untuk memperbaiki kode yang salah di bawah, fungsi Python untuk membuat kamus arbitrer dan menambahkan “Beli” ke setiap nilai.

 def makeDict(n: str, **kwargs)->dict:
    some : dict
    for key, value in kwargs.items():
        some = n+" "+value
    return some

newDict = makeDict("Buy", item1="GPT Book", item2="Java Tutorial", item3="Hiking Guide")

Itu cukup baik menghasilkan kode yang benar yang memberikan hasil yang diharapkan, dengan alasan terperinci untuk modifikasi:

Contoh koreksi kode yang direfaktorisasi

Selanjutnya, Anda dapat menggunakan Tanyakan tindak lanjut kotak untuk memberi tahu ChtGPT untuk mengonversi kode menjadi kelas dan menunjukkan cara membuat instance:

Tindak lanjut kotak refactored menjadi kelas

Kode yang dihasilkan di atas lebih modular dan dapat digunakan kembali.

2. Debug Kode Anda

Jika kode Anda menampilkan kesalahan atau tidak berfungsi sebagaimana mestinya, meminta ChatGPT untuk men-debugnya langsung di dalam VS Code akan menghemat waktu.

Meskipun tidak ada prompt bawaan untuk debugging, Anda dapat menggunakan Tanya GPT opsi untuk membuat permintaan khusus untuk men-debug kode Anda.

Kami meminta ekstensi ChatGPT untuk men-debug kode yang kami gunakan sebelumnya. Tidak hanya melakukan debug. Itu menjelaskannya dan menghasilkan yang benar, termasuk hasil yang diharapkan.

Keluaran kode debug

3. Tulis Kode Anda dalam Bahasa Lain

Anda mungkin ingin menulis program dalam bahasa tertentu selain inti Anda. Anda dapat menulis kode Anda dalam bahasa inti Anda dan meminta ChatGPT untuk menulis ulang dalam bahasa pemrograman yang dipilih.

Namun, kode yang dihasilkan mungkin memerlukan sedikit input manusia, karena ChatGPT mungkin gagal memberikan kode konversi yang berfungsi penuh dalam beberapa kasus.

Misalnya, kami mengonversi kode Python berikut menjadi setara C menggunakan ekstensi VS Code ChatGPT:

Kode ke untuk mengonversi ke contoh C

Anda dapat melakukannya dengan mengklik kanan pada kode yang disorot dan memilih Tanya GPT pilihan.

Inilah permintaan kami di VS Code:

Obrolan Kode VS Perintah konversi kode GPT

Meskipun menghasilkan C yang setara dua kali sebelum melakukannya dengan benar, kode terakhir berfungsi.

Kode C yang dihasilkan

4. Hasilkan Komponen Frontend untuk API Anda

Jika Anda telah menulis API dengan titik akhir yang berbeda, Anda dapat meminta ekstensi ChatGPT untuk menyediakan komponen frontend untuk menggunakannya menggunakan kerangka kerja tertentu. Ini bisa berupa React, Vue, atau Angular.

Misalnya, kami menggunakan ekstensi untuk menghasilkan komponen React untuk membuat jadwal rapat berdasarkan titik akhir API yang dibuat menggunakan FastAPI Python:

Permintaan komponen ekstensi ChatGPT

Seperti yang dilakukan di atas, Anda mungkin ingin memeriksa Tanyakan Basis Kode kotak jika Anda berurusan dengan basis kode yang besar.

Setelah mereferensikan basis kode kami, ekstensi VS Code ChatGPT menyediakan komponen React yang berguna untuk menggunakan titik akhir yang disediakan:

Komponen reaksi yang dihasilkan

5. Jelaskan Blok Kode

Asumsikan Anda mengambil sepotong kode dari Stack Overflow atau repositori GitHub. Anda dapat meminta ekstensi ChatGPT di VS Code untuk menjelaskan cara kerjanya untuk pemahaman yang lebih baik. Ini membantu Anda men-debug kode tersebut dengan mudah jika bug muncul karena perubahan kode di masa mendatang.

Dalam contoh kasus penggunaan ini, kami meminta ekstensi ChatGPT untuk menjelaskan kode berikut; kelas Python untuk memverifikasi alamat email pengguna.

Kode untuk menjelaskan contoh

Itu menghasilkan respons berikut:

Kode menjelaskan contoh output

6. Hasilkan Template HTML untuk Aplikasi Anda

Dengan menggunakan ekstensi ChatGPT di VS Code, Anda dapat membuat template HTML (seperti kolom input) dari awal—menggunakan kotak obrolan ekstensi secara langsung. Misalnya, Anda dapat memintanya untuk membuat template HTML untuk pendaftaran pengguna.

Contoh template pendaftaran pengguna

Tetapi bagaimana jika Anda sedang menulis aplikasi yang merender data ke dalam HTML secara langsung (non-SPA) dan menginginkan template khusus proyek? Anda dapat menggunakan ekstensi ChatGPT di VS Code untuk membuat template HTML yang menampilkan data backend kepada pengguna.

Misalnya, jika Anda menggunakan kerangka kerja berbasis arsitektur MVT seperti Django, Anda dapat menggunakan ekstensi untuk memalsukan templat HTML untuk tampilan Django Anda.

Contoh template HMTL yang dihasilkan

Sekali lagi, untuk jenis kasus penggunaan ini, Anda mungkin ingin mengeklik Tanyakan Basis Kode kotak centang untuk ChatGPT untuk mengakses basis kode Anda.

7. Uji Unit Kode Anda

Sama pentingnya dengan pengujian unit, ini bisa menjadi konsumen waktu. Anda dapat memanfaatkan ekstensi VS Code ChatGPT untuk membuat pengujian unit untuk kode Anda dan menghemat waktu pengembangan yang berharga.

Meskipun ekstensi ChatGPT memiliki permintaan bawaan untuk membuat pengujian unit, Anda mungkin ingin menulis permintaan khusus menggunakan Tanyakan Basis Kode pilihan untuk spesifisitas dan hasil yang lebih baik.

Kami meminta ChatGPT untuk menulis pengujian unit untuk titik akhir pendaftaran yang dibuat menggunakan FastAPI Python:

Perintah pengujian unit

Ini mengambil sampel basis kode secara efisien untuk menghasilkan pengujian unit yang diperlukan:

Tes unit yang dihasilkan

8. Temukan Potensi Kerentanan Keamanan

Meskipun mungkin tidak memberikan analisis keamanan terperinci, ekstensi VS Code ChatGPT dapat menjadi alat praktis untuk memeriksa kerentanan keamanan dengan cepat di basis kode aplikasi Anda dan menghemat waktu pemindaian secara manual.

Kerentanan keamanan meminta VS Code

Untuk mengizinkan ChatGPT memindai basis kode Anda, gunakan Tanyakan Basis Kode pilihan (klik ikon ekstensi dan periksa Tanyakan Basis Kode kotak).

Jika Anda biasanya mempertaruhkan beberapa fitur VS Code lama atau baru, jangan ragu untuk bertanya tentang IDE dari ekstensi ChatGPT.

Misalnya, Anda dapat meminta ekstensi untuk merekomendasikan ekstensi terbaik untuk men-debug bahasa pemrograman tertentu.

Permintaan khusus Kode VS

Atau Anda dapat mengajukan pertanyaan yang lebih teknis, seperti cara membuka Kode VS dari baris perintah.

Teknis cepat khusus Kode VS

10. Tulis Dokumentasi Langsung Dari VS Code

Anda dapat menulis dokumentasi mendetail untuk sepotong kode langsung dari VS Code dengan mudah menggunakan ekstensi ChatGPT.

Misalnya, berikut adalah dokumentasi mendetail tentang fungsi pembuatan tautan Zoom (dalam format HTML) yang kami buat menggunakan ekstensi VS Code ChatGPT:

Contoh dokumentasi yang dihasilkan

Kode Secara Efisien Dengan ChatGPT dalam Kode VS

Sebagai seorang programmer di internet yang bergerak cepat, Anda ingin mencapai produk minimum yang layak dalam waktu minimum. Meskipun ChatGPT tidak sepenuhnya dapat diandalkan, ini dapat membantu perjalanan pengembangan Anda jika digunakan secara kreatif. Dan masih banyak lagi kasus penggunaan ChatGPT dalam pemrograman. Namun, dengan semua itu, pastikan Anda memvalidasi hasil ChatGPT, karena terkadang bisa menyesatkan.

Comment
Share:

Leave a Reply

Your email address will not be published. Required fields are marked *

Ad