10 modi in cui puoi utilizzare ChatGPT con VS Code

Puoi essere il capo delle tue attività e aumentare la tua produttività quando impari a sfruttare gli strumenti di intelligenza artificiale che escono quotidianamente dai laboratori di ricerca. VS Code presenta l'estensione ChatGPT per offrirti un ambiente di codifica abilitato per OpenAI.

Puoi sfruttare il vasto modello di codifica di ChatGPT per completare i tuoi progetti in modo più efficiente e rapido, direttamente all'interno dell'IDE. Ecco alcuni pratici modi per utilizzare ChatGPT con VS Code.

Come installare e utilizzare l'estensione ChatGPT in VS Code

Quando cerchi "ChatGPT" o "Code GPT" nel marketplace delle estensioni VS Code, vengono visualizzate molte estensioni correlate. A differenza di GitHub Copilot, questi non provengono ufficialmente direttamente da OpenAI.

Tuttavia, la maggior parte delle estensioni VS Code ChatGPT campionate funziona allo stesso modo. Ma continueremo a Estensione ChatGPT di EasyCode

per questo articolo, in quanto è abbastanza decente per dimostrare i casi d'uso di ChatGPT in VS Code. Supporta GPT-4 e GPT-3.5, ha un livello gratuito e non richiede una chiave API.

Per installare l'estensione ChatGPT in VS Code:

1. Apri VS Code e fai clic sull'icona delle impostazioni nella parte inferiore sinistra della barra laterale sinistra.
2. Vai a Estensioni.
3. In alternativa, premere CTRL+MAIUSC+X (Comando + Maiusc + X per Mac) per aprire direttamente il marketplace delle estensioni.
4. Digita "ChatGPT - EasyCode" nella barra di ricerca in alto a sinistra.
5. Fai clic sull'estensione quando viene visualizzata.
6. Infine, fai clic Installare.
7. Vedrai l'icona dell'estensione nella barra laterale sinistra una volta installata.
8. Fare clic sull'icona dell'estensione. Clic Prova senza account. Ma sentiti libero di farlo Registrazione se hai un account o Iscrizione per un nuovo account con il fornitore dell'estensione.

Come utilizzare l'estensione ChatGPT

1. Per utilizzare un prompt integrato, evidenziare il codice di destinazione e fare clic con il pulsante destro del mouse. Seleziona uno dei prompt disponibili.
2. Per scrivere un messaggio personalizzato, fai clic con il pulsante destro del mouse sul codice evidenziato e seleziona Chiedi a GPT. Digita la tua richiesta nella finestra di chat in alto e premi accedere.

Come utilizzare l'estensione ChatGPT con la tua base di codice

Se hai aperto VS Code nella tua directory di base del codice e desideri che ChatGPT acceda ai moduli sottostanti:

1. Fare clic sull'icona dell'estensione nella barra laterale sinistra. Poi controlla il Chiedi a Codebase scatola.
2. Copia il codice target e incollalo nella finestra della chat.
3. Digita il tuo prompt sotto il codice (premi Maiusc + Invio) nella finestra della chat.
4. Premere accedere o fare clic sull'icona di invio.

Vediamo ora i vari modi per utilizzare ChatGPT in VS Code.

1. Refactoring e modifica codice

ChatGPT si è dimostrato utile per modificare il codice procedurale, funzionale e orientato agli oggetti.

Ad esempio, utilizzando questa estensione, abbiamo chiesto a ChatGPT di eseguire il refactoring del codice errato riportato di seguito, una funzione Python per creare un dizionario arbitrario e aggiungere "Acquista" a ciascun valore.

defmakeDict(n: str, **kwargs)->ditto:
 alcuni: dict
per chiave, valore In kwargs.items():
 alcuni = n+" "+valore
ritorno Alcuni
newDict = makeDict("Acquistare", elemento1="Libro GPT", elemento2="Esercitazione Java", oggetto3="Guida escursionistica")

Ha funzionato abbastanza bene producendo il codice corretto che fornisce l'output previsto, con motivi dettagliati per la modifica:

Inoltre, puoi usare il Chiedi un seguito box per dire a ChtGPT di convertire il codice in una classe e mostrare come crearne un'istanza:

Il codice generato sopra è più modulare e riutilizzabile.

2. Fai il debug del tuo codice

Se il tuo codice genera un errore o non funziona come dovrebbe, chiedi a ChatGPT di eseguire il debug direttamente all'interno di VS Code per risparmiare tempo.

Sebbene non sia presente alcun prompt integrato per il debug, è possibile utilizzare il file Chiedi a GPT opzione per creare un prompt personalizzato per eseguire il debug del codice.

Abbiamo chiesto all'estensione ChatGPT di eseguire il debug del codice utilizzato in precedenza. Non solo ha eseguito il debug. Lo ha spiegato e ha generato quello corretto, incluso l'output previsto.

3. Scrivi il tuo codice in un'altra lingua

Potresti voler scrivere un programma in una lingua particolare oltre al tuo core. Puoi scrivere il tuo codice nel tuo linguaggio principale e chiedere a ChatGPT di riscriverlo nel linguaggio di programmazione scelto.

Tuttavia, il codice generato potrebbe richiedere un input umano minimo, poiché in alcuni casi ChatGPT potrebbe non riuscire a fornire un codice convertito completamente funzionante.

Ad esempio, abbiamo convertito il seguente codice Python nel suo equivalente C utilizzando l'estensione VS Code ChatGPT:

È possibile ottenere ciò facendo clic con il pulsante destro del mouse sul codice evidenziato e selezionando il file Chiedi a GPT opzione.

Ecco il nostro prompt in VS Code:

Sebbene abbia generato l'equivalente C due volte prima di farlo bene, il codice finale funziona.

4. Genera un componente frontend per la tua API

Se hai scritto un'API con endpoint diversi, puoi chiedere all'estensione ChatGPT di fornire un componente frontend per consumarla utilizzando un particolare framework. Questo potrebbe essere React, Vue o Angular.

Ad esempio, abbiamo utilizzato l'estensione per generare un componente React per la creazione di un programma di riunioni basato su un endpoint API creato utilizzando FastAPI di Python:

Come fatto sopra, potresti voler controllare il file Chiedi a Codebase box se hai a che fare con una grande base di codice.

Dopo aver fatto riferimento alla nostra base di codice, l'estensione VS Code ChatGPT ha fornito un pratico componente React per utilizzare l'endpoint fornito:

5. Spiega i blocchi di codice

Supponi di aver preso un pezzo di codice da Stack Overflow o da un repository GitHub. Puoi chiedere all'estensione ChatGPT in VS Code di spiegare come funziona per una migliore comprensione. Questo ti aiuta a eseguire facilmente il debug di tale codice se sorgono bug a causa di future modifiche al codice.

In questo esempio di caso d'uso, abbiamo chiesto all'estensione ChatGPT di spiegare il seguente codice; una classe Python per verificare gli indirizzi email degli utenti.

Ha generato la seguente risposta:

6. Genera modelli HTML per la tua applicazione

Utilizzando l'estensione ChatGPT in VS Code, puoi creare un modello HTML (come i campi di input) da zero, utilizzando direttamente la casella di chat dell'estensione. Ad esempio, puoi dirgli di creare un modello HTML per la registrazione dell'utente.

Ma cosa succede se stai scrivendo un'applicazione che esegue il rendering dei dati direttamente in HTML (non SPA) e desideri un modello specifico per il progetto? Puoi utilizzare l'estensione ChatGPT in VS Code per creare modelli HTML che mostrano i dati di back-end agli utenti.

Ad esempio, se stai utilizzando un file Framework basato sull'architettura MVT come Django, puoi utilizzare l'estensione per creare modelli HTML per le tue viste Django.

Ancora una volta, per questo tipo di caso d'uso, potresti voler fare clic su Chiedi a Codebase casella di controllo per ChatGPT per accedere alla base di codice.

7. Test unitario del codice

Per quanto essenziale sia il test unitario, può essere un consumatore di tempo. Puoi sfruttare l'estensione VS Code ChatGPT per generare unit test per il tuo codice e risparmiare tempo prezioso per lo sviluppo.

Sebbene l'estensione ChatGPT disponga di un prompt integrato per la generazione di unit test, potresti voler scrivere un prompt personalizzato utilizzando il file Chiedi a Codebase possibilità di specificità e un risultato migliore.

Abbiamo chiesto a ChatGPT di scrivere uno unit test per un endpoint di registrazione creato utilizzando la FastAPI di Python:

Ha campionato la base di codice in modo efficiente per generare il test unitario richiesto:

8. Trova potenziali vulnerabilità di sicurezza

Anche se potrebbe non fornire un'analisi dettagliata della sicurezza, l'estensione VS Code ChatGPT può essere uno strumento utile per rapidamente verifica la presenza di vulnerabilità di sicurezza nella tua applicazione base di codice e risparmiare tempo scansionando manualmente.

Per consentire a ChatGPT di scansionare la tua base di codice, usa il file Chiedi a Codebase opzione (fare clic sull'icona dell'estensione e controllare il file Chiedi a Codebase scatola).

Se di solito giochi d'azzardo per aggirare un vecchio o nuove funzionalità VS Code, sentiti libero di chiedere informazioni sull'IDE dall'estensione ChatGPT.

Ad esempio, puoi chiedere all'estensione di consigliare le migliori estensioni per il debug di un particolare linguaggio di programmazione.

Oppure puoi porre una domanda più tecnica, ad esempio come aprire VS Code dalla riga di comando.

10. Scrivi la documentazione direttamente da VS Code

Puoi scrivere una documentazione dettagliata per un pezzo di codice direttamente da VS Code con facilità utilizzando l'estensione ChatGPT.

Ad esempio, ecco una documentazione dettagliata di una funzione di creazione di collegamenti Zoom (in formato HTML) che abbiamo generato utilizzando l'estensione VS Code ChatGPT:

Codice in modo efficiente con ChatGPT in VS Code

In qualità di programmatore in un Internet dal ritmo rapido, desideri ottenere un prodotto minimo praticabile nel minor tempo possibile. Sebbene ChatGPT non sia del tutto affidabile, potrebbe aiutare il tuo viaggio di sviluppo se usato in modo creativo. E ci sono molti altri casi d'uso di ChatGPT nella programmazione. Tuttavia, con tutto ciò che è stato detto, assicurati di convalidare i risultati di ChatGPT, poiché a volte possono essere fuorvianti.