Przez ostatnie dwa lata mój zespół w Work & Co i ja testowaliśmy i stopniowo integrowaliśmy narzędzia do kodowania AI, takie jak Copilot, Cursor, Claude i ChatGPT, aby pomóc nam dostarczać treści internetowe używane przez masy. Trzeba przyznać, że po początkowym sceptycyzmie i kilku chwilach zachwytu, różne narzędzia AI trafiły do mojego codziennego użytku. Z biegiem czasu lista aplikacji, w których uznaliśmy, że warto pozwolić AI przejąć kontrolę, zaczęła się powiększać, dlatego zdecydowałem się podzielić praktycznymi przykładami użycia narzędzi AI z tak zwanymi „odpowiedzialnym programistą”. Co mam na myśli mówiąc odpowiedzialny programista? Musimy mieć pewność, że dostarczamy kod wysokiej jakości zgodny z oczekiwaniami naszych interesariuszy i klientów. Nasz wkład (tj. prośby o ściągnięcie) nie powinien stać się ciężarem dla naszych współpracowników, którzy będą musieli przeglądać i testować naszą pracę. Ponadto, jeśli pracujesz dla firmy: Narzędzia, których używamy, muszą zostać zatwierdzone przez naszego pracodawcę. Należy odpowiednio postępować z wrażliwymi aspektami, takimi jak bezpieczeństwo i prywatność: nie wklejaj tajemnic, danych klientów (PII) ani zastrzeżonego kodu do narzędzi bez zgody polityki. Traktuj go jak kod od nieznajomego w Internecie. Zawsze testuj i sprawdzaj. Uwaga: w tym artykule założono bardzo podstawową znajomość narzędzi do kodowania AI, takich jak Copilot w VSCode lub Cursor. Jeśli to wszystko wydaje Ci się zupełnie nowe i nieznane, samouczki wideo Github Copilot mogą być dla Ciebie fantastycznym punktem wyjścia.
Pomocne zastosowania narzędzi do kodowania AI Uwaga: Poniższe przykłady skupiają się głównie na pracy w aplikacjach internetowych opartych na JavaScript, takich jak React, Vue, Svelte lub Angular. Zrozumienie nieznanej bazy kodu Nierzadko zdarza się pracować na ustalonych bazach kodu, a dołączenie do dużej, starszej bazy kodu może być onieśmielające. Po prostu otwórz swój projekt i swojego agenta AI (w moim przypadku Copilot Chat w VSCode) i zacznij zadawać pytania tak samo, jak zadawałbyś koledze. Ogólnie rzecz biorąc, lubię rozmawiać z dowolnym agentem AI tak samo, jak z innym człowiekiem. Oto bardziej wyrafinowany przykładowy monit: "Przedstaw mi ogólny przegląd architektury: punkty wejścia, routing, uwierzytelnianie, warstwa danych, narzędzia do kompilacji. Następnie wypisz 5 plików do przeczytania w kolejności. Potraktuj wyjaśnienia jako hipotezy i potwierdź, przechodząc do plików, do których istnieją odniesienia. "
Możesz zadawać dodatkowe pytania, takie jak „Jak szczegółowo działa wyznaczanie tras?” lub „Omów mnie przez proces i metody uwierzytelniania”, a poprowadzi Cię do przydatnych wskazówek, jak rzucić trochę światła na ciemność nieznanej bazy kodu. Segregowanie istotnych zmian podczas uaktualniania zależności Aktualizowanie pakietów npm, szczególnie jeśli zawierają istotne zmiany, może być żmudną i czasochłonną pracą oraz wymagać debugowania sporej liczby regresji. Niedawno musiałem zaktualizować bibliotekę wizualizacji danych plotly.js do jednej głównej wersji z wersji 2 do 3, w wyniku czego etykietowanie osi na niektórych wykresach przestało działać. Następnie zapytałem ChatGPT: "Zaktualizowałem mój projekt Angular, który korzysta z Plotly. Zaktualizowałem plotly.js — pakiet dist z wersji 2.35.2 do 3.1.0 — i teraz zniknęły etykiety na osiach x i y. Co się stało?”
Agent szybko wrócił z rozwiązaniem (przekonaj się poniżej). Uwaga: przed wysłaniem poprawki sprawdziłem wyjaśnienie w oficjalnym przewodniku migracji.
Bezpieczna replikacja refaktorów w plikach Rosnące bazy kodów z pewnością otwierają możliwości konsolidacji kodu. Na przykład zauważasz duplikację kodu w plikach, które można wyodrębnić do pojedynczej funkcji lub komponentu. W rezultacie decydujesz się na utworzenie współdzielonego komponentu, który można zamiast tego dołączyć, i wykonanie refaktoryzacji w jednym pliku. Teraz zamiast ręcznie wprowadzać zmiany w pozostałych plikach, poproś agenta o wdrożenie refaktora za Ciebie. Agenci umożliwiają wybranie wielu plików jako kontekstu. Po zakończeniu refaktoryzacji jednego pliku mogę dodać do kontekstu zarówno poddane refaktoryzacji, jak i nietknięte pliki i poprosić agenta o wprowadzenie zmian w innych plikach w następujący sposób: „Powtórz zmiany, które wprowadziłem w pliku A, również do pliku B”. Wdrażanie funkcji w nieznanych technologiach Jednym z moich ulubionych momentów, w których korzystałem z narzędzi do kodowania AI, był moment, w którym pomogło mi to stworzyć dość złożoną animowaną animację gradientową w GLSL, języku, którego nie znałem. W ramach najnowszego projektu nasi projektanci opracowali animowany gradient jako stan ładowania obiektu 3D. Bardzo spodobała mi się ta koncepcja i chciałem dostarczyć naszym klientom coś wyjątkowego i ekscytującego. Theproblem: miałem tylko dwa dni na wdrożenie tego rozwiązania, a GLSL ma dość stromą drogę uczenia się. Ponownie przydało się narzędzie AI (w tym przypadku ChatGPT) i zacząłem po prostu prosić go o utworzenie samodzielnego pliku HTML, który renderuje płótno i bardzo prosty animowany gradient kolorów. Krok po kroku namawiałem sztuczną inteligencję, aby dodała do niego więcej finezji, aż uzyskałem przyzwoity wynik, dzięki czemu mogłem zacząć integrować moduł cieniujący z moją rzeczywistą bazą kodu. Efekt końcowy: nasi klienci byli bardzo zadowoleni, a dzięki sztucznej inteligencji dostarczyliśmy złożoną funkcję w krótkim czasie. Pisanie testów Z mojego doświadczenia wynika, że w projektach rzadko jest wystarczająco dużo czasu na ciągłe pisanie i utrzymywanie odpowiedniego zestawu testów jednostkowych i integracyjnych, a na dodatek wielu programistów nie lubi pisania testów. Poproszenie pomocnika AI o skonfigurowanie i napisanie testów jest całkowicie możliwe i można to zrobić w krótkim czasie. Oczywiście jako programista nadal powinieneś upewnić się, że Twoje testy rzeczywiście uwzględniają krytyczne części aplikacji i przestrzegają rozsądnych zasad testowania, ale możesz „zlecić” pisanie testów naszemu pomocnikowi AI. Przykładowy monit: "Napisz testy jednostkowe dla tej funkcji za pomocą Jest. Omów szczęśliwe ścieżki, przypadki brzegowe i tryby awarii. Wyjaśnij, dlaczego każdy test istnieje. "
Możesz nawet przekazać swojemu agentowi najlepsze praktyki testowania Kenta C. Doddsa jako wytyczne, jak poniżej:
Oprzyrządowanie wewnętrzne Nieco podobnie do wspomnianego wcześniej przykładu modułu cieniującego, ostatnio otrzymałem zadanie przeanalizowania duplikacji kodu w bazie kodu i porównania przed i po refaktorze. Z pewnością nie jest to trywialne zadanie, jeśli nie chcesz korzystać z czasochłonnej metody ręcznego porównywania plików. Za pomocą Copilota stworzyłem skrypt, który analizował dla mnie duplikację kodu, układał i porządkował wyniki w tabeli oraz eksportował je do Excela. Potem poszedłem o krok dalej. Po zakończeniu refaktoryzacji kodu poprosiłem agenta, aby wziął mój istniejący arkusz Excela jako punkt odniesienia, dodał bieżący stan duplikacji w oddzielnych kolumnach i obliczył deltę. Aktualizowanie kodu napisanego dawno temu Niedawno zadzwonił do mnie mój stary klient, ponieważ z biegiem czasu kilka funkcji na jego stronie przestało działać poprawnie. Haczyk: witryna została zbudowana prawie dziesięć lat temu, a JavaScript i SCSS korzystały z dość starych narzędzi do kompilacji, takich jak requireJS, a konfiguracja wymagała starszej wersji Node.js, która nie działałaby nawet na moim MacBooku z 2025 roku. Ręczna aktualizacja całego procesu kompilacji zajęłaby mi kilka dni, więc zdecydowałem się zapytać agenta AI: „Czy możesz zaktualizować proces kompilacji JS i SCSS do chudego stosu 2025, takiego jak Vite?” Z pewnością tak się stało i po około godzinie dopracowywania z agentem przełączyłem kompilację SCSS i JS na Vite i mogłem skupić się na faktycznym naprawianiu błędów. Po prostu upewnij się, że poprawnie sprawdziłeś dane wyjściowe i skompilowane pliki, gdy wprowadzasz takie integralne zmiany w procesie kompilacji. Podsumowanie i redakcja Czy chciałbyś podsumować wszystkie ostatnie zmiany w kodzie w jednym zdaniu komunikatu zatwierdzenia lub masz długą listę zatwierdzeń i chciałbyś je podsumować w trzech punktach? Nie ma problemu, pozwól AI się tym zająć, ale pamiętaj o sprawdzeniu tego. Przykładowy monit jest tak prosty, jak wysłanie wiadomości do drugiego człowieka: „Proszę podsumować moje ostatnie zmiany w zwięzłych punktach”. Moja rada jest taka, aby używać GPT do pisania z ostrożnością i podobnie jak w przypadku kodu, sprawdź dane wyjściowe przed wysłaniem lub przesłaniem. Zalecenia i najlepsze praktyki Podpowiadanie Jedną z nieoczywistych korzyści stosowania sztucznej inteligencji jest to, że im bardziej szczegółowe i dostosowane są Twoje podpowiedzi, tym lepszy efekt. Proces monitowania agenta AI zmusza nas do jak najbardziej szczegółowego sformułowania naszych wymagań, zanim zaczniemy pisać i kodować. Dlatego też, co do zasady, zdecydowanie zalecam, aby Twoje podpowiedzi były jak najbardziej szczegółowe. Ryan Florence, współautor książki Remix, sugeruje prosty, ale skuteczny sposób usprawnienia tego procesu, kończąc pierwszą zachętę zdaniem: „Zanim zaczniemy, czy masz do mnie jakieś pytania?”
W tym momencie sztuczna inteligencja zwykle wraca z pomocnymi pytaniami, w których możesz wyjaśnić swoje konkretne zamiary, pomagając agentowi zapewnić bardziej dostosowane podejście do Twojego zadania.
Korzystaj z kontroli wersji i pracuj w przyswajalnych fragmentach Korzystanie z kontroli wersji, takiej jak git, przydaje się nie tylko podczas współpracy w zespole nad jedną bazą kodu, ale także zapewniaindywidualny współpracownik ze stabilnymi punktami, do których można wrócić w sytuacji awaryjnej. Ze względu na swój niedeterministyczny charakter sztuczna inteligencja może czasami działać nieuczciwie i wprowadzać zmiany, które po prostu nie są pomocne w osiągnięciu tego, co próbujesz osiągnąć, i ostatecznie nieodwracalnie zepsuć wszystko. Podział pracy na wiele zatwierdzeń pomoże Ci stworzyć stabilne punkty, do których będziesz mógł wrócić, jeśli sprawy potoczą się niekorzystnie. Twoi koledzy z zespołu również będą Ci wdzięczni, ponieważ łatwiej będzie im przeglądać Twój kod, gdy zostanie on podzielony na semantycznie dobrze ustrukturyzowane części. Przejrzyj dokładnie Jest to bardziej ogólna najlepsza praktyka, ale moim zdaniem staje się jeszcze ważniejsza w przypadku korzystania z narzędzi AI w pracach programistycznych: Bądź pierwszym krytycznym recenzentem swojego kodu. Poświęć trochę czasu na przejrzenie zmian linia po linii, tak jakbyś przeglądał kod innej osoby, i prześlij swoją pracę dopiero wtedy, gdy przejdzie ona przez Twoją samoocenę. "Teraz są mi prawdziwe dwie rzeczy: agenci sztucznej inteligencji są niesamowici i znacznie zwiększają produktywność. Są też maszynami do robienia ogromnych błędów, jeśli wyłączysz mózg i całkowicie odpuścisz." – Armin Ronacher w swoim poście na blogu Agent Psychosis: Are We Going Insane?
Wnioski i krytyczne przemyślenia Moim zdaniem narzędzia do kodowania AI mogą na co dzień zwiększać naszą produktywność jako programistów i uwalniać zdolności umysłowe do lepszego planowania i myślenia na wysokim poziomie. Zmuszają nas do przedstawienia pożądanego rezultatu ze szczegółami. Każda sztuczna inteligencja może czasami mieć halucynacje, co w zasadzie oznacza, że ma pewny siebie ton. Dlatego pamiętaj, aby sprawdzić i przetestować, zwłaszcza jeśli masz wątpliwości. AI to nie złoty środek i wierzę, że doskonałość i umiejętność rozwiązywania problemów jako programista nigdy nie wyjdą z mody. Dla programistów, którzy dopiero rozpoczynają swoją karierę, narzędzia te mogą być bardzo kuszące, aby wykonać za nich większość pracy. To, co może zostać tutaj pominięte, to często wyczerpująca i bolesna praca nad błędami i problemami, które są trudne do debugowania i rozwiązania, czyli „grindowania”. Nawet Lee Robinson z Cursor AI kwestionuje to w jednym ze swoich postów:
Narzędzia do kodowania AI ewoluują w szybkim tempie i nie mogę się doczekać tego, co będzie dalej. Mam nadzieję, że ten artykuł i zawarte w nim wskazówki okazały się pomocne. Nie mogę się doczekać wypróbowania niektórych z nich samodzielnie.
