I løpet av de siste to årene har teamet mitt på Work & Co og jeg testet ut og gradvis integrert AI-kodingsverktøy som Copilot, Cursor, Claude og ChatGPT for å hjelpe oss med å sende nettopplevelser som brukes av massene. Riktignok, etter litt innledende skepsis og noen få aha-øyeblikk, har forskjellige AI-verktøy funnet veien inn i min daglige bruk. Over tid begynte listen over applikasjoner der vi fant det fornuftig å la AI ta over å vokse, så jeg bestemte meg for å dele noen praktiske brukstilfeller for AI-verktøy for det jeg kaller den "ansvarlige utvikleren". Hva mener jeg med en ansvarlig utvikler? Vi må sørge for at vi leverer kvalitetskode som forventet av våre interessenter og kunder. Våre bidrag (dvs. pull-forespørsler) bør ikke bli en byrde for våre kolleger som må gjennomgå og teste arbeidet vårt. Også i tilfelle du jobber for et selskap: Verktøyene vi bruker må godkjennes av arbeidsgiveren vår. Sensitive aspekter som sikkerhet og personvern må håndteres riktig: Ikke lim inn hemmeligheter, kundedata (PII) eller proprietær kode i verktøy uten policygodkjenning. Behandle det som kode fra en fremmed på internett. Test og verifiser alltid. Merk: Denne artikkelen forutsetter en viss grunnleggende kjennskap til AI-kodingsverktøy som Copilot inne i VSCode eller Cursor. Hvis alt dette høres helt nytt og ukjent ut for deg, kan Github Copilot-videoopplæringen være et fantastisk utgangspunkt for deg.
Nyttige applikasjoner av AI-kodingsverktøy Merk: De følgende eksemplene vil hovedsakelig fokusere på arbeid i JavaScript-baserte nettapplikasjoner som React, Vue, Svelte eller Angular. Få en forståelse av en ukjent kodebase Det er ikke uvanlig å jobbe med etablerte kodebaser, og å bli med i en stor eldre kodebase kan være skremmende. Bare åpne prosjektet ditt og AI-agenten din (i mitt tilfelle Copilot Chat i VSCode) og begynn å stille spørsmål akkurat som du ville stilt en kollega. Generelt liker jeg å snakke med enhver AI-agent akkurat som jeg ville gjort med et medmenneske. Her er et mer raffinert eksempel på spørsmål: "Gi meg en arkitekturoversikt på høyt nivå: inngangspunkter, ruting, autentisering, datalag, byggeverktøy. Skriv deretter opp 5 filer som skal leses i rekkefølge. Behandle forklaringer som hypoteser og bekreft ved å hoppe til refererte filer."
Du kan fortsette å stille oppfølgingsspørsmål som "Hvordan fungerer rutingen i detalj?" eller "Snakk meg gjennom autentiseringsprosessen og -metodene", og det vil lede deg til nyttige instruksjoner for å skinne litt lys inn i mørket til en ukjent kodebase. Triaging bryte endringer ved oppgradering av avhengigheter Å oppdatere npm-pakker, spesielt når de kommer med brytende endringer, kan være kjedelig og tidkrevende arbeid, og få deg til å feilsøke en god del regresjoner. Jeg måtte nylig oppgradere datavisualiseringsbiblioteket plotly.js opp en større versjon fra versjon 2 til 3, og som et resultat av det sluttet aksemerkingen i noen av grafene å fungere. Jeg fortsatte med å spørre ChatGPT: "Jeg oppdaterte Angular-prosjektet mitt som bruker Plotly. Jeg oppdaterte plotly.js - dist-pakken fra versjon 2.35.2 til 3.1.0 - og nå er etikettene på x- og y-aksen borte. Hva skjedde?"
Agenten kom tilbake med en løsning umiddelbart (se selv nedenfor). Merk: Jeg bekreftet fortsatt forklaringen mot den offisielle migrasjonsveiledningen før jeg sendte rettelsen.
Replikering av refaktorer trygt på tvers av filer Voksende kodebaser avslører absolutt muligheter for kodekonsolidering. For eksempel merker du kodeduplisering på tvers av filer som kan pakkes ut til en enkelt funksjon eller komponent. Som et resultat bestemmer du deg for å opprette en delt komponent som kan inkluderes i stedet og utføre den refactoren i én fil. Nå, i stedet for manuelt å utføre disse endringene i de gjenværende filene dine, ber du agenten din om å rulle ut refactor for deg. Agenter lar deg velge flere filer som kontekst. Når refaktoren for én fil er ferdig, kan jeg legge til både de refaktorerte og urørte filene i kontekst og be agenten om å rulle ut endringene til andre filer som dette: "Repliser endringene jeg gjorde i fil A til fil B også". Implementering av funksjoner i ukjente teknologier Et av mine favoritt-aha-øyeblikk ved å bruke AI-kodingsverktøy var da det hjalp meg å lage en ganske kompleks animert gradientanimasjon i GLSL, et språk jeg har vært ganske ukjent med. På et nylig prosjekt kom designerne våre opp med en animert gradient som en innlastingstilstand på et 3D-objekt. Jeg likte konseptet veldig godt og ønsket å levere noe unikt og spennende til våre kunder. Deproblem: Jeg hadde bare to dager på å implementere det, og GLSL har en ganske bratt læringskurve. Igjen kom et AI-verktøy (i dette tilfellet ChatGPT) godt med, og jeg begynte ganske enkelt å be det om å lage en frittstående HTML-fil for meg som gjengir et lerret og en veldig enkel animert fargegradient. Trinn etter trinn ba jeg AI om å legge til mer finesse til den til jeg kom til et anstendig resultat slik at jeg kunne begynne å integrere skyggeleggingen i min faktiske kodebase. Sluttresultatet: Kundene våre var superfornøyde, og vi leverte en kompleks funksjon på kort tid takket være AI. Å skrive prøver Min erfaring er at det sjelden er nok tid på prosjekter til å kontinuerlig skrive og vedlikeholde en skikkelig pakke med enhets- og integrasjonstester, og på toppen av det, liker mange utviklere ikke oppgaven med å skrive tester. Å be AI-hjelperen din om å sette opp og skrive tester for deg er fullt mulig og kan gjøres på kort tid. Selvfølgelig bør du som utvikler fortsatt sørge for at testene dine faktisk tar en titt på de kritiske delene av applikasjonen din og følger fornuftige testprinsipper, men du kan "outsource" skrivingen av testene til vår AI-hjelper. Eksempel på melding: "Skriv enhetstester for denne funksjonen ved å bruke Jest. Dekk glad sti, kanttilfeller og feilmoduser. Forklar hvorfor hver test eksisterer."
Du kan til og med gi testguruen Kent C. Dodds sine beste praksiser for testing som retningslinjer for agenten din, som nedenfor:
Intern verktøy Litt lik shader-eksemplet nevnt tidligere, fikk jeg nylig i oppgave å analysere kodeduplisering i en kodebase og sammenligne før og etter en refactor. Absolutt ikke en triviell oppgave hvis du ikke vil gå den tidkrevende ruten med å sammenligne filer manuelt. Ved hjelp av Copilot laget jeg et skript som analyserte kodeduplisering for meg, ordnet og bestilte utdataene i en tabell, og eksporterte det til Excel. Så tok jeg det et skritt videre. Da koderefaktoren vår var ferdig, ba jeg agenten om å ta mitt eksisterende Excel-ark som grunnlinje, legge til gjeldende dupliseringstilstand i separate kolonner og beregne deltaet. Oppdatering av kode skrevet for lenge siden Nylig slo en gammel klient av meg meg opp, siden noen få funksjoner over tid ikke fungerte ordentlig på nettstedet hans lenger. Fangsten: Nettstedet ble bygget for nesten ti år siden, og JavaScript og SCSS brukte ganske gamle kompileringsverktøy som requireJS, og oppsettet krevde en eldre versjon av Node.js som ikke en gang ville kjøre på min 2025 MacBook. Å oppdatere hele byggeprosessen for hånd ville ha tatt meg dager, så jeg bestemte meg for å spørre AI-agenten: "Kan du oppdatere JS- og SCSS-byggeprosessen til en mager 2025-stabel som Vite?" Det gjorde det sikkert, og etter rundt en time med raffinering med agenten, fikk jeg byttet SCSS- og JS-bygg til Vite, og jeg kunne fokusere på faktisk feilretting. Bare sørg for å validere utdataene og de kompilerte filene på riktig måte når du gjør slike integrerte endringer i byggeprosessen. Oppsummering og utkast Vil du oppsummere alle de siste kodeendringene dine i én setning for en commit-melding, eller har du en lang liste med commits og ønsker å oppsummere dem i tre punkt? Ikke noe problem, la AI ta seg av det, men sørg for å korrekturlese det. Et eksempel på spørsmål er så enkelt som å sende meldinger til et medmenneske: "Vennligst oppsummer mine nylige endringer i konsise punkttegn". Mitt råd her vil være å bruke GPT for å skrive med forsiktighet, og som med kode, vennligst sjekk utdataene før du sender eller sender inn. Anbefalinger og beste praksis Spørging En av de ikke så åpenbare fordelene med å bruke AI er at jo mer spesifikke og skreddersydde spørsmålene dine er, jo bedre blir resultatet. Prosessen med å spørre en AI-agent tvinger oss til å formulere kravene våre så spesifikt som mulig før vi skriver og koder. Dette er grunnen til at jeg som en generell regel anbefaler å være så spesifikk som mulig med spørsmålene dine. Ryan Florence, medforfatter av Remix, foreslår en enkel, men kraftig måte å forbedre denne prosessen ved å fullføre den første ledeteksten med setningen: "Før vi starter, har du noen spørsmål til meg?"
På dette tidspunktet kommer AI vanligvis tilbake med nyttige spørsmål der du kan avklare din spesifikke hensikt, og veilede agenten til å gi deg en mer skreddersydd tilnærming for oppgaven din.
Bruk versjonskontroll og arbeid i fordøyelige biter Å bruke versjonskontroll som git er ikke bare nyttig når du samarbeider som et team på en enkelt kodebase, men også for å gi deg som enindividuell bidragsyter med stabile punkter å rulle tilbake til i tilfelle en nødsituasjon. På grunn av sin ikke-deterministiske natur, kan AI noen ganger bli useriøs og gjøre endringer som rett og slett ikke er nyttige for det du prøver å oppnå og til slutt bryte ting uopprettelig. Å dele opp arbeidet ditt i flere forpliktelser vil hjelpe deg med å skape stabile poeng som du kan gå tilbake til i tilfelle ting går sidelengs. Og lagkameratene dine vil også takke deg, da de vil ha lettere for å gjennomgå koden din når den er delt opp i semantisk velstrukturerte biter. Gjennomgå grundig Dette er mer en generell beste praksis, men etter min mening blir det enda viktigere når du bruker AI-verktøy for utviklingsarbeid: Vær den første kritiske anmelderen av koden din. Sørg for å bruke litt tid på å gå gjennom endringene linje for linje, akkurat som du ville gjennomgått andres kode, og send inn arbeidet ditt først når det har bestått din egen selvevaluering. "To ting er begge sanne for meg akkurat nå: AI-agenter er fantastiske og et enormt produktivitetsløft. De er også enorme slopmaskiner hvis du slår av hjernen og slipper helt taket." — Armin Ronacher i sitt blogginnlegg Agent Psychosis: Are We Going Insane?
Konklusjon og kritiske tanker Etter min mening kan AI-kodeverktøy forbedre produktiviteten vår som utviklere på daglig basis og frigjøre mental kapasitet for mer planlegging og tenkning på høyt nivå. De tvinger oss til å artikulere ønsket resultat med grundige detaljer. Enhver AI kan til tider hallusinere, noe som i utgangspunktet betyr at den ligger i en selvsikker tone. Så sørg for å sjekke og teste, spesielt når du er i tvil. AI er ikke en sølvkule, og jeg tror at fortreffelighet og evnen til å løse problemer som utvikler aldri vil gå av moten. For utviklere som nettopp har begynt i karrieren kan disse verktøyene være svært fristende til å gjøre mesteparten av jobben for dem. Det som kan gå seg vill her er det ofte drenerende og smertefulle arbeidet gjennom feil og problemer som er vanskelige å feilsøke og løse, også kjent som "the grind". Til og med Cursor AIs egen Lee Robinson stiller spørsmål ved dette i et av innleggene hans:
AI-kodingsverktøy utvikler seg i et raskt tempo, og jeg er spent på hva som kommer neste gang. Jeg håper du fant denne artikkelen og dens tips nyttig og gleder deg til å prøve ut noen av disse selv.
