Skap din egen Chrome-utvidelse med gratisversjonene av ChatGPT og Replit

Frode Ådland
5.2.2024
 min

Ideen om å skape egen software kan virke skremmende for mange, spesielt for de uten teknisk bakgrunn. Men hva om jeg fortalte deg at du kan bygge din egen Chrome-utvidelse uten å bruke en krone, og uten tidligere kodeerfaring? Med gratisversjonene av ChatGPT fra OpenAI og Replit er dette mer enn mulig. Sjekk ut hvordan!

Steg 1: Start med en idé

Med denne guiden skal vi lage en liten notatbok. Denne notatboken vil være lett tilgjengelig som en Chrome-utvidelse, der brukere enkelt kan notere ned ting de vil huske.

Steg 2: Benytt deg av ChatGPT – helt gratis!

Kanskje du lurer på, "Hva er neste steg?" eller "Hvordan starter jeg?". ChatGPT er der for å hjelpe, og med gratisversjonen kan du få svar på grunnleggende spørsmål for å veilede deg gjennom prosessen.

Fortell ChatGPT at du ønsker å lage en liten “notatbok” som en utvidelse til Chrome. Be om å få en trinnvis beskrivelse av hvordan man gjør det. Videre kan du også be om å få koden.

Steg 3: Klargjør prosjektet ditt med Replit

Replit er en online IDE (integrated development environment) som lar deg skrive, kjøre, og dele koden din direkte i nettleseren. Med gratisversjonen kan du starte et nytt prosjekt (eller "repl" som det kalles). Velg "HTML, CSS, JS" for å få riktig miljø for Chrome-utvidelser. Gi prosjektet et navn “Notatbok” og opprett.

Om selve grensesnittet i Replit er litt krevende å forstå kan du bare be ChatGPT om hjelp til å forstå hvordan du skal navigere.

Steg 4: Sett i gang med kodingen

Nå kommer morsomme! Med HTML, design brukergrensesnittet for notatboken din. Legg til litt farge og stil med CSS, og gjør det hele levende med JavaScript.

Du kan begynne helt enkelt, og heller gjøre det litt mer sofistikert når du har lært deg systemene.

Nå kan du ta koden fra ChatGPT og lime den inn der den hører hjemme i Replit. Om du lurer på hvor koden skal plasseres i Replit, så bare spør du ChatGPT. Blir svarene fra ChatGPT vanskelig å fortå, så kan fortelle ChatGPT at du er komplett nybegynner og trenger grundig hjelp.

Husk: Hvis du står fast, kan du spørre ChatGPT om råd. Selv i gratisversjonen kan denne hjelperen guide deg gjennom vanskelige kodehurdler.

Når du er ferdig å skrive/legge inn koden i Replit trykker du på denne grønne knappen “RUN”. Da kan du se hvordan utvidelsen vil se ut.

Når dette er utført laster du ned filen som en Zipfil.

Steg 5: Testing

Sjekk hvordan utvidelsen ser ut og fungerer i Chrome. Gå til chrome://extensions/, aktiver "Utviklermodus", og last opp utvidelsen direkte fra Replit.

Nå bare pakker du ut zipfilen du fikk laget med Replit og tester den i Chrome.

Om det er ting som ikke virker, kopierer du feilmelding tilbake til ChatGPT og ber om ytterligere instruksjoner.

Steg 6: Del ditt mesterverk med verden

Når alt er klart, kan du vurdere å publisere utvidelsen på Chrome Web Store eller bare dele den med dine nærmeste for å få tilbakemelding.

Bruken av ChatGPT og Replit i denne prosessen viser hvordan gratisverktøy kan revolusjonere hvordan vi tenker på programvareutvikling. Ikke lenger er det en verden bare for de innvidde; nå kan enhver med en idé og lidenskap bli en skaper.

Bloggen vår

Siste bloggposter fra Oschlo

Vil du også jobbe i Oschlo?
Vi er på jakt etter flere gode produktledere! Send oss en søknad, spørsmål eller bare en melding så tar vi en kaffeprat!
KOntakt oss