През последните две години моят екип в Work & Co и аз тествахме и постепенно интегрирахме инструменти за кодиране с изкуствен интелект като Copilot, Cursor, Claude и ChatGPT, за да ни помогне да доставяме уеб преживявания, които се използват от масите. Признавам си, след известен първоначален скептицизъм и няколко аха момента, различни AI инструменти намериха своя път в ежедневната ми употреба. С течение на времето списъкът с приложения, в които сметнахме, че има смисъл да оставим AI да поеме контрола, започна да расте, така че реших да споделя някои практически случаи на използване на AI инструменти за това, което наричам „отговорен разработчик“. Какво имам предвид под отговорен разработчик? Трябва да сме сигурни, че предоставяме качествен код, както се очаква от нашите заинтересовани страни и клиенти. Нашите приноси (т.е. заявки за изтегляне) не трябва да се превръщат в тежест за нашите колеги, които ще трябва да преглеждат и тестват нашата работа. Освен това, в случай че работите за компания: Инструментите, които използваме, трябва да бъдат одобрени от нашия работодател. Чувствителни аспекти като сигурност и поверителност трябва да се третират правилно: Не поставяйте тайни, клиентски данни (PII) или патентован код в инструменти без одобрение от правилата. Третирайте го като код от непознат в интернет. Винаги тествайте и проверявайте. Забележка: Тази статия предполага някои много основни познания с инструменти за кодиране на AI като Copilot във VSCode или Cursor. Ако всичко това ви звучи съвсем ново и непознато, видеоуроците за Github Copilot могат да бъдат фантастична отправна точка за вас.
Полезни приложения на инструменти за кодиране с изкуствен интелект Забележка: Следващите примери ще се съсредоточат основно върху работата в базирани на JavaScript уеб приложения като React, Vue, Svelte или Angular. Получаване на разбиране за непозната кодова база Не е необичайно да работите върху установени кодови бази и присъединяването към голяма наследена кодова база може да бъде смущаващо. Просто отворете вашия проект и вашия AI агент (в моя случай, 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“. Внедряване на функции в непознати технологии Един от любимите ми аха-моменти с помощта на инструменти за кодиране на AI беше, когато ми помогна да създам доста сложна анимирана градиентна анимация в GLSL, език, с който бях доста непознат. В скорошен проект нашите дизайнери излязоха с анимиран градиент като състояние на зареждане на 3D обект. Наистина ми хареса концепцията и исках да доставя нещо уникално и вълнуващо на нашите клиенти. Theпроблем: Имах само два дни, за да го внедря, а GLSL има доста стръмна крива на обучение. Отново, AI инструмент (в този случай, ChatGPT) беше полезен и аз започнах съвсем просто да го подканвам да създаде самостоятелен HTML файл за мен, който изобразява платно и много прост анимиран цветен градиент. Стъпка след стъпка подканих AI да добави повече финес към него, докато стигна до приличен резултат, за да мога да започна да интегрирам шейдъра в действителната си кодова база. Крайният резултат: Нашите клиенти бяха супер доволни и ние предоставихме сложна функция за кратко време благодарение на AI. Писане на тестове Според моя опит рядко има достатъчно време за проекти за постоянно писане и поддържане на подходящ набор от модулни и интеграционни тестове, а освен това много разработчици не се наслаждават наистина на задачата да пишат тестове. Подканянето на вашия AI помощник да настрои и напише тестове за вас е напълно възможно и може да бъде направено за малко време. Разбира се, вие, като разработчик, все пак трябва да се уверите, че вашите тестове действително разглеждат критичните части на вашето приложение и следват разумни принципи за тестване, но можете да „изнесете“ писането на тестовете на нашия AI помощник. Примерна подкана: "Напишете модулни тестове за тази функция с помощта на Jest. Покрийте щастливия път, крайните случаи и режимите на неуспех. Обяснете защо съществува всеки тест."
Можете дори да предадете най-добрите практики за тестване на гуруто на тестването Kent C. Dodds като насоки на вашия агент, както по-долу:
Вътрешни инструменти Подобно донякъде на примера за шейдър, споменат по-рано, наскоро ми беше възложено да анализирам дублиране на код в кодова база и да сравня преди и след рефактор. Със сигурност не е тривиална задача, ако не искате да отидете по отнемащия време път на ръчно сравняване на файлове. С помощта на Copilot създадох скрипт, който анализира дублирането на код вместо мен, подреди и подреди изхода в таблица и го експортира в Excel. След това направих крачка напред. Когато нашият рефакторинг на код беше завършен, подканих агента да вземе моя съществуващ Excel лист като базова линия, да добави текущото състояние на дублиране в отделни колони и да изчисли делта. Актуализиране на код, написан преди много време Наскоро един мой стар клиент ме удари, тъй като с течение на времето няколко функции вече не работеха правилно на уебсайта му. Уловката: уебсайтът беше създаден преди почти десет години и JavaScript и SCSS използваха доста стари инструменти за компилиране като requireJS, а настройката изискваше по-стара версия на Node.js, която дори не можеше да работи на моя MacBook от 2025 г. Ръчното актуализиране на целия процес на компилация щеше да ми отнеме дни, затова реших да попитам агента с изкуствен интелект: „Можете ли да актуализирате процеса на компилиране на JS и SCSS до слаб стек 2025 като Vite?“ Със сигурност го направи и след около час усъвършенстване с агента превключих моята SCSS и JS компилация към Vite и успях да се съсредоточа върху действителното отстраняване на грешки. Просто се уверете, че правилно валидирате изхода и компилираните файлове, когато правите такива интегрални промени в процеса на изграждане. Обобщаване и изготвяне Бихте ли искали да обобщите всичките си скорошни промени в кода в едно изречение за съобщение за ангажимент или имате дълъг списък от ангажименти и бихте искали да ги обобщите в три точки? Няма проблем, оставете AI да се погрижи за него, но моля, не забравяйте да го коригирате. Примерна подкана е толкова проста, колкото да изпратите съобщение до друг човек: „Моля, обобщете последните ми промени в кратки точки“. Моят съвет тук е да използвате GPT за писане с повишено внимание и както при кода, моля, проверете изхода, преди да изпратите или изпратите. Препоръки и най-добри практики Подсказване Едно от не толкова очевидните предимства на използването на AI е, че колкото по-конкретни и персонализирани са вашите подкани, толкова по-добър е резултатът. Процесът на подканване на AI агент ни принуждава да формулираме нашите изисквания възможно най-конкретно, преди да пишем и кодираме. Ето защо, като общо правило, силно препоръчвам да бъдете възможно най-конкретни с вашите подкани. Райън Флорънс, съавтор на Remix, предлага прост, но мощен начин за подобряване на този процес, като завършите първоначалната си подкана с изречението: „Преди да започнем, имате ли въпроси към мен?“
В този момент AI обикновено се връща с полезни въпроси, където можете да изясните конкретното си намерение, насочвайки агента да ви предостави по-специализиран подход за вашата задача.
Използвайте контрол на версиите и работете в смилаеми парчета Използването на контрол на версиите като git не само е полезно, когато си сътрудничите като екип върху една кодова база, но също така ви предоставя катоиндивидуален сътрудник със стабилни точки, към които да се върнете в случай на спешност. Поради своята недетерминистична природа, изкуственият интелект понякога може да стане измамник и да направи промени, които просто не са полезни за това, което се опитвате да постигнете, и в крайна сметка да наруши нещата непоправимо. Разделянето на работата ви на множество ангажименти ще ви помогне да създадете стабилни точки, към които можете да се върнете, в случай че нещата тръгнат настрани. И вашите съотборници също ще ви благодарят, тъй като те ще имат по-лесно време да прегледат кода ви, когато е разделен на семантично добре структурирани части. Прегледайте внимателно Това е по-скоро обща най-добра практика, но по мое мнение става още по-важно, когато използвате AI инструменти за развойна дейност: Бъдете първият критичен рецензент на вашия код. Уверете се, че отделяте известно време, за да прегледате промените си ред по ред, точно както бихте прегледали кода на някой друг, и изпратете работата си само след като премине вашия собствен преглед. "И двете неща са верни за мен в момента: AI агентите са невероятни и огромен тласък на производителността. Те също са огромни машини за помия, ако изключите мозъка си и го оставите напълно. "- Армин Роначер в публикацията си в блога Agent Psychosis: Are We Going Insane?
Заключение и критични мисли Според мен инструментите за кодиране на AI могат да подобрят ежедневната ни продуктивност като разработчици и да освободят умствен капацитет за повече планиране и мислене на високо ниво. Те ни принуждават да артикулираме желания резултат с прецизни детайли. Всеки AI може понякога да халюцинира, което основно означава, че лъже с уверен тон. Така че, моля, не забравяйте да проверите и тествате, особено когато се съмнявате. AI не е сребърен куршум и вярвам, че съвършенството и способността за решаване на проблеми като разработчик никога няма да излязат от мода. За разработчиците, които тепърва започват кариерата си, тези инструменти могат да бъдат силно изкушаващи да свършат по-голямата част от работата вместо тях. Това, което може да се изгуби тук, е често изтощителната и болезнена работа с грешки и проблеми, които са трудни за отстраняване и разрешаване, известна още като „смилането“. Дори самият Лий Робинсън на Cursor AI поставя под въпрос това в една от своите публикации:
Инструментите за кодиране на AI се развиват с бързи темпове и аз съм развълнуван за това, което ще последва. Надявам се, че сте намерили тази статия и нейните съвети за полезни и сте развълнувани да изпробвате някои от тях сами.
