На працягу апошніх двух гадоў мы з маёй камандай у Work & Co выпрабоўвалі і паступова інтэгравалі інструменты кадзіравання штучнага інтэлекту, такія як Copilot, Cursor, Claude і ChatGPT, каб дапамагчы нам пастаўляць вэб-ўражанні, якія выкарыстоўваюцца масамі. Трэба прызнаць, што пасля некаторага першапачатковага скептыцызму і некалькіх момантаў «ага» розныя інструменты штучнага інтэлекту знайшлі свой шлях да майго штодзённага выкарыстання. З цягам часу спіс прыкладанняў, у якіх мы палічылі разумным дазволіць штучнаму інтэлекту ўзяць на сябе кантроль, пачаў расці, таму я вырашыў падзяліцца некаторымі практычнымі варыянтамі выкарыстання інструментаў штучнага інтэлекту для таго, каго я называю «адказным распрацоўшчыкам». Што я маю на ўвазе пад адказным распрацоўшчыкам? Мы павінны пераканацца, што пастаўляем якасны код, які чакаюць нашы зацікаўленыя бакі і кліенты. Нашы ўклады (г.зн. запыты на выцягванне) не павінны стаць цяжарам для нашых калег, якім давядзецца праглядаць і тэставаць нашу працу. Акрамя таго, калі вы працуеце ў кампаніі: інструменты, якія мы выкарыстоўваем, павінны быць ухвалены нашым працадаўцам. Такія адчувальныя аспекты, як бяспека і канфідэнцыяльнасць, павінны разглядацца належным чынам: не ўстаўляйце сакрэты, даныя кліентаў (PII) або прапрыетарны код у інструменты без дазволу палітыкі. Ставіцеся да гэтага як да кода ад незнаёмца ў Інтэрнэце. Заўсёды правярайце і правярайце. Заўвага: у гэтым артыкуле мяркуецца некаторае элементарнае знаёмства з інструментамі кадавання AI, такімі як Copilot у VSCode або Cursor. Калі ўсё гэта здаецца вам зусім новым і незнаёмым, відэаўрокі Github Copilot могуць стаць для вас фантастычнай адпраўной кропкай.
Карысныя прымянення інструментаў кадзіравання штучнага інтэлекту Заўвага: наступныя прыклады ў асноўным сканцэнтраваны на працы ў вэб-праграмах на аснове JavaScript, такіх як React, Vue, Svelte або Angular. Атрыманне разумення незнаёмай кодавай базы Нярэдка працаваць на ўсталяваных кодавых базах, і далучэнне да вялікай старой кодавай базы можа выклікаць страх. Проста адкрыйце свой праект і агента штучнага інтэлекту (у маім выпадку, Copilot Chat у VSCode) і пачніце задаваць пытанні гэтак жа, як вы б задалі калегам. Увогуле, я люблю размаўляць з любым агентам штучнага інтэлекту гэтак жа, як з чалавекам. Вось больш дакладны прыклад падказкі: "Дайце мне агляд архітэктуры высокага ўзроўню: кропкі ўваходу, маршрутызацыя, аўтэнтыфікацыя, узровень даных, інструменты зборкі. Затым пералічыце 5 файлаў для чытання па парадку. Разглядайце тлумачэнні як гіпотэзы і пацвярджайце, перайшоўшы да файлаў, на якія спасылаюцца."
Вы можаце працягваць задаваць наступныя пытанні, такія як "Як працуе маршрутызацыя ў дэталях?" або «Раскажыце мне аб працэсе і метадах аўтэнтыфікацыі», і гэта прывядзе вас да карысных інструкцый, каб асвятліць цемру незнаёмай кодавай базы. Сартаванне крытычных змен пры абнаўленні залежнасцей Абнаўленне пакетаў npm, асабліва калі яны пастаўляюцца з рэзкімі зменамі, можа быць стомнай і працаёмкай працай і прымусіць вас адладжваць значную колькасць рэгрэсій. Нядаўна мне давялося абнавіць бібліятэку візуалізацыі даных plotly.js да адной асноўнай версіі з версіі 2 на 3, і ў выніку гэтага маркіроўка восяў на некаторых графіках перастала працаваць. Далей я спытаў у ChatGPT: "Я абнавіў свой праект Angular, які выкарыстоўвае Plotly. Я абнавіў plotly.js — пакет dist з версіі 2.35.2 да 3.1.0 — і цяпер меткі на восях X і Y зніклі. Што здарылася?"
Агент хутка вярнуўся з рашэннем (убачыце самі ніжэй). Заўвага: перад адпраўкай выпраўлення я па-ранейшаму спраўджваў тлумачэнне з афіцыйным кіраўніцтвам па міграцыі.
Бяспечнае рэплікаванне рэфактараў паміж файламі Нарошчванне кодавых баз, безумоўна, адкрывае магчымасці для кансалідацыі кода. Напрыклад, вы заўважылі дубляванне кода ў файлах, якія можна распакаваць у адну функцыю або кампанент. У выніку вы вырашылі стварыць агульны кампанент, які можна ўключыць замест гэтага, і выканаць гэты рэфактаринг у адным файле. Цяпер замест таго, каб уручную ўносіць гэтыя змены ў файлы, якія засталіся, вы просіце свайго агента разгарнуць для вас рэфактарынг. Агенты дазваляюць выбраць некалькі файлаў у якасці кантэксту. Пасля завяршэння рэфактарынгу для аднаго файла я магу дадаць у кантэкст як рэфактарынг, так і некранутыя файлы і прапанаваць агенту перанесці змены ў іншыя файлы наступным чынам: «Паўтарыць змены, якія я зрабіў у файле A, таксама ў файл B». Рэалізацыя функцый у незнаёмых тэхналогіях Адзін з маіх любімых ага-момантаў пры выкарыстанні інструментаў кадавання штучнага інтэлекту быў, калі гэта дапамагло мне стварыць даволі складаную аніміраваную градыентную анімацыю ў GLSL, мове, з якой я быў даволі незнаёмы. У нядаўнім праекце нашы дызайнеры прыдумалі аніміраваны градыент у якасці стану загрузкі 3D-аб'екта. Мне вельмі спадабалася канцэпцыя, і я хацеў даць нашым кліентам нешта ўнікальнае і захапляльнае. Theпраблема: у мяне было ўсяго два дні, каб рэалізаваць гэта, і GLSL мае даволі крутую крывую навучання. Зноў жа, інструмент штучнага інтэлекту (у дадзеным выпадку ChatGPT) стаў карысным, і я пачаў проста падказваць яму стварыць для мяне аўтаномны файл HTML, які адлюстроўвае палатно і вельмі просты аніміраваны каляровы градыент. Крок за крокам я падахвочваў штучны інтэлект дадаваць яму больш тонкасці, пакуль я не атрымаў прыстойнага выніку, каб я мог пачаць інтэграваць шэйдар у сваю рэальную кодавую базу. Канчатковы вынік: нашы кліенты былі вельмі задаволены, і мы паставілі складаную функцыю за невялікі прамежак часу дзякуючы ІІ. Напісанне кантрольных работ З майго досведу, у праектах рэдка бывае дастаткова часу, каб пастаянна пісаць і падтрымліваць належны набор модульных і інтэграцыйных тэстаў, і, акрамя таго, многім распрацоўшчыкам не вельмі падабаецца пісаць тэсты. Прапанаваць вашаму памочніку штучнага інтэлекту наладзіць і напісаць тэсты для вас цалкам магчыма і можа быць выканана за невялікі прамежак часу. Вядома, вы, як распрацоўшчык, усё роўна павінны пераканацца, што вашы тэсты сапраўды разглядаюць крытычныя часткі вашага прыкладання і прытрымліваюцца разумных прынцыпаў тэсціравання, але вы можаце перадаць напісанне тэстаў нашаму памочніку AI. Прыклад падказкі: "Напішыце модульныя тэсты для гэтай функцыі з дапамогай Jest. Ахоплівайце шчаслівы шлях, крайнія выпадкі і рэжымы збояў. Растлумачце, чаму існуе кожны тэст."
Вы нават можаце перадаць лепшыя практыкі тэсціравання гуру тэсціравання Кента С. Додда ў якасці рэкамендацый свайму агенту, як паказана ніжэй:
Унутраны інструмент Некалькі падобна да прыкладу шэйдара, згаданага раней, нядаўна мне было даручана прааналізаваць дубляванне кода ў базе кода і параўнаць да і пасля рэфактарынгу. Безумоўна, гэта не трывіяльная задача, калі вы не жадаеце пайсці на працаёмкі шлях параўнання файлаў уручную. З дапамогай Copilot я стварыў скрыпт, які аналізаваў для мяне дубліраванне кода, арганізаваў і ўпарадкаваў вывад у табліцы і экспартаваў яго ў Excel. Потым я пайшоў яшчэ далей. Калі рэфактарынг кода быў завершаны, я прапанаваў агенту ўзяць мой існуючы аркуш Excel у якасці базавага, дадаць бягучы стан дублявання ў асобных слупках і вылічыць дэльта. Абнаўленне кода, напісанага даўно Нядаўна мой стары кліент звярнуўся да мяне, бо з цягам часу некалькі функцый на яго вэб-сайце больш не працавалі належным чынам. Падвох: вэб-сайт быў створаны амаль дзесяць гадоў таму, і JavaScript і SCSS выкарыстоўвалі даволі старыя інструменты кампіляцыі, такія як requireJS, і для ўстаноўкі патрабавалася больш старая версія Node.js, якая нават не магла працаваць на маім MacBook 2025 года. Абнаўленне ўсяго працэсу зборкі ўручную заняло б у мяне некалькі дзён, таму я вырашыў падказаць агенту штучнага інтэлекту: «Ці можаце вы абнавіць працэс зборкі JS і SCSS да эканомнага стэка 2025, як Vite?» Так і атрымалася, і прыкладна праз гадзіну дапрацоўкі з агентам я пераключыў зборку SCSS і JS на Vite, і я змог засяродзіцца на фактычным выпраўленні памылак. Проста пераканайцеся, што належным чынам правяраеце выхад і скампіляваныя файлы, калі ўносіце такія інтэгральныя змены ў працэс зборкі. Падвядзенне вынікаў і складанне Ці жадаеце вы абагульніць усе вашы нядаўнія змены кода ў адным сказе для паведамлення фіксацыі, ці хочаце мець доўгі спіс фіксацый і хочаце абагульніць іх у трох пунктах? Няма праблем, дазвольце штучнаму інтэлекту паклапоціцца пра гэта, але не забудзьцеся вычытаць яго. Прыклад падказкі такі ж просты, як паведамленне аднаму чалавеку: "Калі ласка, падсумуйце мае апошнія змены ў кароткіх пунктах". Мая парада тут - выкарыстоўваць GPT для напісання з асцярожнасцю, і, як і ў выпадку з кодам, калі ласка, правярайце вывад перад адпраўкай або адпраўкай. Рэкамендацыі і лепшыя практыкі Падказка Адной з не вельмі відавочных пераваг выкарыстання штучнага інтэлекту з'яўляецца тое, што чым больш канкрэтныя і адаптаваныя вашы падказкі, тым лепш вынік. Працэс падказкі агента штучнага інтэлекту прымушае нас сфармуляваць нашы патрабаванні як мага больш канкрэтна, перш чым пісаць і кадзіраваць. Вось чаму, як правіла, я настойліва раю быць як мага больш канкрэтным з падказкамі. Раян Флорэнс, сааўтар Remix, прапануе просты, але магутны спосаб палепшыць гэты працэс, завяршыўшы першапачатковае падказку сказам: «Перш чым мы пачнем, у вас ёсць да мяне якія-небудзь пытанні?»
У гэты момант штучны інтэлект звычайна вяртаецца з карыснымі пытаннямі, дзе вы можаце растлумачыць свае канкрэтныя намеры, накіроўваючы агента даць вам больш індывідуальны падыход да вашай задачы.
Выкарыстоўвайце кантроль версій і працуйце ў засваяльных кавалках Выкарыстанне кантролю версій, напрыклад git, не толькі карысна пры супрацоўніцтве ў камандзе над адной кодавай базай, але і для таго, каб даць вам магчымасцьіндывідуальны ўдзельнік са стабільнымі кропкамі, да якіх можна вярнуцца ў выпадку надзвычайнай сітуацыі. З-за сваёй недэтэрмінаванай прыроды штучны інтэлект часам можа ашукаць і ўносіць змены, якія проста не прыносяць карысці для таго, чаго вы спрабуеце дасягнуць, і ў канчатковым выніку непапраўна ламаць рэчы. Раздзяленне вашай працы на некалькі абавязацельстваў дапаможа вам стварыць стабільныя кропкі, да якіх вы зможаце вярнуцца, калі нешта пойдзе ўбок. І вашы таварышы па камандзе таксама будуць вам удзячныя, бо ім будзе лягчэй праглядаць ваш код, калі ён падзелены на семантычна добра структураваныя кавалкі. Агляд старанна Гэта больш агульная лепшая практыка, але, на мой погляд, яна становіцца яшчэ больш важнай пры выкарыстанні інструментаў штучнага інтэлекту для распрацоўкі: будзьце першым крытычным аглядальнікам вашага кода. Не забудзьцеся заняць некаторы час, каб праглядзець вашыя змены радок за радком, гэтак жа, як вы праглядалі б чужы код, і адпраўляйце сваю працу толькі пасля таго, як яна пройдзе вашу ўласную самаправерку. "Дзве рэчы цяпер для мяне верныя: агенты штучнага інтэлекту надзвычайныя і значна павышаюць прадукцыйнасць. Яны таксама вялізныя памыйныя машыны, калі вы адключыце свой мозг і цалкам адпусціце яго", — Армін Ронахер у сваім паведамленні ў блогу Agent Psychosis: Are We Going Insane?
Заключэнне і крытычныя думкі На мой погляд, інструменты для кадавання штучнага інтэлекту могуць штодзённа павысіць нашу прадукцыйнасць як распрацоўшчыкаў і вызваліць разумовыя здольнасці для большага планавання і мыслення на высокім узроўні. Яны прымушаюць нас сфармуляваць жаданы вынік з дбайнымі дэталямі. Любы ІІ можа часам галюцынаваць, што ў асноўным азначае, што ён хлусіць упэўненым тонам. Таму, калі ласка, абавязкова праверце і пратэстуйце, асабліва калі вы сумняваецеся. ІІ - гэта не срэбная куля, і я веру, што дасканаласць і здольнасць распрацоўшчыка вырашаць праблемы ніколі не выйдуць з моды. Для распрацоўшчыкаў, якія толькі пачынаюць сваю кар'еру, гэтыя інструменты могуць выклікаць вялікую спакусу зрабіць большую частку працы за іх. Што тут можа быць згублена, дык гэта часта знясільваючая і пакутлівая праца над памылкамі і праблемамі, якія складана адладжваць і вырашаць, яна ж «памол». Нават Лі Робінсан з Cursor AI сумняваецца ў гэтым у адным са сваіх паведамленняў:
Інструменты кадавання штучнага інтэлекту развіваюцца хуткімі тэмпамі, і я вельмі рады таму, што будзе далей. Я спадзяюся, што гэты артыкул і парады ў ім былі для вас карыснымі, і вы рады паспрабаваць некаторыя з іх на сабе.
