Ta din kodningsproduktivitet till nästa nivå genom att integrera ChatGPT med VS Code.

Du kan vara chef för dina uppgifter och öka din produktivitet när du lär dig att utnyttja AI-verktygen som dagligen kommer ut från forskningslabb. VS Code har tillägget ChatGPT för att ge dig en OpenAI-aktiverad kodningsmiljö.

Du kan utnyttja ChatGPT: s stora kodningsmodell för att slutföra dina projekt mer effektivt och snabbare – direkt i IDE. Här är praktiska sätt att använda ChatGPT med VS-kod.

Hur man installerar och använder ChatGPT-tillägget i VS-kod

När du söker efter "ChatGPT" eller "Code GPT" på VS Code extension marketplace kommer många relaterade tillägg upp. Till skillnad från GitHub Copilot är dessa inte officiellt direkt från OpenAI.

De flesta VS Code ChatGPT-tillägg som samplades fungerar dock på samma sätt. Men vi kommer att hålla oss till EasyCodes ChatGPT-tillägg för den här artikeln, eftersom det är ganska anständigt för att demonstrera ChatGPT-användningsfall i VS-kod. Den stöder GPT-4 och GPT-3.5, har en gratis nivå och kräver ingen API-nyckel.

instagram viewer

Så här installerar du tillägget ChatGPT i VS Code:

  1. Öppna VS-kod och klicka på inställningsikonen längst ner till vänster i det vänstra sidofältet.
  2. Gå till Tillägg.
  3. Alternativt, tryck på Ctrl + Shift + X (Kommando + Skift + X för Mac) för att direkt öppna tilläggens marknadsplats.
  4. Skriv "ChatGPT - EasyCode" i sökfältet uppe till vänster.
  5. Klicka på tillägget när det visas.
  6. Klicka slutligen Installera.
  7. Du kommer att se tilläggsikonen i det vänstra sidofältet när det är installerat.
  8. Klicka på tilläggsikonen. Klick Prova utan konto. Men gärna Logga in om du har ett konto eller Bli Medlem för ett nytt konto hos tilläggsleverantören.

Hur man använder ChatGPT-tillägget

  1. För att använda en inbyggd prompt, markera målkoden och högerklicka på den. Välj någon av de tillgängliga uppmaningarna.
  2. För att skriva en anpassad prompt högerklickar du på den markerade koden och väljer Fråga GPT. Skriv din prompt i chattrutan längst upp och tryck Stiga på.

Hur man använder ChatGPT-tillägget med din kodbas

Om du har öppnat VS Code till din kodbaskatalog och vill att ChatGPT ska få åtkomst till underliggande moduler:

  1. Klicka på tilläggsikonen i det vänstra sidofältet. Kontrollera sedan Fråga Codebase låda.
  2. Kopiera målkoden och klistra in den i chattrutan.
  3. Skriv din prompt under koden (tryck Skift + Enter) i chattrutan.
  4. Tryck Stiga på eller klicka på skicka-ikonen.

Låt oss nu se de olika sätten att använda ChatGPT i VS Code.

1. Refaktorera och ändra kod

ChatGPT har visat sig vara användbart för att modifiera procedurmässig, funktionell och objektorienterad kod.

Till exempel, med hjälp av detta tillägg, bad vi ChatGPT att omfaktorisera den felaktiga koden nedan, en Python-funktion för att skapa en godtycklig ordlista och lägga till "Köp" till varje värde.

defmakeDict(n: str, **kwargs)->dikt:
några: dikt
för nyckelvärde i kwargs.items():
några = n+" "+värde
lämna tillbaka några

newDict = makeDict("Köpa", artikel1="GPT-bok", artikel2="Java Tutorial", item3="Vandringsguide")

Det gick ganska bra att producera rätt kod som ger den förväntade utdata, med detaljerade skäl för ändringen:

Vidare kan du använda Fråga en uppföljning ruta för att tala om för ChtGPT att konvertera koden till en klass och visa hur man instansierar den:

Den genererade koden ovan är mer modulär och återanvändbar.

2. Felsök din kod

Om din kod ger ett fel eller inte fungerar som den ska, sparar du tid att be ChatGPT att felsöka den direkt i VS Code.

Även om det inte finns någon inbyggd uppmaning för felsökning, kan du använda Fråga GPT alternativet för att skapa en anpassad prompt för att felsöka din kod.

Vi bad ChatGPT-tillägget att felsöka koden vi använde tidigare. Inte bara felsökte det. Den förklarade det och genererade den korrekta, inklusive dess förväntade utdata.

3. Skriv din kod på ett annat språk

Du kanske vill skriva ett program på ett speciellt språk utöver din kärna. Du kan skriva din kod på ditt kärnspråk och be ChatGPT att skriva om den på det valda programmeringsspråket.

Den genererade koden kan dock kräva lite mänsklig input, eftersom ChatGPT kan misslyckas med att tillhandahålla en fullt fungerande konverterad kod i vissa fall.

Till exempel konverterade vi följande Python-kod till dess C-ekvivalent med VS Code ChatGPT-tillägget:

Du kan uppnå detta genom att högerklicka på den markerade koden och välja Fråga GPT alternativ.

Här är vår uppmaning i VS-kod:

Även om den genererade C-ekvivalenten två gånger innan den blev rätt, fungerar den slutliga koden.

4. Generera en gränssnittskomponent för ditt API

Om du har skrivit ett API med olika slutpunkter kan du be ChatGPT-tillägget att tillhandahålla en frontend-komponent för att konsumera den med ett visst ramverk. Detta kan vara React, Vue eller Angular.

Till exempel använde vi tillägget för att generera en React-komponent för att skapa ett mötesschema baserat på en API-slutpunkt skapad med Pythons FastAPI:

Som gjort ovan kanske du vill kontrollera Fråga Codebase box om du har att göra med en stor kodbas.

Efter att ha hänvisat till vår kodbas gav VS Code ChatGPT-tillägget en praktisk React-komponent för att använda den medföljande slutpunkten:

5. Förklara kodblock

Anta att du tog en bit kod från Stack Overflow eller ett GitHub-förråd. Du kan be ChatGPT-tillägget i VS Code att förklara hur det fungerar för bättre förståelse. Detta hjälper dig att enkelt felsöka sådan kod om buggar uppstår på grund av framtida kodändringar.

I det här exemplet bad vi ChatGPT-tillägget att förklara följande kod; en Python-klass för att verifiera användarnas e-postadresser.

Det genererade följande svar:

6. Generera HTML-mallar för din applikation

Genom att använda ChatGPT-tillägget i VS Code kan du skapa en HTML-mall (som inmatningsfält) från början – direkt med hjälp av tilläggets chattruta. Du kan till exempel berätta för den att skapa en HTML-mall för användarregistrering.

Men vad händer om du skriver ett program som renderar data direkt till HTML (en icke-SPA) och vill ha en projektspecifik mall? Du kan använda ChatGPT-tillägget i VS Code för att skapa HTML-mallar som visar backend-data för användare.

Till exempel, om du använder en MVT-arkitekturbaserat ramverk som Django, kan du använda tillägget för att skapa HTML-mallar för dina Django-vyer.

Återigen, för den här typen av användningsfall kanske du vill klicka på Fråga Codebase kryssrutan för ChatGPT för att komma åt din kodbas.

7. Enhetstesta din kod

Lika viktigt som enhetstestning är, kan det vara en tidskonsument. Du kan utnyttja VS Code ChatGPT-tillägget för att generera enhetstester för din kod och spara värdefull utvecklingstid.

Även om ChatGPT-tillägget har en inbyggd prompt för att generera enhetstester, kanske du vill skriva en anpassad prompt med Fråga Codebase alternativ för specificitet och ett bättre resultat.

Vi bad ChatGPT att skriva ett enhetstest för en registreringsslutpunkt skapad med Pythons FastAPI:

Den samplade kodbasen effektivt för att generera det nödvändiga enhetstestet:

8. Hitta potentiella säkerhetssårbarheter

Även om det kanske inte ger detaljerad säkerhetsanalys, kan VS Code ChatGPT-tillägget vara ett praktiskt verktyg för att snabbt kontrollera om det finns säkerhetsbrister i din applikation kodbas och sparar tid på att skanna manuellt.

För att tillåta ChatGPT att skanna din kodbas, använd Fråga Codebase (klicka på tilläggsikonen och markera Fråga Codebase låda).

Om du brukar spela dig runt någon gammal eller nya VS Code funktioner, fråga dig gärna runt IDE från ChatGPT-tillägget.

Du kan till exempel be tillägget att rekommendera de bästa tilläggen för att felsöka ett visst programmeringsspråk.

Eller så kan du ställa en mer teknisk fråga, som hur man öppnar VS-kod från kommandoraden.

10. Skriv dokumentation direkt från VS-kod

Du kan enkelt skriva detaljerad dokumentation för en kodbit direkt från VS Code med ChatGPT-tillägget.

Till exempel, här är en detaljerad dokumentation av en zoomlänksfunktion (i HTML-format) som vi genererade med VS Code ChatGPT-tillägget:

Koda effektivt med ChatGPT i VS-kod

Som programmerare i ett snabbt tempo på internet vill du uppnå en minsta möjliga produkt på kortast möjliga tid. Även om ChatGPT inte är helt pålitlig, kan det hjälpa din utvecklingsresa om den används kreativt. Och det finns många fler användningsfall av ChatGPT i programmering. Men med allt detta sagt, se till att du validerar ChatGPTs resultat, eftersom de ibland kan vara vilseledande.