Mon workshop sur Firebase, passer d’apprenant à animateur.
Mon premier Workshop
J’ai réalisé mon premier workshop au sein de ma formation BeCode. Le but, pour moi, était de voir si j’avais bien assimilé Firebase et de pouvoir l’apprendre à d’autres personnes qui ne connaissaient pas.
J’ai commencé par quelques slides(fait à partir de Google Slide) pour présenter ce qu’est Firebase, puis nous avons été sur mon repo GitHub, pour suivre le parcours que j’avais créé.
J’ai présenté notamment ce que nous allions faire, Realtime Database, Storage et Authentification. J’ai également survolé les autres composants qui composent Firebase. (Firestore, Hosting, Cloud Functions et ML Kit)
Nous avons ensuite commencé le parcours en commençant par créer notre Base de données, la configurer en la liant à notre projet. Dès ce moment là, les premiers problèmes sont apparus, notamment pour installer Firebase sur l’ordinateur avec la commande npm (npm install — save firebase). Heureusement on a vite trouvé comment l’arranger avec un simple “npm init”.
Petite précision, tous les exercices avaient comme consigne d’être fait en pur JavaScript.
Firebase Realtime Database
J’ai ensuite proposé aux participants un premier exercice sur RealTime Database : créer des objets sur Firebase même. Cela avait pour but de pouvoir prendre en main l’interface et comprendre vite fait comment fonctionne une DB en NoSQL.
Ensuite j’ai demandé aux apprenants d’afficher les données dans la console, tout simplement parce que c’était le plus simple pour débuter. Par après je leur ai demandé d’afficher les données directement sur la page HTML (en pur JavaScript, ex : “createElement”). Ce fût assez compliqué pour tout le monde de prendre en main la Doc de Firebase, surtout parce que dans mon repo, je parle de ‘const’ tandis que la doc parle de ‘var’! Les apprenants se sont tous entraidés, heureusement car ce n’était pas si facile pour commencer, arriver à suivre le parcours et aller le plus loin possible en moins de 8 heures.
Nous avons par après commencé le deuxième exercice: ajouter, modifier et supprimer des données.
J’ai fait du live coding pour expliquer une manière de faire, pour expliquer ma façon d’arriver au résultat demandé.
Nous en avions enfin fini avec Realtime Database, ce fût plus long et laborieux que prévu. Moi qui pensais avant de commencer que je n’avais pas assez de contenu, je me suis bien trompé. C’était vraiment compliqué d’expliquer ce que j’avais en tête pour que cela fonctionne. Un bon exercice en tout cas, si on souhaite devenir coach, formateur , etc …
Firebase Storage
Nous avons continué le parcours pour arriver à l’exercice du composant Storage. J’ai expliqué ce que c’était, comme quoi Storage était utilisé pour télécharger les images et vidéos. J’ai expliqué aussi qu’on devait modifier les règles pour pouvoir télécharger sans avoir de problèmes. J’en ai profité pour expliquer ce qu’étaient les règles sur Firebase.
J’ai complexifié l’exercice, car je trouve l’utilisation de Storage simple, surtout après avoir utilisé Realtime Database.
De base Storage ressemble fort à Realtime Database et vu qu’on venait de le faire j’ai voulu rendre l’exercice bien plus compliqué, déjà pour voir si ils avaient compris ce qu’on venait de faire et aussi pour revoir un peu de JavaScript. Détail amusant: dans cet exercice, la barre “progress” a intéressé plus de monde que Storage.
Comme exercice, l’HTML étant fourni, je leur ai demandé que la barre “progress” se remplisse par rapport à l’upload. Bien sûr l’image devait également rejoindre la DB Firebase.
Firebase Authentification
J’avais prévu deux exercices, Login avec Email & Password, l’autre via Single Sign-on, avec Facebook, Google et GitHub.
J’ai expliqué comment activer le mode de connexion Email&Password et ensuite tout le monde a commencé l’exercice.
L’exercice était d’abord de rajouter manuellement via l’interface Firebase un utilisateur et puis de se connecter. Par après, il fallait que le bouton “Log In” disparaisse quand on se connecte et que le bouton “Log Out” apparaisse et vice-versa.
Malheureusement, par manque de temps on n’a pas pu faire le second exercice mais on avait déjà fait énormément. Le deuxième exercice était de se logguer avec Facebook, Google et GitHub.
Conclusion
Un facteur très intéressant que j’ai découvert pendant ce workshop, c’est la fatigue mentale et physique. Pas du tout à cause des apprenants, c’est surtout le fait d’apprendre aux autres. De faire comprendre ce qu’on a en tête et aussi d’essayer de trouver les mots adéquats. C’est surement le plus compliqué, car quand toi tu as compris, comment faire en sorte que les autres comprennent également. Les gens ne sont généralement pas dans ta tête quand tu veux expliquer quelque chose.
Sincèrement comme je l’ai déjà dit plus haut, au début je pensais ne pas avoir assez de contenu. Je me suis vite aperçu que devoir gérer le code de 16 personnes différentes, leurs problèmes et leurs questions c’est vraiment fatiguant. Il fallait également que je me fasse entendre dans la salle, qu’on comprenne ce que je montrais et expliquais. Je faisais souvent des petits tours dans la pièce pour savoir si tout allait bien. Donc oui, quand j’ai créé ce workshop, je pensais l’avoir écrit pour que tout le monde puisse comprendre mais que finalement, c’était pas si facile que ça, je vais évidemment encore l’améliorer et le rendre plus abordable.
Les nombreux retours que j’ai eus depuis, vont m’aider à le rendre plus abordable, je compte également le faire traduire en “Japonais” et “Anglais” par un ami. Désireux de partir travailler à l’étranger, je pense que c’est une bonne façon de prouver ma motivation et ma détermination.
Dans tous les cas, ce fût une très bonne expérience, éreintante, amusante et instructive.
Merci à tous pour votre participation et pour la bonne ambiance.
