ID.nl logo
Nieuw tabblad aanpassen in Chrome met Google Tab Maker
© Reshift Digital
Huis

Nieuw tabblad aanpassen in Chrome met Google Tab Maker

Je staat er niet zo snel bij stil, maar de pagina Nieuw tabblad is een van de meest bekeken pagina’s in je browser. In Chrome kun je de pagina Nieuw tabblad aanpassen, zodat je daar iedere keer wordt begroet door zelf gekozen foto’s, het weerbericht, nieuwtjes, aankondigingen of wat je maar wilt. Dit doen we met de Google Tab Maker.

Voor dit doel heeft Chrome een tool ontwikkeld waarmee je zelf een extensie samenstelt die telkens de lay-out en de inhoud in de Nieuwe tabblad-pagina inlaadt. Het is zelfs mogelijk verschillende nieuwe tabbladen te maken, waarna Chrome er telkens willekeurig één uitpikt. Je hoeft niets te installeren om Google Tab Maker te gebruiken, want het gaat om een webtool. Bovendien is Tab Maker gratis en hoef je ook niet met code aan de gang. 

Als je jouw extensie deelt met anderen, krijgen ook zij deze nieuwe tabbladen te zien. Hiermee is het een interessante oplossing voor bedrijven, organisaties, scholen en verenigingen die langs die weg hun community willen warmhouden met nieuwtjes en aankondigingen. Vroeger ontwikkelden professionele programmeurs dit soort Chrome-extensies, maar met Tab Maker kan iedereen gepersonaliseerde tabbladen maken.

Werkingsprincipe

Om de werking van Google Tab Maker te begrijpen, is het handig om te weten hoe de tool in elkaar zit. Om mee te beginnen, zijn er elf verschillende sjablonen waaruit je kunt kiezen. Die sjablonen bepalen de basisvorm en verdelen de inhoud in vakken of blokken. In deze vakken kun je afbeeldingen, tekst, links of animated gifs plaatsen en ook koppelingen naar je favoriete nieuwsfeeds toevoegen. Je krijgt dan iedere keer als je een nieuw tabblad opent, het meest recente nieuws te zien. 

De inhoud van het sjabloon leg je vast in een Google-spreadsheet. Daarna verbind je het spreadsheet met het gekozen sjabloon, en in het vervolg wordt de inhoud in de juiste vakken geladen.

©PXimport

Sjabloon kiezen

Om aan de slag te gaan klik je op de groene knop rechtsboven: Make your own. In het volgende venster lees je dat de hele procedure slechts vijf stappen inneemt. Klik op Get started, je krijgt dan de elf sjablonen te zien. Wanneer je op zo’n template klikt, zie je rechts een grotere weergave. Er zijn ook sjablonen bij voor dubbele functies, voor als je bijvoorbeeld de resultaten wilt vergelijken van verschillende sportclubs of de weersvoorspellingen van verschillende steden naast elkaar wilt zetten. Heb je een template gekozen, dan klik je op Next.

©PXimport

Inhoud

In de volgende stap moet je in een Google-spreadsheet de inhoud vastleggen. Je kunt daarbij met een blanco werkblad beginnen, of de voorbeeldinhoud openen zodat je een idee krijgt wat er van je verwacht wordt. Onder de knop Add your own content zie je het vak waar je straks het internetadres moet plakken van de Google-spreadsheet. We gaan zelf onze gegevens invullen, dus kiezen voor de onderste knop.

Spreadsheet

Een Google-spreadsheet opent zich, waarin je in koeienletters gevraagd wordt om een kopie van dit werkblad te maken. Dat doe je via het menu Bestand / Kopie maken. Geef dit nieuwe document een herkenbare naam, bijvoorbeeld inhoud_tab_maker. Standaard zal Google Spreadsheets dit nieuwe document via Google Drive publiceren. Dat kun je zo laten staan.

Onderaan dit werkblad zie je dat deze spreadsheet uit drie tabbladen bestaat die je door de opbouw zullen leiden. Het eerste tabblad laat je dus een kopie van dit werkblad maken. Stap twee nodigt je uit om inhoud toe te voegen en in stap drie kun je het werkblad publiceren.

©PXimport

Kolommen en rijen

Nadat we het werkblad gekopieerd hebben, gaan we de inhoud maken. Dat is slechts een kwestie van het vullen van de cellen met afbeeldingen, links en tekst. Klik onderaan op het tabblad met de naam Step 2: Add content to this sheet. Omdat het blad automatisch wordt opgeslagen in je Google-account kun je er op ieder moment naar terugkeren en eraan verder werken. 

Bovenaan in de spreadsheet zie je de vakkenindeling van het sjabloon waarin je werkt. De nummers van de vakken zul je herkennen in de kolommen van het rekenblad. Ieder blok heeft een eigen kolom en er is ook een kolom voor de achtergrondafbeeldingen. De rijen in het rekenblad staan telkens voor een nieuw tabblad. Als je bijvoorbeeld tien rijen gebruikt, dan maak je evenveel nieuwe tabbladen. Het is van cruciaal belang dat je geen foto’s en gifs combineert met tekstuele inhoud in dezelfde kolom. 

Om een afbeelding of gif toe te voegen, ga je er online naar op zoek. Klik met rechts op het zoekresultaat en kies Adres van de afbeelding kopiëren. Daarna plak je deze link in de juiste cel. Hetzelfde doe je met hyperlinks naar andere bronnen, zoals nieuwsfeeds.

 In dit voorbeeld maken we een nieuwe tabbladpagina voor een fotoclub die iedere maand twee foto’s van leden onder de aandacht brengt. 

©PXimport

Publiceren

Zelfs al ben je nog niet helemaal klaar, je kunt de spreadsheet alvast publiceren door in Google Spreadsheets naar Bestand / Delen te gaan. Daar kies je de optie Publiceren op het internet. In het pop-upvenster moet je even opletten. Onder Link staat de optie standaard ingesteld op Heel document. Uiteraard moet je niet het hele spreadsheet-document publiceren, maar alleen het tabblad met de naam Step 2: Add content to this sheet

Daarnaast moet je kiezen in welk bestandsformaat je de spreadsheet publiceert. Standaard staat dit ingesteld op Webpagina. Wijzig dit in de optie Door komma’s gescheiden waarden (.csv). Pas deze instellingen aan en klik op Publiceren. Je krijgt dan een link die begint met https://docs.google.com/spreasheet/. Die link moet je kopiëren.

©PXimport

Body aanpassen

Daarna ga je terug naar de geopende pagina in Tab Maker. De link die je daarnet hebt gekopieerd, plak je in het url-vak. Klik vervolgens op Next. Er verschijnt nu een voorvertoning van de nieuwe tabbladpagina, waarna je de lay-out nog moet verfijnen. 

Eerst pas je de eigenschappen van de gehele pagina aan. Daarna kun je de eigenschappen blok voor blok wijzigen. Zo kun je de achtergrondkleur selecteren en bepalen hoe je de afbeeldingen en tekst in de vakken wilt hebben. Bij afbeeldingen heb je drie opties onder Image Fit: Repeat, Fill en Cover. Bij Repeat wordt de afbeelding herhaald tot het frame gevuld is. 

Met Fill zal de webapp de afbeelding in de hoogte en breedte uitrekken tot het in het frame past, waardoor het beeld vervormd wordt. Met Cover wordt de afbeelding zodanig geschaald en uitgesneden dat hij het frame vult zonder vervorming.

©PXimport

Verschillende tabbladen

In dit voorbeeld hebben we vijf rijen voor evenveel nieuwe tabbladen gemaakt. Onderaan kun je de voorvertoning per rij (dus per nieuwe tabbladpagina) opvragen. Selecteer de gewenste rij en klik op Refresh. Met Page Padding bepaal je de breedte van de marge. Met Block Spacing beslis je hoeveel ruimte er moet zijn tussen de verschillende blokken. 

Hoe groter de waarde die je hier ingeeft, hoe breder de ruimte tussen de inhoudsblokken wordt, maar hoe kleiner die inhoudsblokken zelf worden.

©PXimport

Blokinhoud aanpassen

Verzorg de inhoud van de blokken. Gaat het om tekst, dan kun je het lettertype, de lettergrootte, de stijl, de hoogte en nog meer andere eigenschappen bewerken. Als je op zo’n element klikt, dan verschijnt in de linkerkolom het nummer van het blok met de bijbehorende parameters waarmee je verticale en horizontale uitlijning regelt. 

Ieder blok kun je van een kleurtje voorzien met de regelaar Block Color en de dekking van die achtergrondkleur bepaal je met Background Alpha. Als je die bijvoorbeeld op 50 instelt, dan wordt de achtergrondkleur semitransparant. Verder is het mogelijk om de blokken van afgeronde hoeken te voorzien met Border Radius.

©PXimport

Bundelen

In de volgende stap bundel je alle eigenschappen die je hebt vastgelegd in het Google-spreadsheet samen met Tab Maker in een nieuwe extensie. Geef de nieuwe tab een naam en typ een korte beschrijving. Daaronder kies je een pictogram voor de extensie. 

Tab Maker presenteert een set pictogrammen die je vrij mag gebruiken, maar je mag zelf ook een grafisch bestandje van je harde schijf selecteren. Wanneer alle vakken zijn ingevuld, kun je klikken op de blauwe knop Download zip file.

Privé delen of via Web Store

Nu heb je de keuze. Wil je de extensie zelf delen met een groepje mensen die je kent? Of ben je zo trots op je project dat je de extensie wilt verspreiden via de Chrome Web Store? 

In dat laatste geval moet je jezelf registreren als ontwikkelaar en een eenmalige bijdrage van vijf dollar betalen aan registratiekosten. Daarna moet je het zip-bestand uploaden in het Developer Dashboard. Tenslotte moet je de extensie laten goedkeuren door Google voordat hij in de Web Store wordt opgenomen.

Om de extensie te delen binnen je eigen kring, zal Tab Maker ook een zip-bestand samenstellen. Dat kun je daarna naar de anderen versturen.

©PXimport

Installeren

De ontvanger van jouw extensie moet het bestand tab-maker.zip eerst uitpakken. Daarna opent hij Chrome en gaat hij naar het extensiebeheer door in het adresvak chrome://extensions te typen. Daar schakelt hij de Ontwikkelaarsmodus in, te vinden in de rechterbovenhoek.

Hierdoor komt de knop Uitgepakte extensie laden in beeld en kan hij de uitgepakte extensie uploaden. Om het resultaat te bekijken, moet diegene een nieuw tabblad openen.

▼ Volgende artikel
SSD vs. HDD: waarom is een SSD zo veel sneller dan een harde schijf?
© arinahabich
Huis

SSD vs. HDD: waarom is een SSD zo veel sneller dan een harde schijf?

Waarom start een computer met een SSD binnen enkele seconden op, terwijl een oude harde schijf blijft ratelen? Het vervangen van een HDD door een SSD is de beste upgrade voor een trage laptop of pc. We leggen in dit artikel uit waar die enorme snelheidswinst vandaan komt en wat het fundamentele verschil is tussen deze twee opslagtechnieken.

Iedereen die zijn computer of laptop een tweede leven wil geven, krijgt vaak hetzelfde advies: vervang de oude harde schijf door een SSD. De snelheidswinst is direct merkbaar bij het opstarten en het openen van programma's. Maar waar komt dat enorme verschil in prestaties vandaan? Het antwoord ligt in de fundamentele technologie die schuilgaat onder de behuizing van deze opslagmedia.

De vertraging van mechanische onderdelen

Om te begrijpen waarom een Solid State Drive (SSD) zo snel is, moeten we eerst kijken naar de beperkingen van de traditionele harde schijf (HDD). Een HDD werkt met magnetische roterende platen. Dat kun je vergelijken met een geavanceerde platenspeler. Wanneer je een bestand opent, moet een fysieke lees- en schrijfkop zich naar de juiste plek op de draaiende schijf verplaatsen om de data op te halen. Dat fysieke proces kost tijd, wat we latentie noemen. Hoe meer de data op de schijf verspreid staat, hoe vaker de kop heen en weer moet bewegen en wachten tot de juiste sector onder de naald doordraait. Dit mechanische aspect is de grootste vertragende factor in traditionele opslag.

©Claudio Divizia

Flashgeheugen en directe gegevensoverdracht

Een SSD rekent definitief af met deze wachttijden omdat er geen bewegende onderdelen in de behuizing zitten. De naam 'Solid State' verwijst hier ook naar; het is een vast medium zonder rammelende componenten. In plaats van magnetische platen gebruikt een SSD zogenoemd NAND-flashgeheugen. Dat is vergelijkbaar met de technologie in een usb-stick, maar dan veel sneller en betrouwbaarder. Omdat de data op microchips wordt opgeslagen, is de toegang tot bestanden volledig elektronisch. Er hoeft geen schijf op toeren te komen en er hoeft geen arm te bewegen. De controller van de SSD stuurt simpelweg een elektrisch signaal naar het juiste adres op de chip en de data is direct beschikbaar.

Toegangstijd en willekeurige leesacties

Hoewel de maximale doorvoersnelheid van grote bestanden bij een SSD indrukwekkend is, zit de echte winst voor de consument in de toegangstijd. Een besturingssysteem zoals Windows of macOS is constant bezig met het lezen en schrijven van duizenden kleine systeembestandjes. Een harde schijf heeft daar enorm veel moeite mee, omdat de leeskop als een bezetene heen en weer moet schieten. Een SSD kan deze willekeurige lees- en schrijfopdrachten (random read/write) nagenoeg gelijktijdig verwerken met een verwaarloosbare vertraging. Dat is de reden waarom een pc met een SSD binnen enkele seconden opstart, terwijl een computer met een HDD daar soms minuten over doet.

©KanyaphatStudio

Van SATA naar NVMe-snelheden

Tot slot speelt de aansluiting een rol in de snelheidsontwikkeling. De eerste generaties SSD's gebruikten nog de SATA-aansluiting, die oorspronkelijk was ontworpen voor harde schijven. Hoewel dat al een flinke verbetering was, liepen snelle SSD's tegen de grens van deze aansluiting aan. Moderne computers maken daarom gebruik van het NVMe-protocol via een M.2-aansluiting. Deze technologie communiceert rechtstreeks via de snelle PCIe-banen van het moederbord, waardoor de vertragende tussenstappen van de oude SATA-standaard worden overgeslagen. Hierdoor zijn snelheden mogelijk die vele malen hoger liggen dan bij de traditionele harde schijf.

Populaire merken voor SSD's

Als je op zoek bent naar een betrouwbare en snelle SSD, is er een aantal fabrikanten dat de markt domineert. Samsung wordt door velen gezien als de marktleider op het gebied van flashgeheugen en staat bekend om de uitstekende prestaties van hun EVO- en PRO-series. Daarnaast is Western Digital (WD) een vaste waarde; dit merk heeft de transitie van traditionele harde schijven naar SSD's succesvol gemaakt met hun kleurgecodeerde (Blue, Black en Red) series voor verschillende doeleinden. Ook Transcend is een uitstekende keuze; dit merk staat al jaren bekend om zijn betrouwbare geheugenproducten en biedt duurzame SSD's die lang meegaan. Tot slot bieden merken als Kingston en Seagate betrouwbare alternatieven die vaak net iets vriendelijker geprijsd zijn, zonder dat je daarbij veel inlevert op stabiliteit.

▼ Volgende artikel
AI zonder programmeren: Zo bouw je je eigen chatbot
© ID.nl
Huis

AI zonder programmeren: Zo bouw je je eigen chatbot

Misschien heb je wel eens een vraag gesteld aan een AI-chatbot als ChatGPT, Microsoft Copilot of Perplexity. Maar hoe ontwerp je zelf nu zo'n chatbot? Met de juiste tools is daar zelfs weinig tot geen programmeerwerk voor vereist. We bekijken twee uiteenlopende oplossingen.

Een AI-chatbot is een digitale gesprekspartner die wordt aangedreven door kunstmatige intelligentie. Meestal is de intelligentie gebaseerd op een taalmodel dat is getraind om mensachtige gesprekken te voeren. In tegenstelling tot traditionele op regels gebaseerde chatbots, die alleen vooraf ingestelde antwoorden geven, kan een AI-chatbot vrije tekst begrijpen en ‘natuurlijke’ reacties geven.

In dit artikel kijken we naar het bouwen van een eigen chatbot die je op je desktop of mobiel kunt gebruiken en zelfs op een eigen website kunt plaatsen. We bespreken twee manieren. De eenvoudigste is een no-code chatbotplatform dat het AI-gedeelte achter de schermen afhandelt en je via een gebruiksvriendelijke interface laat bepalen hoe de gespreksflow verloopt. Typische voorbeelden zijn Chatfuel en Chatbot voor zakelijke toepassingen. Daarnaast zijn er de meer toegankelijke Poe en Coze, die we hier behandelen. Onze tweede oplossing is technischer, maar flexibeler. Daarbij gebruik je de Application Programming Interface (API) van een AI-taalmodel om de AI-functionaliteit in je eigen omgeving te integreren. Hiervoor werken we graag met de online omgeving Google Colab.

Poe

Laten we starten met een gebruiksvriendelijke optie: het no-code chatbotplatform Poe (www.poe.com). Je kunt hier ook de app voor desktop of mobiel downloaden en installeren, met vrijwel dezelfde interface en functies als in de browser. De eerste keer maak je een account aan of meld je je aan met je Google- of Apple-account. Via Bots and apps kun je met allerlei AI-chatbots praten, maar in dit geval willen we vooral een eigen chatbot maken. Concreet gaat het om het creëren van een eigen ‘persona’ binnen een gekozen AI-model. Zo’n persona kun je zien als het perspectief, de rol of identiteit die je een AI-bot meegeeft.

Klik hiervoor op Create +. Je krijgt nu verschillende opties, zoals Image generation bot, Video generation bot en Prompt bot. Wij kiezen dit laatste.

Poe bestaat ook als desktop-app en biedt toegang tot vele tientallen AI-modellen.

Creatie

Je hoeft nu eigenlijk alleen maar een onlineformulier in te vullen. We doorlopen kort de belangrijkste onderdelen. Naast het gekozen bottype moet je een naam verzinnen. Omdat deze deel uitmaakt van de url, kies je bij voorkeur een originele, korte naam in kleine letters. Voeg ook een beschrijving toe, die zichtbaar is voor gebruikers van je bot.

Bij Base bot selecteer je een geschikt AI-model, bijvoorbeeld Claude-Haiku-3, GPT-4o-mini, GPT-5 of Grok-4. Afhankelijk van het model gelden er soms beperkingen. Poe-abonnees krijgen doorgaans uitgebreidere toegang tot de duurdere modellen.

Bij Prompt beschrijf je nauwkeurig en uitgebreid hoe de bot moet reageren. De optie Optimize prompt for Previews kun je uitgeschakeld laten. Vul bij Greeting message een welkomstwoord in dat de bot bij elke start toont. Het onderdeel Advanced kun je eigenlijk ongemoeid laten, maar interessant is wel dat je bij Custom temperature het ‘creativiteitsgehalte’ van de bot kunt instellen: hoe hoger de waarde, hoe creatiever en onvoorspelbaarder.

Bij Access kies je de zichtbaarheid van je bot. Wellicht is Only people with the access link de handigste optie, waarna de url zichtbaar wordt en je deze kunt verspreiden. Klik bovenin op Edit picture en kies of ontwerp een passend pictogram. Is alles ingevuld, klik dan onderin op Publish. Je bot is nu klaar voor gebruik. Om je bot te bewerken, hoef je deze maar bij Bots and apps te selecteren en via het knopje met de drie puntjes op Edit te klikken. Ook de optie Delete is beschikbaar.

Geef duidelijk aan wat je bot precies moet doen.
GPT's van OpenAI

Binnen de omgeving van OpenAI (https://chat.openai.com) kun je ook je eigen AI-chatbots maken, de zogeheten GPT’s. Hiervoor heb je wel een plusabonnement nodig (23 euro per maand). Je bent daarbij ook beperkt tot de GPT-modellen van OpenAI, maar je kunt je creaties wel delen via een link of in de GPT-store.

In het kort werkt dit als volgt. Meld je aan en klik links op GPT’s. Klik rechtsboven op + Maken. Via Configureren stel je alles handmatig in, maar via Maken kan het ook ‘al converserend’. Beschrijf kort wat je GPT moet doen en voor wie. Laat de tool een naam en profielfoto voorstellen en beantwoord de vragen om toon en werking af te stemmen. Test je GPT in de preview en ga daarna naar Configureren, waar je naam, beschrijving, instructies en gespreksopeningen ziet. Bij Kennis kun je bestanden uploaden zodat je GPT ook informatie uit je eigen documenten haalt. Via Nieuwe handeling maken koppel je eventueel acties aan externe API’s, gebruik alleen API’s die je vertrouwt. Bevestig met Maken en bepaal hoe je je GPT deelt: Alleen ik, Iedereen met de link of GPT-winkel (in een zelfgekozen categorie). Rond af met Opslaan. Je kunt de link (https://chatgpt.com/g/<code><naam>) daarna kopiëren en verspreiden. Via GPT’s / Mijn GPT’s kun je eerder gemaakte GPT’s bewerken of verwijderen.

Je kunt ook je ook eigen ‘chatbots’ (GPT’s) ontwerpen, gebruiken en met anderen delen.

Poe biedt ook geavanceerdere mogelijkheden als een Server bot-type (waarmee je ook andere API’s kunt aanroepen). Via Knowledge base kun je verder eigen informatiebronnen toevoegen waaruit de bot kan putten. Voor complexere bots gebruiken we toch liever het no-code platform Coze (www.coze.com) dat veel extra opties kent. Meld je aan met je Google-account, klik op + Create in de linkerkolom en daarna op + Create bij Create agent.

Coze

Coze gebruikt de term agent in plaats van bot om duidelijk te maken dat je er een digitale assistent mee kunt maken die niet alleen met een AI-model antwoorden geeft, maar ook geheugen of context kan gebruiken en meerdere kanalen kan bedienen, zoals een website of een Discord-server, maar zover gaan we hier niet.

Vul een passende naam voor je bot of agent in en schrijf een korte maar duidelijke omschrijving, bijvoorbeeld “Deze bot haalt allerlei informatie uit onze eigen documenten rond computerbeveiliging.” Laat Personal geselecteerd bij Workspace en klik linksonder op het knopje om een geschikt pictogram te uploaden of klik op het sterretje om er een te laten genereren. Klik daarna op Confirm.

De start van je eigen AI-chatbot (of agent) in Coze.

Uitwerking

Je komt nu in je dashboard waar je de bot verder vorm kunt geven. Ontwerp de persona door in het linkerdeelvenster een uitvoerige omschrijving van de bot in te vullen. Optimaliseer deze omschrijving snel met het blauwe knopje Auto Optimize prompt rechtsboven. Na bevestiging met Auto-optimize werkt Coze meteen een geoptimaliseerde prompt uit voor de persona. Klik op Replace om deze te gebruiken. In het rechterdeelvenster kun je je bot direct testen. De antwoorden komen uit de kennisdatabank van het geselecteerde model (zoals GPT-4o).



Wil je dat de bot ook uit eigen bronnen put, dan moet je deze eerst uploaden. Dit doe je in het middelste deelvenster, bij

Knowledge, waar je uit Text, Table en Images kunt kiezen. Klik op het plusknopje bij bijvoorbeeld Text en daarna op Create knowledge. Selecteer Text format en geef een naam aan je informatiebundel. Je kunt data ophalen uit bronnen als Notion of Google Doc, maar wij kiezen voor Local documents om eigen bestanden te uploaden. Klik op Create and import en versleep de gewenste documenten naar het venster. Klik daarna op Next (3x) en wat later zijn je documenten verwerkt. Rond af met Confirm en met Add to Agent rechtsboven. Je vindt je informatiebundel nu terug bij Knowledge en de bot put voortaan (ook) uit deze gegevens.

Om je bot beschikbaar te maken, klik je rechtsboven op Publish en daarna op Confirm. Je kunt hem op diverse platformen publiceren, onder meer in de Coze Agent Store. Selecteer een passende categorie en bevestig met Publish.

Laat AI je helpen bij het ontwerpen van een optimale persona.

Extra's

Daarnaast biedt Coze nog diverse andere nuttige opties, zoals talrijke plug-ins. Klik hiervoor op het plusknopje bij Plugins of gebruik het A-knopje om automatisch geschikte plug-ins te laden op basis van je persona-beschrijving. Deze kun je meteen inzetten, eventueel na optimale afstelling via het tandwielpictogram.

Je kunt de functionaliteit van je bot eenvoudig uitbreiden met talrijke plug-ins.

API-sleutels

No code-platformen als Poe en Coze zijn handig, maar wil je meer flexibiliteit en schrik je niet terug voor enige basiscodering, dan werk je beter met de API van een AI-model. Deze fungeert als tussenpersoon die je script en de AI-dienst laat communiceren via een set regels en commando’s. We gaan uit van de API van OpenAI (GPT) en maken eerst een sleutel aan om de API-interface te gebruiken. Ga naar https://platform.openai.com/api-keys, meld je aan met je account (zoals Google) en klik op +Create new secret key. Geef de sleutel een naam, bijvoorbeeld aibot, en klik op Create secret key. Klik daarna op Copy en bewaar de sleutel op een veilige plek. Rond af met Done: de sleutel is nu toegevoegd. Je kunt deze hier op elk moment ook weer intrekken.

Je hebt een sleutel nodig om de API te kunnen gebruiken.

Interactie

Een snelle manier om een script te maken dat deze API aanroept, is via het gratis Google Colab (https://colab.research.google.com), een online notitieboek voor Python. Meld je aan met je Google-account, klik op + Nieuw notebook of ga naar Bestand en kies Nieuw notebook in Drive, en geef het ipynb-bestand (Interactive PYthon NoteBook) een zinvolle naam. Het notebook wordt automatisch in je Google Drive bewaard en is bereikbaar via het pictogram met de oranje cirkels.

Klik nu op + Code voor je eerste codecel, waarmee je de OpenAI-bibliotheek installeert:

!pip install openai

Voer dit uit met het pijlknopje en klik vervolgens op + Code voor de tweede cel met de volgende code:


from openai import OpenAI

client = OpenAI(api_key="<je_API-sleutel>")

response = client.chat.completions.create(

    model="gpt-3.5-turbo",

    messages=[{"role": "user", "content": "Wat weet je over Haarlem( Nederlands)?"}]

)

print(response.choices[0].message.content)


Je laadt hierbij eerst de geïnstalleerde Python-bibliotheek en zet je geheime sleutel in de clientconfiguratie. Vervolgens stuur je een chataanvraag naar OpenAI en bewaar je het antwoord in de variabele ‘response’. Vervolgens haal je de tekst van het (eerste) antwoord op en druk je dit af in de uitvoer van de code-cel.

Een eenvoudige interactie tussen je script en GPT via de API.

Eigen chatbot

 We gaan nu een stap verder en maken er een heuse chatbot van die via een while-lus een doorlopend gesprek kan voeren:


from openai import OpenAI

client = OpenAI(api_key="<je_API-sleutel>")

messages=[

    {"role":"system","content":"Je beantwoordt elke prompt leuk, maar correct, met een rijmschema zoals ABAB of ABBA"}]

while True:

  user_input=input("Jij:")

  if user_input.lower() in ["stop","exit","quit"]:

    break

  messages.append({"role":"user","content":user_input})

  response=client.chat.completions.create(

      model="gpt-4o",messages=messages)

  bot_reply=response.choices[0].message.content

  print("Bot:",bot_reply)

  messages.append({"role":"assistant","content":bot_reply})


Zolang de gebruiker geen stopwoord invoert, blijft de lus actief. De bot antwoordt in de stijl en taal die je zelf hebt vastgelegd in de systeemrol (zie coderegel 3). Met de methode-aanroep messages.append voeg je telkens een nieuw bericht van zowel de gebruiker (user) als de bot (assistant) toe aan de gespreksgeschiedenis.

Mocht je ergens een fout hebben gemaakt in je script, dan is de kans groot dat je via de knop Fout uitleggen nuttige feedback krijgt en met de knop Accepteren (en uitvoeren) de fout zelfs automatisch kunt laten verbeteren.

In het kader ‘Mooi gepresenteerd’ lichten we kort toe hoe je dit script bijvoorbeeld ook op een eigen webpagina kunt laten draaien.

Onze rijmende chatbot wordt wakker geschud vanuit Colab.
Mooi gepresenteerd

Je Colab-script werkt, maar het oogt niet fraai en je wilt het natuurlijk mooi gepresenteerd met anderen delen. Dit doe je het makkelijkst met Gradio, een opensource-Python-bibliotheek waarmee je snel een webinterface rond je script bouwt. Installeer en importeer daarvoor eerst Gradio in je Colab-omgeving:

!pip install -q gradio

import gradio

Via www.kwikr.nl/colabcode vind je de code (als py-bestand) waarmee je rond het Colab-script met Gradio een eenvoudige webinterface genereert. Deze verschijnt in je Colab-omgeving, maar je krijgt ook een publieke url te zien waar je de interface rechtstreeks kunt openen (https://<code>.gradio.live).

Dankzij de volgende aanroep in de laatste coderegel kunnen bezoekers van deze webpagina je chatbot-script ook als PWA-app op hun pc bewaren en starten:

demo.launch(share=True,pwa=True)

Een alternatief is deze webpagina via een <iframe>-instructie in de html-code van je eigen site op te nemen:

<iframe src=https://<code>.gradio.live></iframe>

Gradio heeft een eenvoudige webinterface gecreëerd voor ons chatbotscript.