10 tapaa käyttää ChatGPT: tä VS-koodin kanssa

Voit olla tehtäviesi pomo ja parantaa tuottavuuttasi, kun opit hyödyntämään tutkimuslaboratorioista päivittäin poistuvia tekoälytyökaluja. VS Code sisältää ChatGPT-laajennuksen, joka tuo sinulle OpenAI-yhteensopivan koodausympäristön.

Voit hyödyntää ChatGPT: n laajaa koodausmallia toteuttaaksesi projektisi tehokkaammin ja nopeammin – suoraan IDE: n sisällä. Tässä on käteviä tapoja käyttää ChatGPT: tä VS-koodin kanssa.

ChatGPT-laajennuksen asentaminen ja käyttäminen VS-koodissa

Kun haet "ChatGPT" tai "Code GPT" VS Code -laajennusten markkinapaikalla, monia aiheeseen liittyviä laajennuksia tulee näkyviin. Toisin kuin GitHub Copilot, nämä eivät ole virallisesti suoraan OpenAI: lta.

Useimmat VS Code ChatGPT -laajennukset näytteillä toimivat kuitenkin samalla tavalla. Mutta pysytään siinä EasyCoden ChatGPT-laajennus tätä artikkelia varten, koska se sopii hyvin ChatGPT-käyttötapausten esittelyyn VS Codessa. Se tukee GPT-4:ää ja GPT-3.5:tä, siinä on ilmainen taso, eikä se vaadi API-avainta.

ChatGPT-laajennuksen asentaminen VS-koodiin:

1. Avaa VS Code ja napsauta vasemman sivupalkin vasemmassa alakulmassa olevaa asetuskuvaketta.
2. Mene Laajennukset.
3. Vaihtoehtoisesti paina Ctrl + Vaihto + X (Komento + Vaihto + X Macille) avataksesi laajennusten markkinapaikan suoraan.
4. Kirjoita "ChatGPT - EasyCode" vasemmassa yläkulmassa olevaan hakupalkkiin.
5. Napsauta laajennusta, kun näet sen.
6. Napsauta lopuksi Asentaa.
7. Näet laajennuskuvakkeen vasemmassa sivupalkissa, kun se on asennettu.
8. Napsauta laajennuskuvaketta. Klikkaus Kokeile ilman tiliä. Mutta rohkeasti Kirjaudu sisään jos sinulla on tili tai Kirjaudu uudelle tilille laajennuspalveluntarjoajan kanssa.

Kuinka käyttää ChatGPT-laajennusta

1. Jos haluat käyttää sisäänrakennettua kehotetta, korosta kohdekoodi ja napsauta sitä hiiren kakkospainikkeella. Valitse mikä tahansa käytettävissä olevista kehotteista.
2. Voit kirjoittaa mukautetun kehotteen napsauttamalla korostettua koodia hiiren kakkospainikkeella ja valitsemalla Kysy GPT: ltä. Kirjoita kehote yläreunassa olevaan chat-ruutuun ja paina Tulla sisään.

ChatGPT-laajennuksen käyttäminen koodikannan kanssa

Jos olet avannut VS Coden koodin perushakemistoosi ja haluat ChatGPT: n pääsyn taustalla oleviin moduuleihin:

1. Napsauta vasemmassa sivupalkissa olevaa laajennuskuvaketta. Tarkista sitten Kysy koodikannasta laatikko.
2. Kopioi kohdekoodi ja liitä se chat-ruutuun.
3. Kirjoita kehote koodin alle (paina Vaihto + Enter) chat-kentässä.
4. Lehdistö Tulla sisään tai napsauta lähetyskuvaketta.

Katsotaanpa nyt erilaisia ​​​​tapoja käyttää ChatGPT: tä VS-koodissa.

1. Refaktoroi ja muokkaa koodia

ChatGPT on osoittautunut hyödylliseksi proseduurin, toiminnallisen ja oliopohjaisen koodin muokkaamisessa.

Esimerkiksi tätä laajennusta käyttämällä pyysimme ChatGPT: tä muokkaamaan alla olevaa viallista koodia, Python-funktiota luomaan mielivaltaisen sanakirjan ja lisäämään "Osta" jokaiseen arvoon.

defmakeDict(n: str, **kwargs)-> sanele:
 jotkut: sanele
varten avain, arvo sisään kwargs.items():
 jotkut = n+" "+ arvo
palata jonkin verran
newDict = makeDict("Ostaa", item1="GPT kirja", item2="Java opetusohjelma", item3="Vaellusopas")

Se tuotti melko hyvin oikean koodin, joka antaa odotetun tuloksen ja yksityiskohtaiset syyt muutokseen:

Lisäksi voit käyttää Pyydä seurantaa laatikko käskeäksesi ChtGPT: tä muuntaa koodin luokaksi ja näyttää kuinka se luodaan:

Yllä luotu koodi on modulaarisempi ja uudelleenkäytettävä.

2. Tee virheenkorjaus koodisi

Jos koodisi aiheuttaa virheen tai ei toimi niin kuin pitäisi, ChatGPT: n pyytäminen virheenkorjaukseen suoraan VS Coden sisällä säästää aikaa.

Vaikka virheenkorjausta varten ei ole sisäänrakennettua kehotetta, voit käyttää Kysy GPT: ltä vaihtoehto luoda mukautettu kehote koodin virheenkorjausta varten.

Pyysimme ChatGPT-laajennusta korjaamaan aiemmin käyttämämme koodin. Se ei vain tehnyt virheenkorjausta. Se selitti sen ja loi oikean, mukaan lukien sen odotettu tulos.

3. Kirjoita koodisi toisella kielellä

Haluat ehkä kirjoittaa ohjelman jollakin tietyllä kielellä ydinkielen lisäksi. Voit kirjoittaa koodisi ydinkielelläsi ja pyytää ChatGPT: tä kirjoittamaan sen uudelleen valitulla ohjelmointikielellä.

Luotu koodi saattaa kuitenkin vaatia vain vähän ihmisen syöttöä, koska ChatGPT ei välttämättä pysty tarjoamaan täysin toimivaa muunnettua koodia joissakin tapauksissa.

Esimerkiksi muunnosimme seuraavan Python-koodin C-vastineeksi käyttämällä VS Code ChatGPT -laajennusta:

Voit saavuttaa tämän napsauttamalla hiiren kakkospainikkeella korostettua koodia ja valitsemalla Kysy GPT: ltä vaihtoehto.

Tässä on kehotteemme VS Codessa:

Vaikka se loi C-vastineen kahdesti ennen kuin se saatiin oikein, lopullinen koodi toimii.

4. Luo käyttöliittymäkomponentti API: llesi

Jos olet kirjoittanut API: n, jossa on eri päätepisteitä, voit pyytää ChatGPT-laajennusta tarjoamaan käyttöliittymäkomponentin, joka käyttää sitä tietyn kehyksen avulla. Tämä voi olla React, Vue tai Angular.

Käytimme laajennusta esimerkiksi React-komponentin luomiseen kokousaikataulun luomiseksi Pythonin FastAPI: lla luodun API-päätepisteen perusteella:

Kuten edellä on tehty, saatat haluta tarkistaa Kysy koodikannasta laatikkoon, jos kyseessä on suuri koodikanta.

Viitattuaan koodipohjaamme VS Code ChatGPT -laajennus tarjosi kätevän React-komponentin toimitetun päätepisteen käyttöä varten:

5. Selitä koodilohkot

Oletetaan, että nappasit koodinpätkän Stack Overflowsta tai GitHub-arkistosta. Voit pyytää VS Coden ChatGPT-laajennusta selittämään, miten se toimii, jotta ymmärrät paremmin. Tämä auttaa sinua korjaamaan tällaisen koodin helposti, jos virheitä ilmenee tulevien koodimuutosten vuoksi.

Tässä esimerkkikäyttötapauksessa pyysimme ChatGPT-laajennusta selittämään seuraavan koodin; Python-luokka käyttäjien sähköpostiosoitteiden vahvistamiseen.

Se synnytti seuraavan vastauksen:

6. Luo HTML-malleja sovelluksellesi

Käyttämällä VS Coden ChatGPT-laajennusta voit luoda HTML-mallin (kuten syöttökentät) alusta alkaen – käyttämällä suoraan laajennuksen chat-ruutua. Voit esimerkiksi pyytää sitä luomaan HTML-mallin käyttäjän rekisteröintiä varten.

Mutta entä jos kirjoitat sovellusta, joka renderöi tiedot suoraan HTML-muotoon (ei-SPA) ja haluat projektikohtaisen mallin? Voit käyttää VS Coden ChatGPT-laajennusta luodaksesi HTML-malleja, jotka näyttävät taustatiedot käyttäjille.

Esimerkiksi, jos käytät MVT-arkkitehtuuriin perustuva kehys, kuten Django, voit käyttää laajennusta luodaksesi HTML-malleja Django-näkymillesi.

Jälleen, tämän tyyppisessä käyttötapauksessa saatat haluta napsauttaa Kysy koodikannasta ChatGPT-valintaruutu päästäksesi koodikantaasi.

7. Yksikkötestaa koodisi

Vaikka yksikkötestaus onkin olennaista, se voi olla ajankuluttaja. Voit hyödyntää VS Code ChatGPT -laajennusta luodaksesi yksikkötestejä koodillesi ja säästääksesi arvokasta kehitysaikaa.

Vaikka ChatGPT-laajennuksessa on sisäänrakennettu kehote yksikkötestien luomista varten, saatat haluta kirjoittaa mukautetun kehotteen käyttämällä Kysy koodikannasta vaihtoehto tarkkuuden ja paremman tuloksen vuoksi.

Pyysimme ChatGPT: tä kirjoittamaan yksikkötestin Pythonin FastAPI: lla luodulle rekisteröintipäätepisteelle:

Se otti koodikannasta näytteitä tehokkaasti luodakseen vaaditun yksikkötestin:

8. Etsi mahdollisia tietoturva-aukkoja

Vaikka VS Code ChatGPT -laajennus ei välttämättä tarjoa yksityiskohtaista suojausanalyysiä, se voi olla kätevä työkalu nopeaan tarkista sovelluksesi tietoturva-aukkoja koodipohja ja säästää aikaa manuaalisessa skannauksessa.

Jos haluat sallia ChatGPT: n tarkistaa koodipohjasi, käytä Kysy koodikannasta vaihtoehto (napsauta laajennuskuvaketta ja tarkista Kysy koodikannasta laatikko).

Jos yleensä pelaat uhkapelejäsi joidenkin vanhojen tai uudet VS Code -ominaisuudet, voit kysyä IDE-ympäristöäsi ChatGPT-laajennuksesta.

Voit esimerkiksi pyytää laajennusta suosittelemaan parhaita laajennuksia tietyn ohjelmointikielen virheenkorjaukseen.

Tai voit kysyä siltä teknisemmän kysymyksen, kuten kuinka avata VS-koodi komentoriviltä.

10. Kirjoita dokumentaatio suoraan VS-koodista

Voit kirjoittaa koodinpätkälle yksityiskohtaisen dokumentaation suoraan VS Codesta helposti käyttämällä ChatGPT-laajennusta.

Tässä on esimerkiksi yksityiskohtainen dokumentaatio Zoom-linkinluontitoiminnosta (HTML-muodossa), jonka loimme käyttämällä VS Code ChatGPT -laajennusta:

Koodaa tehokkaasti ChatGPT: llä VS-koodissa

Ohjelmoijana nopeatempoisessa internetissä haluat saavuttaa mahdollisimman vähän elinkelpoista tuotetta mahdollisimman pienessä ajassa. Vaikka ChatGPT ei ole täysin luotettava, se saattaa auttaa kehitysmatkaasi, jos sitä käytetään luovasti. Ja ohjelmoinnissa on monia muita ChatGPT: n käyttötapauksia. Varmista kuitenkin, että vahvistat ChatGPT: n tulokset, koska ne voivat joskus olla harhaanjohtavia.