Portfolio opdracht verhaalgenerator: deel 1
Volg de video en codeer mee
In deze video leggen we de basis voor de mappen, bestanden en plaatsen we de basis structuur in de HTML.
Portfolio opdracht verhaalgenerator: deel 2
Volg de video en codeer mee
In deze video plaatsen we de content in de HTML.
Portfolio opdracht verhaalgenerator: deel 3
Volg de video en codeer mee
In deze video doen we de CSS!
Portfolio opdracht verhaalgenerator: deel 4
Volg de video en codeer mee
Nog meer CSS! Responsive design.
Portfolio opdracht verhaalgenerator: deel 5
Volg de video en codeer mee
De functionaliteit! Javascript voor de generator.
Een leuk Javascript voorbeeld
Typ dit in de console in je browser:
let naam = 'john doe'
naam = prompt('Wat is je naam?');
let karakterLowerCase = naam.charAt(0).toLowerCase()
if (karakterLowerCase == 'a' || karakterLowerCase == 'b' || karakterLowerCase == 'c') {
alert('Hoi ' + naam + '. Jij mag in het groepje ABC samen met Albert, Claes en Bert')
} else if (karakterLowerCase == 'd' || karakterLowerCase == 'e' || karakterLowerCase == 'f' ) {
alert('Hoi ' + naam + '. Jij mag in het groepje K samen met Maria Melanie en Maarten')
} else {
alert('Hoi ' + naam + '. Jij mag in het groepje overig met Quintin en Zoof');
}
Het verhaal:
<h1>${hoofdrolSpeler}: de ${bijvn1} Boeddha</h1>
<p>
Er bestaat een japans verhaal over de ${bijvn1} Boeddha. Zijn hele leer bestond uit lachen en hij riep vaak ${benadrukken1}!
Hij ging vaak midden op de ${locatie1} staan en begon dan ${bijvn3} te lachen. Vaak nam hij zijn ${object1} mee en liep er vrolijk mee rond. Hij had een grote ${bijvn2} kop.
Als de Boeddha lachte schudde zijn ${bijvn3} ronde buik heen en weer!
<br><br>
De ${bijvn1} Boeddha had twee kale ${bijvn4} monniken in de leer. 1 van de monniken is nog aan de start van de training, hij heeft nogal moeite met lachen! ${karakter1} de ${bijvn5} monnik.
De andere monnik heet ${karakter2} de ${bijvn6}. Beiden kijken ze erg op tegen de ${bijvn1} Boeddha en zijn graag in zijn aanwezigheid.
<br><br>
De lessen van de ${bijvn1} Boeddha zijn altijd kort maar krachtig. Hij sprak geen woord en beantwoorde alles met een lach!!
Zelfs zei hij niks toen de ${bijvn5} monnik perongeluk de ${object2} kapot had gemaakt! Hij keek even verbaasd en begon te lachen. Als je de Boeddha vraagt over verlichting, dan antwoord hij met een lach.
Als je hem vraagt over de waarheden van het universum dan ook beantwoord hij met een ${bijvn1} lach!
<br><br>
Vandaag zijn ze alle drie op de ${locatie2} te vinden. En lopen ze lachend rond zelfs ${karakter1} de ${bijvn5} monnik lukt het vandaag aardig om een beetje mee te lachen! Hij heeft veel geleerd de afgelopen weken!
De mensen op de ${locatie2} zijn bekend met de ${bijvn3} lach van de ${bijvn1} Boeddha en kijken vrolijk toe! Het hele dorp is hierdoor altijd vrolijk! Veel mensen lachen mee en roepen de Boeddha en monnik na met
${benadrukken1} en ${benadrukken2}!
<br><br>
Lachen is belangrijk!
</p>
Project files
Stel vragen en help medestudenten
Tijdens de live lessen zijn er opdrachten waarbij je zult samenwerken met jouw studiegenoten. Hiervoor gebruiken wij Discord. Daarnaast kun je ook jouw vragen stellen, de docenten zullen je vervolgens verder helpen.
Het kanaal voor deze cursus op onze Discord:
portfolio-cursus