JavaScript Superheroes – workshop-uri de dezvoltare web pentru elevi de liceu

Este un erou de care nu ai auzit. Este un erou de care nu știi că ai nevoie. Este un erou pe care toți îl merităm: JavaScript.

Anul acesta Codette a primit finanțare prin intermediul programului Google Educator PD pentru a aduce mai aproape tehnologia în cadrul sistemului de învățământ. Cu ajutorul primit de la partenerii noștri – JSLeague, JSGirls, ngBucharest, am organizat în această toamnă două dintre cele cinci workshop-uri cu tema dezvoltare web cu ajutorul JavaScript, iar celelalte trei vor avea loc în prima jumătate a anului 2019. Nu este prima oară când Codette a primit finanțare prin Google Educator PD, în 2018 am avut Codette goes Mobile – serie de workshopuri pe dezvoltare aplicații mobile cu Android și Java.

Superlogo-ul workshop-urilor

Activitatea s-a desfășurat în timpul weekend-urilor, sâmbăta și duminica, adresându-se atât elevilor de liceu, cât și profesorilor. Primele două workshop-uri au avut loc la Colegiul Național “Gheorghe Munteanu Murgoci” din Brăila și Liceul Teoretic “Grigore Moisil” din Timișoara. În cele două zile de training am lucrat în ritm alert cu peste 20 de elevi per workshop, participanții dovedindu-se activi și dornici să învețe. Iată cum a decurs fiecare zi, ce am aflat și cum ne-am distrat. 

 

Fizionomia unui workshop JS Superheroes

În prima zi de workshop participanții au învățat bazele dezvoltării web. Trainerii au susținut trei prezentări, prima despre HTML, a doua despre CSS și ultima despre JavaScript și programare orientată pe obiecte. După fiecare prezentare a urmat sesiunea de hands-on, în care participanții au lucrat pe un schelet de cod oferit și au exersat etichetele învățate pentru a crea o pagina web cu super-eroi.

Trainer implicat, cu capă invizibilă de supererou

Aplicația pe care s-a lucrat în prima zi conține trei super-eroi, iar utilizatorul poate să navigheze între ei prin intermediul unor butoane. Pagina unui erou cuprinde informații despre acesta, cum ar fi o scurtă descriere, liste de aliați și inamici, dar și abilitățile sale. Participanții au organizat informația cu ajutorul etichetelor HTML urmând apoi să stilizeze conținutul și să adauge o animație în CSS. Logica din spatele aplicației și schimbarea de la un erou la altul sunt făcute în JS. La finalul zilei am avut suficient timp pentru a completa și un bonus: un super-erou care zboară pe ecran la încărcarea paginii.

Merge bine.

Ziua a doua a început cu o recapitulare a conceptelor învățate anterior, pentru că elementele din ziua precedentă urmau să fie folosite și duminică. Printre răspunsurile corecte se vedea entuziasmul liceenilor la gândul că vor continua să învețe ceva nou. Aceștia au făcut față cu brio celei de-a doua zi, deși avea un conținut mai dificil.

Trainerii au prezentat succint trecerea de la un deceniu de la dezvoltarea clasică, statică, la un model nou de aplicații web reprezentat în cazul nostru de către Angular. În a doua zi am vorbit despre blocurile de la baza acestui framework: programarea orientată pe obiecte, TypeScript și paradigma Model-View-Controller. După acest intro teoretic, dar cu exemple practice, la care ne-am întors de mai multe ori de-a lungul zilei, am pornit serverele locale pe calculatoarele elevilor și aceștia au construit pas cu pas o a doua aplicație despre super-eroi.

Ceea ce ne-a plăcut pe parcursul workshop-urilor este faptul că a existat o comunicare permanentă între participanți și mentori, primii neezitând să pună întrebări până înțelegeau sau să caute pe internet și să ceară ajutor atunci când aveau nevoie. În plus, participanții cu probleme similare se ajutau între ei și împărtășeau unul cu celălalt modalități de rezolvare.

Nobody gets stuck on my watch.
Ai dat refresh?

La workshop-urile noastre, profesorii lucrează cot la cot cu elevii pentru a finaliza cerințele. Aceștia și-au arătat interesul pentru a învăța lucruri noi, fiind deschiși la ideea de a organiza un opțional despre dezvoltarea web. Codette va veni în sprijinul lor cu o broșură educativă ce cuprinde planul de lecții. Între timp, puteti găsi materialele folosite pentru workshop pe Github.

 

Experiența JS Superheroes

Pe durata celor două zile de training, participanții au reușit să construiască o pagina web funcțională și o aplicație în Angular, ambele cu tematica de super-eroi. Pe lângă aceasta, au dobândit multe cunoștințe noi și s-au simțit extrem de bine alături de noi, după cum poate fi observat din feedback-ul primit:

  • A fost o experiență minunată. Aș vrea să se întâmple mai des. (participant la workshop-ul din Timișoara)
  • Am acumulat cunoștințe noi, ceea ce este important în procesul meu de creștere, prin urmare acest workshop în sine a avut un impact mare. (participant la workshop-ul din Timișoara)
  • M-a motivat să lucrez mai mult și să descopăr noi limbaje de programare fiindcă e incitant! (participant la workshop-ul din Brăila)
  • Am reușit să învăț mai multe lucruri într-un timp foarte scurt care sunt sigur că mă vor ajuta atât la școală cât și pe viitor și sper ca voi mai avea de-a face cu acești oameni minunați. (participant la workshop-ul din Brăila)
  • Workshop-ul m-a făcut să mă gândesc la a urma o carieră în domeniul acesta. (participant la workshop-ul din Timișoara)

Pare că muncim foarte mult, nu? Ei bine, este adevărat, dar ne și distrăm pe măsură. Fiecare workshop începe cu un joc de cunoaștere, în cadrul căruia participanții împărtășesc lucruri despre ei, motivați de o recompensă dulce. Astfel, am primit inspirație despre opțiunile de a gestiona un milion de dolari, ne-am amuzat cu fun facts și povești amuzante și am aflat multe lucruri utile, cum ar fi, din seria life hacks, că poți să economisești timp dacă te speli pe dinți în timpul dușului.

Pentru că ne place foarte mult mâncarea, ne-am răsfățat la workshop-uri cu pizza cu cartofi prăjiți. Atenție, imaginea următoare poate să vă provoace foame.

Legendara pizza cu cartofi prăjiți

În timpul celor două zile de workshop am avut multe pauze în care am am luat câte o gustare și am socializat, vorbind despre opțiunile pe care elevii le au referitoare la facultate, despre experiența trainerilor și ultimele tehnologii apărute.

Mai mult decât atât, ne-am dat toată silința să construim o experiență memorabilă, cu muzică de fundal, atmosferă degajată și un schelet de cod suficient de detaliat. Trainerii stăteau cu urechile ciulite pentru a ajuta repede pe orice avea întrebări și a se asigura că toată lumea înțelege cât mai bine noile concepte despre care s-a discutat.

Aici e sesiune de training sau LAN party?

Primele două sesiuni au fost duse la capăt cu o parte din cadrul echipei de traineri și pentru că ei sunt supereroii acestor ediții menționate tam-tam … aceștia sunt:

Silvia Bălan (an 1 – Ingineria Sistemelor, Facultatea de Automatică și Calculatoare)

Irina Bulgaru (an 3 – Ingineria Sistemelor, Facultatea de Automatică și Calculatoare)

Damian Monea (an 2 – Calculatoare, Facultatea de Automatică și Calculatoare)

Andreea Mitran (an 3 – Calculatoare, Facultatea de Automatică și Calculatoare)

Valentin Ioniță (an 2 – Calculatoare, Facultatea de Automatică și Calculatoare)

Carmen Popa (an 2 – Calculatoare, Facultatea de Automatică și Calculatoare)

Diana Vasile (an 4 – Ingineria Sistemelor, Facultatea de Automatică și Calculatoare)

Cristina Titrat (clasa a 12a, Liceul Teoretic Neagoe Basarab Oltenița)

Giorgiana Vlăsceanu (Doctorat, Facultatea de Automatică și Calculatoare)

În încheiere, am avut ocazia să cunoaștem oameni minunați în timpul celor două workshop-uri, de la elevi curioși și entuziasmați, care au dorit să exploreze o posibilă carieră în IT, la profesori prietenoși și comunicativi, care ne arată că niciodată nu este prea târziu să înveți ceva nou. Așteptăm cu nerăbdare viitoarele workshop-uri din această serie și ne dorim să avem un impact pozitiv asupra tuturor participanților. Dacă ești profesor sau elev și dorești să aduci workshop-urile Codette în liceul tău, ne poți contacta lăsând un mesaj la adresa de email hello@codette.ro .

Liceul Teoretic “Grigore Moisil”, Timișoara
Colegiul Național “Gheorghe Munteanu Murgoci”, Brăila
Spread the love