Przenieś swoją produktywność kodowania na wyższy poziom, integrując ChatGPT z VS Code.
Możesz być szefem swoich zadań i zwiększyć swoją produktywność, gdy nauczysz się wykorzystywać narzędzia sztucznej inteligencji, które codziennie pojawiają się w laboratoriach badawczych. VS Code zawiera rozszerzenie ChatGPT, które zapewnia środowisko kodowania obsługujące OpenAI.
Możesz wykorzystać rozległy model kodowania ChatGPT, aby skuteczniej i szybciej realizować swoje projekty — bezpośrednio w środowisku IDE. Oto przydatne sposoby korzystania z ChatGPT z kodem VS.
Jak zainstalować i używać rozszerzenia ChatGPT w VS Code
Podczas wyszukiwania „ChatGPT” lub „Code GPT” na rynku rozszerzeń VS Code pojawia się wiele powiązanych rozszerzeń. W przeciwieństwie do GitHub Copilot, nie pochodzą one oficjalnie bezpośrednio z OpenAI.
Jednak większość próbkowanych rozszerzeń VS Code ChatGPT działa w ten sam sposób. Ale będziemy się trzymać Rozszerzenie ChatGPT EasyCode w tym artykule, ponieważ jest całkiem przyzwoity do demonstrowania przypadków użycia ChatGPT w kodzie VS. Obsługuje GPT-4 i GPT-3.5, ma bezpłatny poziom i nie wymaga klucza API.
Aby zainstalować rozszerzenie ChatGPT w VS Code:
- Otwórz VS Code i kliknij ikonę ustawień w lewym dolnym rogu lewego paska bocznego.
- Iść do Rozszerzenia.
- Alternatywnie naciśnij Ctrl + Shift + X (Command + Shift + X dla komputerów Mac), aby bezpośrednio otworzyć rynek rozszerzeń.
- Wpisz „ChatGPT - EasyCode” w pasku wyszukiwania w lewym górnym rogu.
- Kliknij rozszerzenie, gdy je zobaczysz.
- Na koniec kliknij zainstalować.
- Po zainstalowaniu zobaczysz ikonę rozszerzenia na lewym pasku bocznym.
- Kliknij ikonę rozszerzenia. Kliknij Wypróbuj bez konta. Ale nie krępuj się Zalogować się jeśli masz konto lub Zapisać się dla nowego konta u dostawcy rozszerzenia.
Jak korzystać z rozszerzenia ChatGPT
- Aby użyć wbudowanego monitu, zaznacz kod docelowy i kliknij go prawym przyciskiem myszy. Wybierz dowolny z dostępnych monitów.
- Aby napisać niestandardowy monit, kliknij prawym przyciskiem myszy podświetlony kod i wybierz Zapytaj GPT. Wpisz monit w polu czatu u góry i naciśnij Wchodzić.
Jak korzystać z rozszerzenia ChatGPT z bazą kodu
Jeśli otworzyłeś kod VS w katalogu bazowym kodu i chcesz, aby ChatGPT miał dostęp do podstawowych modułów:
- Kliknij ikonę rozszerzenia na lewym pasku bocznym. Następnie sprawdź Zapytaj Codebase skrzynka.
- Skopiuj kod docelowy i wklej go w oknie czatu.
- Wpisz monit pod kodem (naciśnij Shift + Enter) w oknie czatu.
- Naciskać Wchodzić lub kliknij ikonę wysyłania.
Zobaczmy teraz różne sposoby korzystania z ChatGPT w VS Code.
1. Refaktoryzuj i modyfikuj kod
ChatGPT okazał się pomocny w modyfikowaniu kodu proceduralnego, funkcjonalnego i obiektowego.
Na przykład, korzystając z tego rozszerzenia, poprosiliśmy ChatGPT o refaktoryzację poniższego błędnego kodu, funkcji Pythona do utworzenia dowolnego słownika i dodania „Kup” do każdej wartości.
pokmakeDict(n: str, **kwargi)->dyktuj:
niektóre: dykt
Do kluczowa wartość W kwargs.przedmioty():
niektóre = n+" "+ wartość
powrót Niektóre
nowyDict = makeDict("Kupić", element1=„Książka GPT”, przedmiot2=„Poradnik Javy”, element3=„Przewodnik turystyczny”)
Udało się całkiem dobrze, tworząc poprawny kod, który daje oczekiwane dane wyjściowe, ze szczegółowymi powodami modyfikacji:
Ponadto możesz użyć Poproś o kontynuację box, aby powiedzieć ChtGPT, aby przekonwertował kod na klasę i pokazał, jak go utworzyć:
Wygenerowany powyżej kod jest bardziej modułowy i wielokrotnego użytku.
2. Debuguj swój kod
Jeśli Twój kod zgłasza błąd lub nie działa tak, jak powinien, poproszenie ChatGPT o debugowanie go bezpośrednio w VS Code oszczędza czas.
Chociaż nie ma wbudowanego monitu o debugowanie, można użyć metody Zapytaj GPT możliwość utworzenia niestandardowego monitu do debugowania kodu.
Poprosiliśmy rozszerzenie ChatGPT o debugowanie kodu, którego użyliśmy wcześniej. Nie tylko debugował. Wyjaśnił to i wygenerował poprawny, w tym oczekiwany wynik.
3. Napisz swój kod w innym języku
Możesz chcieć napisać program w określonym języku oprócz twojego rdzenia. Możesz napisać swój kod w swoim podstawowym języku i poprosić ChatGPT o przepisanie go w wybranym języku programowania.
Jednak wygenerowany kod może wymagać niewielkiego udziału człowieka, ponieważ w niektórych przypadkach ChatGPT może nie dostarczyć w pełni działającego przekonwertowanego kodu.
Na przykład przekonwertowaliśmy następujący kod Pythona na jego odpowiednik w C, używając rozszerzenia VS Code ChatGPT:
Możesz to osiągnąć, klikając prawym przyciskiem myszy podświetlony kod i wybierając Zapytaj GPT opcja.
Oto nasz monit w VS Code:
Chociaż dwukrotnie wygenerował odpowiednik C, zanim zrobił to dobrze, końcowy kod działa.
4. Wygeneruj komponent Frontend dla swojego API
Jeśli napisałeś interfejs API z różnymi punktami końcowymi, możesz poprosić rozszerzenie ChatGPT o dostarczenie komponentu frontendowego, który będzie go wykorzystywał przy użyciu określonej struktury. Może to być React, Vue lub Angular.
Na przykład użyliśmy tego rozszerzenia do wygenerowania komponentu React do tworzenia harmonogramu spotkań na podstawie punktu końcowego API utworzonego za pomocą FastAPI Pythona:
Jak zrobiono powyżej, możesz chcieć sprawdzić Zapytaj Codebase box, jeśli masz do czynienia z dużą bazą kodu.
Po odwołaniu się do naszej bazy kodu, rozszerzenie VS Code ChatGPT dostarczyło przydatny komponent React do korzystania z dostarczonego punktu końcowego:
5. Wyjaśnij bloki kodu
Załóżmy, że pobrałeś fragment kodu ze Stack Overflow lub repozytorium GitHub. Możesz poprosić rozszerzenie ChatGPT w VS Code o wyjaśnienie, jak to działa w celu lepszego zrozumienia. Pomaga to łatwo debugować taki kod, jeśli pojawią się błędy z powodu przyszłych zmian w kodzie.
W tym przykładowym przypadku użycia poprosiliśmy rozszerzenie ChatGPT o wyjaśnienie następującego kodu; klasa Pythona do weryfikacji adresów e-mail użytkowników.
Wygenerował następującą odpowiedź:
6. Wygeneruj szablony HTML dla swojej aplikacji
Korzystając z rozszerzenia ChatGPT w programie VS Code, możesz utworzyć szablon HTML (taki jak pola wprowadzania) od podstaw — korzystając bezpośrednio z okna czatu rozszerzenia. Na przykład możesz powiedzieć mu, aby utworzył szablon HTML do rejestracji użytkownika.
Ale co, jeśli piszesz aplikację, która renderuje dane bezpośrednio do HTML (nie-SPA) i potrzebujesz szablonu specyficznego dla projektu? Możesz użyć rozszerzenia ChatGPT w programie VS Code do tworzenia szablonów HTML, które wyświetlają użytkownikom dane zaplecza.
Na przykład, jeśli używasz pliku Framework oparty na architekturze MVT, taki jak Django, możesz użyć tego rozszerzenia do tworzenia szablonów HTML dla swoich widoków Django.
Ponownie, dla tego typu przypadku użycia, możesz chcieć kliknąć Zapytaj Codebase pole wyboru dla ChatGPT, aby uzyskać dostęp do bazy kodów.
7. Przetestuj swój kod w jednostkach
Choć testy jednostkowe są niezbędne, mogą pochłaniać czas. Możesz wykorzystać rozszerzenie VS Code ChatGPT, aby wygenerować testy jednostkowe dla swojego kodu i zaoszczędzić cenny czas programowania.
Chociaż rozszerzenie ChatGPT ma wbudowany monit do generowania testów jednostkowych, możesz chcieć napisać niestandardowy monit przy użyciu Zapytaj Codebase opcja dla specyficzności i lepszego wyniku.
Poprosiliśmy ChatGPT o napisanie testu jednostkowego dla punktu końcowego rejestracji utworzonego przy użyciu FastAPI Pythona:
Wydajnie próbkował bazę kodu, aby wygenerować wymagany test jednostkowy:
8. Znajdź potencjalne luki w zabezpieczeniach
Chociaż może nie zapewniać szczegółowej analizy bezpieczeństwa, rozszerzenie VS Code ChatGPT może być przydatnym narzędziem do szybkiego sprawdź luki w zabezpieczeniach w swojej aplikacji bazę kodów i zaoszczędzić czas na ręcznym skanowaniu.
Aby umożliwić ChatGPT skanowanie bazy kodów, użyj Zapytaj Codebase opcję (kliknij ikonę rozszerzenia i zaznacz Zapytaj Codebase skrzynka).
Jeśli zwykle grasz w jakieś stare lub nowe funkcje VS Code, nie krępuj się zapytać o sposób poruszania się po IDE z rozszerzenia ChatGPT.
Na przykład możesz poprosić rozszerzenie o zalecenie najlepszych rozszerzeń do debugowania określonego języka programowania.
Lub możesz zadać mu bardziej techniczne pytanie, na przykład jak otworzyć kod VS z wiersza poleceń.
10. Napisz dokumentację bezpośrednio z VS Code
Możesz z łatwością napisać szczegółową dokumentację fragmentu kodu bezpośrednio z VS Code, korzystając z rozszerzenia ChatGPT.
Oto na przykład szczegółowa dokumentacja funkcji tworzenia linków Zoom (w formacie HTML), którą wygenerowaliśmy przy użyciu rozszerzenia VS Code ChatGPT:
Koduj wydajnie z ChatGPT w VS Code
Jako programista w szybko rozwijającym się Internecie chcesz osiągnąć minimalny opłacalny produkt w jak najkrótszym czasie. Chociaż ChatGPT nie jest całkowicie niezawodny, może pomóc w Twojej podróży programistycznej, jeśli zostanie użyty kreatywnie. A przypadków użycia ChatGPT w programowaniu jest znacznie więcej. Jednak biorąc to wszystko pod uwagę, upewnij się, że sprawdzasz poprawność wyników ChatGPT, ponieważ czasami mogą one wprowadzać w błąd.
