Hoofdstuk 6 · Les 6.5
Aan de slag: maak je eigen website
Pak je eigen materiaal of idee. Laat AI een eerste website maken, open die en probeer wat je ermee kunt.
Maak iets waar jij wat aan hebt.
Eén bestand, één doel en een eerste werkende website. Open je chatbot naast deze les; je kunt de stappen tijdens het bouwen erbij houden.
Wil je je verder verdiepen? Bekijk de cursus en de drie tracks hieronder.
Pak je materiaal en kies wat je wilt maken.
Je hoeft geen groot project te beginnen. Een klein, bruikbaar onderdeel is genoeg.
Pak een samenvatting, een hoofdstuk of je aantekeningen. Kies een klein onderwerp waarmee je wilt oefenen of dat je beter wilt begrijpen.
Bijvoorbeeld: twee begrippen naast elkaar zetten, een proces stap voor stap bekijken of oefenen met situaties uit mijn lesstof.
Laat de eerste versie maken.
Gebruik je eigen bestand of beschrijf je idee en stuur de opdracht in je chatbot. Beantwoord eventuele vragen en open daarna de preview of het geleverde HTML-bestand in je browser.
Bekijk de volledige prompt
Maak een kleine, interactieve website waarmee ik de inhoud van mijn bijlage kan leren. Laat de uitleg en de interactie passen bij wat ik moet kennen of kunnen; kies niet automatisch voor flashcards of een quiz.
Begin klein: één onderwerp of projectonderdeel en één centrale interactie. Gebruik leesbare tekst, duidelijke knoppen en een indeling die ook op een telefoon werkt. Maak een zelfstandig HTML-bestand met de vormgeving en interactie erin; voor deze eerste versie zijn geen account, database of externe diensten nodig.
Gebruik Lesmateriaal.pdf als inhoudelijke bron. Baseer uitleg, voorbeelden en eventuele oefenvragen op die leerstof. Maak duidelijk wanneer je een eigen voorbeeld toevoegt. Vraag eerst naar mijn schoolniveau en leerjaar als je die nog niet weet. Ontbreekt de bijlage of kun je die niet lezen? Vraag dan eerst om het bestand en wacht daarop. Gebruik ik een andere bestandsnaam, laat mij dan aangeven welk bestand je moet gebruiken.
Bekijk eerst mijn materiaal en mijn bedoeling. Ontbreekt belangrijke informatie over het onderwerp, de bezoeker of de gewenste functie? Stel dan maximaal twee gerichte vragen en wacht op mijn antwoord. Is het duidelijk genoeg, maak dan de eerste werkende versie. Toon die in een preview als dat kan en lever de complete website als index.html om te bewaren en in mijn browser te openen. Lukt een download niet in deze omgeving, geef dan de volledige HTML en leg kort uit hoe ik die als index.html opsla. Vertel welke functie ik als eerste kan uitproberen. Voer nog geen publieke publicatie uit.
Heeft je AI-omgeving een eigen websitefunctie? Die kun je ook gebruiken. Zorg vooral dat je de site echt kunt openen en uitproberen.
Klik zelf door je website.
Een mooi scherm zegt nog niet of alles werkt. Doe deze vier dingen met je eigen site. Je kunt ze hier voor jezelf afvinken.
0 van 4 geprobeerd · dit is je eigen werkhulp, geen extra quiz.
Vraag één verbetering. Zeg ook wat moet blijven.
Stuur dit vervolgbericht in dezelfde chat. Werkt iets niet, beschrijf dan wat je aanklikt, wat er gebeurt en wat je verwacht. Een screenshot kan helpen om het aan te wijzen.
Vul beide velden in. Dan verschijnt hier je complete, kopieerbare vervolgbericht.
Open de nieuwe versie en probeer dezelfde handeling opnieuw. Werkt de aanpassing en staat het goede er nog? Bewaar dan deze versie. Wil je delen, kies daarna bewust tussen het bestand doorgeven of een website via een bereikbare link.
Kies hoe ver je wilt bouwen.
In Vibe Coden voor Docenten leer je uitgebreider websites en apps bouwen met AI. De voorbeelden zijn voor docenten; de bouwstappen kun je ook voor je eigen schoolproject gebruiken.
Open Vibe Coden voor Docenten (opent in een nieuw tabblad)Voor je eerste website is Basis een goed startpunt.
Basis
Bouw een eenvoudige HTML-website. Leer de stijl verbeteren, afbeeldingen toevoegen en je website testen en delen.
Een logisch vervolg op dit hoofdstukBekijk Basis (opent in een nieuw tabblad)Verder dan één HTML-bestandGevorderd
Een grotere app maken en een database koppelen, zodat je gegevens kunt opslaan en later terugvinden.
Een app met gegevensopslagBekijk Gevorderd (opent in een nieuw tabblad)AI in je eigen appExpert
Een AI-functie toevoegen, bijvoorbeeld een knop die uitleg of feedback maakt. Met aandacht voor veiligheid en kosten.
Een app die zelf AI gebruiktBekijk Expert (opent in een nieuw tabblad)De cursus is gratis. Voor sommige opdrachten is een betaalde AI-tool of AI-tegoed nodig. Overleg daarover met je ouder of school. De vervolgcursus is optioneel en telt niet mee voor je voortgang hier.
Vraag of ervaring delen
Vragen en ervaringen
Denk verder over deze les
Stel een vraag, deel je ervaring of help een andere leerling op weg. Alleen ingelogde leerlingen en bevoegde beheerders kunnen meelezen.
Reacties zijn alleen zichtbaar met een leerlingenaccount.
Deel geen privégegevens. Reacties zijn alleen zichtbaar voor ingelogde leerlingen en bevoegde beheerders van AI Voor Leerlingen.