Opinnäytetyössä tutkittiin tekoälyavusteisesti tuotetun React-frontend-koodin laatua ja tuotantovalmiutta. Aihe on ajankohtainen, koska generatiivisia tekoälymalleja käytetään yhä enemmän ohjelmistokehityksen apuna. Tekoäly voi nopeuttaa koodin kirjoittamista ja antaa kehittäjälle nopeasti valmiin lähtökohdan. Samalla on kuitenkin tärkeää arvioida, onko tuotettu koodi riittävän laadukasta ja sopiiko se oikeaan projektiin ilman merkittäviä korjauksia. Frontend-kehityksessä tämä on erityisen tärkeää. Käyttöliittymäkoodi on osa sovellusta, ja sitä pitää voida ylläpitää myös myöhemmin.
Työn tavoitteena oli selvittää, millä tasolla eri tekoälymallien tuottaman React-koodin laatu on ennalta määriteltyjen arviointikriteerien perusteella. Lisäksi tarkasteltiin, millaisia eroja mallien välillä näkyy ja kuinka paljon manuaalista jatkokehitystä tarvitaan ennen kuin koodi voidaan hyväksyä osaksi projektia. Tässä tutkimuksessa tuotantovalmius tarkoitti sitä, että koodi toimii, on ylläpidettävää ja testattavaa sekä läpäisee projektissa käytetyt laatuportit. Pelkkä näkyvä toimivuus ei siis riittänyt, vaan toteutuksen piti sopia myös projektin teknisiin sääntöihin.
Kolme tekoälymallia vertailussa
Käytännön vertailussa oli mukana kolme eri tekoälymallia, joille annettiin samat lähtöehdot. Kaikki mallit toimivat samassa React- ja TypeScript-projektissa, ja niille annettiin sama yhteinen projektikonteksti sekä samat tapauskohtaiset tehtävänannot. Tutkimuksessa kehitettiin kolme ominaisuutta: ProfileCard-komponentti, ContactRequestForm-lomake ja laajempi SupportRequestInbox-ominaisuus.
Jokaisen toteutuksen tuli läpäistä TypeScriptin tyyppitarkistus, lint-tarkistus, automaattiset testit, tuotantokäännös ja SonarQube-analyysi. Näin arviointi ei perustunut vain mielipiteeseen, vaan myös toistettaviin tarkistuksiin. Tämä mahdollisti eri mallien luotettavan vertailun keskenään.
Tekoälyn tuottama koodi vaatii aina viimeistelyä
Keskeinen tulos oli, että mikään tekoälyn tuottama alkuperäinen toteutus ei ollut täysin valmis tuotantoon. Monet ratkaisut olivat lähellä tavoitetta, mutta niissä oli korjattavia puutteita. Ongelmat liittyivät testeihin, TypeScript-käytäntöihin, käyttöliittymän toteutukseen ja SonarQube-analyysiin. Ne eivät aina estäneet käyttöliittymän perustoimintaa, mutta ne estivät tarkistusten läpäisemisen. Manuaalisten korjausten jälkeen kaikki toteutukset läpäisivät käytetyt tarkistukset. Tämä osoittaa, että tekoälyn tuottama koodi voi olla hyvä lähtökohta, mutta se vaatii ehdottomasti kehittäjän omaa tarkistusta.
Mallien välillä oli eroja, mutta mikään malli ei ollut selvästi paras kaikissa tapauksissa. Claude Sonnet 4.6 ja GPT-5.4 tuottivat usein melko vahvoja lähtöratkaisuja, mutta myös niissä oli korjattavaa. Gemini 3.1 Prolla näkyi puolestaan erityisesti TypeScriptin type-only-importteihin liittyviä ongelmia. Tulosten perusteella erot näkyivät enemmän korjaustarpeiden luonteessa kuin siinä, että jokin malli olisi ollut aina toista parempi. Siksi tekoälyn arvioinnissa on tärkeää tarkastella sekä onnistumisia että koodiin jääviä puutteita.
Kehittäjän rooli muuttuu
Johtopäätöksenä voidaan todeta, että tekoäly on hyödyllinen työkalu frontend-kehityksessä, mutta sen tuottamaa koodia ei pidä hyväksyä sokeasti ilman tarkistusta. Tekoäly voi nopeuttaa työn aloitusvaihetta ja auttaa luomaan hyvän lähtökohdan, mutta kehittäjän vastuulle jää laadun arviointi, testaus ja viimeistely. Tekoäly ei siis poista kehittäjän roolia, vaan muuttaa sitä enemmän tarkistamisen ja ohjaamisen suuntaan. Ohjelmistokehityksessä tärkeintä onkin jatkossa yhdistää tekoälyn nopeus ja kehittäjän oma ammattitaito.
