Viimeisten kahden vuoden aikana Work & Co:n tiimini ja minä olemme testaaneet ja asteittain integroineet tekoälyn koodaustyökaluja, kuten Copilot, Cursor, Claude ja ChatGPT, auttaaksemme meitä toimittamaan massojen käyttämiä verkkokokemuksia. Myönnän, että alkuskeptisyyden ja muutaman aha-hetken jälkeen erilaiset tekoälytyökalut ovat löytäneet tiensä päivittäiseen käyttööni. Ajan myötä niiden sovellusten luettelo, joiden mielestä oli järkevää antaa tekoäly ottaa haltuunsa, alkoi kasvaa, joten päätin jakaa käytännön käyttötapauksia tekoälytyökaluille, joita kutsun "vastuulliseksi kehittäjäksi". Mitä tarkoitan vastuullisella kehittäjällä? Meidän on varmistettava, että toimitamme laatukoodia sidosryhmiemme ja asiakkaidemme odotusten mukaisesti. Avustuksemme (eli vetopyynnöt) eivät saa olla taakka kollegoillemme, joiden on tarkistettava ja testattava työtämme. Lisäksi, jos työskentelet yrityksessä: Käyttämiemme työkalujen on oltava työnantajamme hyväksymiä. Arkaluonteisia näkökohtia, kuten turvallisuutta ja yksityisyyttä, on käsiteltävä oikein: Älä liitä salaisuuksia, asiakastietoja (PII) tai omaa koodia työkaluihin ilman käytännön hyväksyntää. Käsittele sitä kuin koodia muukalta Internetistä. Testaa ja tarkista aina. Huomautus: Tässä artikkelissa oletetaan, että tunnet hyvin perustavanlaatuisia AI-koodaustyökaluja, kuten Copilot VSCoden tai Cursorin sisällä. Jos kaikki tämä kuulostaa sinulle täysin uudelta ja vieraalta, Github Copilot -video-opetusohjelmat voivat olla loistava lähtökohta sinulle.
Hyödyllisiä AI-koodaustyökalujen sovelluksia Huomautus: Seuraavat esimerkit keskittyvät pääasiassa työskentelemiseen JavaScript-pohjaisissa verkkosovelluksissa, kuten React, Vue, Svelte tai Angular. Tuntemattoman koodikannan ymmärtäminen Ei ole harvinaista työskennellä vakiintuneiden koodikantojen parissa, ja suureen vanhaan koodikantaan liittyminen voi olla pelottavaa. Avaa vain projektisi ja tekoälyagenttisi (minun tapauksessani Copilot Chat VSCodessa) ja aloita kysymysten esittäminen aivan kuten kysyisit kollegaltasi. Yleensä puhun mielelläni kenen tahansa tekoälyagentin kanssa aivan kuten toiselle ihmiselle. Tässä on tarkempi esimerkkikehote: "Anna minulle korkean tason arkkitehtuurin yleiskatsaus: aloituspisteet, reititys, todennus, tietokerros, rakennustyökalut. Listaa sitten 5 tiedostoa luettavaksi järjestyksessä. Käsittele selityksiä hypoteeseina ja vahvista siirtymällä viitattuihin tiedostoihin."
Voit esittää jatkokysymyksiä, kuten "Kuinka reititys toimii yksityiskohtaisesti?" tai "Puhu minulle todennusprosessin ja -menetelmien läpi", ja se ohjaa sinut hyödyllisiin ohjeisiin, joiden avulla voit valaista vieraan koodikannan pimeyteen. Katkeavien muutosten kokeileminen riippuvuuksia päivitettäessä Npm-pakettien päivittäminen, varsinkin kun niihin liittyy murtuvia muutoksia, voi olla työlästä ja aikaa vievää työtä, ja se saa sinut korjaamaan melkoisen määrän regressioita. Jouduin äskettäin päivittämään datavisualisointikirjaston plotly.js yhden suuren julkaisuversion versiosta 2 versioon 3, ja tämän seurauksena joidenkin kaavioiden akselimerkinnät lakkasivat toimimasta. Jatkoin kysyin ChatGPT:ltä: "Päivitin Angular-projektini, joka käyttää Plotlya. Päivitin plotly.js:n – dist-paketin versiosta 2.35.2 versioon 3.1.0 – ja nyt x- ja y-akselin tunnisteet ovat poissa. Mitä tapahtui?"
Välittäjä palasi ratkaisun kanssa nopeasti (katso itse alta). Huomautus: Vahvistin silti selityksen viralliseen siirtooppaaseen ennen korjauksen lähettämistä.
Refaktorien replikointi turvallisesti eri tiedostoissa Kasvavat koodikannat tarjoavat varmasti mahdollisuuksia koodin yhdistämiseen. Huomaat esimerkiksi koodin päällekkäisyyden tiedostoissa, jotka voidaan purkaa yhdeksi funktioksi tai komponentiksi. Tämän seurauksena päätät luoda jaetun komponentin, joka voidaan sisällyttää sen sijaan, ja suorittaa sen uudelleen yhdessä tiedostossa. Sen sijaan, että tekisit muutokset manuaalisesti jäljellä oleviin tiedostoihisi, pyydät agenttia ottamaan uudelleen käyttöön puolestasi. Agenttien avulla voit valita useita tiedostoja kontekstiksi. Kun yhden tiedoston refaktorointi on tehty, voin lisätä sekä uudelleenmuodostetut että koskemattomat tiedostot kontekstiin ja pyytää agenttia julkaisemaan muutokset muihin tiedostoihin seuraavasti: "Toista tiedostossa A tekemäni muutokset myös tiedostoon B". Ominaisuuksien käyttöönotto tuntemattomissa teknologioissa Yksi suosikkihetkistäni tekoälykoodaustyökaluilla oli, kun se auttoi minua luomaan melko monimutkaisen animoidun gradienttianimaation GLSL:llä, kielellä, jota en ole tuntenut. Äskettäisessä projektissa suunnittelijamme keksivät animoidun gradientin 3D-objektin lataustilana. Pidin todella konseptista ja halusin tarjota asiakkaillemme jotain ainutlaatuista ja jännittävää. Theongelma: Minulla oli vain kaksi päivää aikaa ottaa se käyttöön, ja GLSL:llä on melko jyrkkä oppimiskäyrä. Tekoälytyökalu (tässä tapauksessa ChatGPT) oli jälleen hyödyllinen, ja aloin yksinkertaisesti kehottamaan sitä luomaan minulle erillisen HTML-tiedoston, joka renderöi kankaan ja hyvin yksinkertaisen animoidun värigradientin. Askel askeleelta kehotin tekoälyä lisäämään siihen hienostuneisuutta, kunnes sain kunnollisen tuloksen, jotta voisin alkaa integroida Shaderin varsinaiseen koodikantaani. Lopputulos: Asiakkaamme olivat erittäin tyytyväisiä, ja toimitimme monimutkaisen ominaisuuden pienessä ajassa tekoälyn ansiosta. Kirjoitustestit Kokemukseni mukaan projekteissa on harvoin tarpeeksi aikaa jatkuvasti kirjoittaa ja ylläpitää kunnollista yksikkö- ja integrointitestien sarjaa, ja lisäksi monet kehittäjät eivät todellakaan pidä testien kirjoittamisesta. Tekoälyapulaisen kehottaminen määrittämään ja kirjoittamaan testejä puolestasi on täysin mahdollista, ja se voidaan tehdä lyhyessä ajassa. Tietysti sinun tulee kehittäjänä silti varmistaa, että testit todella tarkastelevat sovelluksesi kriittisiä osia ja noudattavat järkeviä testausperiaatteita, mutta voit "ulkoistaa" testien kirjoittamisen tekoälyauttajallemme. Esimerkkikehote: "Kirjoita tämän toiminnon yksikkötestejä Jestin avulla. Käsittele onnellinen polku, reunatapaukset ja vikatilat. Selitä, miksi kukin testi on olemassa."
Voit jopa välittää testausguru Kent C. Doddsin parhaat testauskäytännöt ohjeiksi agenttillesi, kuten alla:
Sisäinen työkalu Hieman samanlainen kuin aiemmin mainittu Shader-esimerkki, sain äskettäin tehtävän analysoida koodin monistaminen koodikannassa ja vertailla ennen ja jälkeen refactorin. Ei todellakaan triviaali tehtävä, jos et halua mennä aikaa vievää tiedostojen manuaalista vertailua vievää reittiä. Tein Copilotin avulla skriptin, joka analysoi koodin monistamisen puolestani, järjesti ja järjesti tulosteen taulukkoon ja vienin sen Exceliin. Sitten otin sen askeleen pidemmälle. Kun koodin uudelleentekijämme oli valmis, kehotin agenttia ottamaan nykyisen Excel-taulukon perustaksi, lisäämään nykyisen kopioinnin tilan erillisissä sarakkeissa ja laskemaan delta. Kauan sitten kirjoitetun koodin päivittäminen Äskettäin vanha asiakkaani osui minuun, koska ajan mittaan muutamat ominaisuudet eivät enää toimineet kunnolla hänen verkkosivustollaan. Saalis: Sivusto rakennettiin melkein kymmenen vuotta sitten, ja JavaScript ja SCSS käyttivät melko vanhoja käännöstyökaluja, kuten requireJS, ja asennus vaati vanhemman Node.js-version, joka ei toiminut edes vuoden 2025 MacBookissani. Koko rakennusprosessin päivittäminen käsin olisi kestänyt päiviä, joten päätin kysyä tekoälyagentilta: "Voitko päivittää JS- ja SCSS-koontiprosessin kevyeksi 2025-pinoksi, kuten Vite?" Varmasti kävi niin, ja noin tunnin ajan agentin kanssa suoritetun tarkentamisen jälkeen SCSS- ja JS-koontiversioni vaihdettiin Viteen, ja pystyin keskittymään varsinaiseen virheenkorjaukseen. Varmista vain, että validoit tulosteet ja käännetyt tiedostot oikein, kun teet tällaisia olennaisia muutoksia rakennusprosessiisi. Yhteenveto ja luonnostelu Haluatko tiivistää kaikki viimeaikaiset koodimuutoksesi yhteen lauseeseen commit-viestiä varten, vai sinulla on pitkä lista sitoumuksista ja haluatko tiivistää ne kolmeen luettelokohtaan? Ei hätää, anna tekoälyn huolehtia siitä, mutta muista tarkistaa se. Esimerkkikehote on yhtä yksinkertainen kuin viestin lähettäminen toiselle ihmiselle: "Ole hyvä ja tee yhteenveto viimeaikaisista muutoksistani tiiviisti". Minun neuvoni olisi käyttää GPT:tä kirjoittamiseen varoen, ja kuten koodin kanssa, tarkista tulos ennen lähettämistä tai lähettämistä. Suositukset ja parhaat käytännöt Kehotus Yksi tekoälyn käytön ei niin ilmeisistä eduista on, että mitä tarkempia ja räätälöidympiä kehotteet ovat, sitä parempi tulos on. Tekoälyagentin kehottaminen pakottaa meidät muotoilemaan vaatimuksemme mahdollisimman tarkasti ennen kirjoittamista ja koodaamista. Tästä syystä suosittelen pääsääntöisesti olemaan mahdollisimman täsmällinen kehotuksissasi. Ryan Florence, Remixin toinen kirjoittaja, ehdottaa yksinkertaista mutta tehokasta tapaa parantaa tätä prosessia viimeistelemällä ensimmäinen kehote lauseella: "Ennen kuin aloitamme, onko sinulla kysyttävää minulle?"
Tässä vaiheessa tekoäly vastaa yleensä hyödyllisillä kysymyksillä, joissa voit selventää erityistä tarkoitustasi ja opastaa agenttia tarjoamaan sinulle räätälöidymmän lähestymistavan tehtävääsi varten.
Käytä versionhallintaa ja käsittele sulavia paloja Versionhallinnan, kuten gitin, käyttäminen ei ole hyödyllistä vain silloin, kun työskentelet tiiminä yhdessä koodikannassa, vaan myös tarjoamaan sinulleYksittäinen rahoittaja, jolla on vakaat pisteet, joihin voi palata hätätilanteessa. Ei-deterministisen luonteensa vuoksi tekoäly voi joskus mennä roistoon ja tehdä muutoksia, jotka eivät yksinkertaisesti ole hyödyllisiä sille, mitä yrität saavuttaa, ja lopulta rikkoa asioita peruuttamattomasti. Työsi jakaminen useisiin sitoumuksiin auttaa sinua luomaan vakaita pisteitä, joihin voit palata, jos asiat menevät sivuttain. Ja myös joukkuetoverisi kiittävät sinua, koska heillä on helpompi tarkistaa koodisi, kun se on jaettu semanttisesti hyvin jäsenneltyihin osiin. Tarkista perusteellisesti Tämä on enemmän yleinen paras käytäntö, mutta mielestäni siitä tulee entistä tärkeämpää, kun käytät tekoälytyökaluja kehitystyössä: Ole koodisi ensimmäinen kriittinen tarkistaja. Varmista, että käytät jonkin aikaa muutosten läpikäymiseen rivi riviltä, aivan kuten tarkistaisit jonkun muun koodin, ja lähetä työsi vasta, kun se läpäisee oman itsearvioinnin. "Kaksi asiaa on minulle totta tällä hetkellä: tekoälyagentit ovat uskomattomia ja valtava tuottavuuden lisäys. Ne ovat myös valtavia räjähdyskoneita, jos sammutat aivot ja päästätte irti kokonaan." - Armin Ronacher blogikirjoituksessaan Agent Psychosis: Are We Going Insane?
Johtopäätös ja kriittisiä ajatuksia Mielestäni tekoälykoodaustyökalut voivat parantaa tuottavuuttamme kehittäjinä päivittäin ja vapauttaa henkistä kapasiteettia enemmän suunnittelua ja korkeatasoista ajattelua varten. Ne pakottavat meidät ilmaisemaan haluamamme lopputuloksen huolellisesti. Mikä tahansa tekoäly voi toisinaan hallusinoida, mikä tarkoittaa periaatteessa sitä, että se on luottavaisella äänellä. Muista siis tarkistaa ja testata, varsinkin jos olet epävarma. Tekoäly ei ole hopealuoti, ja uskon, että huippuosaaminen ja kyky ratkaista ongelmia kehittäjänä ei koskaan mene pois muodista. Uraansa vasta aloittaville kehittäjille nämä työkalut voivat olla erittäin houkuttelevia tekemään suurin osa työstä heidän puolestaan. Se, mikä saattaa kadota täällä, on usein tyhjentävä ja tuskallinen työ bugien ja ongelmien parissa, joita on hankala korjata ja ratkaista, eli "jauhaa". Jopa Cursor AI:n oma Lee Robinson kyseenalaistaa tämän yhdessä viestissään:
AI-koodaustyökalut kehittyvät nopeasti, ja olen innoissani siitä, mitä tapahtuu seuraavaksi. Toivon, että pidit tästä artikkelista ja sen vinkeistä hyödyllisiä ja olet innoissasi kokeillaksesi joitain näistä itse.
