larlet-fr-david/david/blog/2014/cours-iut-javascript-jquery/index.md

title: Cours IUT : Javascript et jQuery slug: cours-iut-javascript-jquery date: 2014-11-29 chapo: On passe maintenant à du dynamique avec Javascript et jQuery (imposé).

Le jour où l’on chercha à imposer l’enseignement obligatoire au Tibet, on se heurta à la résistance des femmes.
— Mais ils sont fous ces hommes, de vouloir enlever nos enfants pour les instruire à un âge où ils ont tant de choses à apprendre. Instruire signifie imposer des idées qui ne sont pas celles des enfants. C’est une offense au droit de vivre de l’enfant. Dans une culture qui n’est pas notre culture occidentale, un enfant n’appartient pas à ses parents. La tradition veut qu’il soit donné dès sa naissance à l’Univers (qui est vie et mort) et le respect que les parents lui doivent est fait du même respect qu’ils doivent à leurs ancêtres.
— Tu peux, dit-on aux parents, donner aux enfants ton amour, mais non tes idées. Tu peux enfanter leur corps mais non leur âme. Tu peux essayer de devenir comme eux, mais tu ne peux exiger qu’ils deviennent comme toi, car la vie est projet et non retour vers le passé.

Préface de Libres enfants de Summerhill, Maud Mannoni

Plutôt satisfait du déroulé du dernier cours qui a gagné en fluidité et en échanges. J’ai pour l’instant une personne en grande difficulté mais motivée, une personne qui s’en fout, une autre qui fait ses trucs dans son coin et les 21 autres qui progressent tant bien que mal avec plus ou moins de motivation.

On passe maintenant à du dynamique avec Javascript et jQuery (imposé). J’hésite encore à tout faire en utilisant ES 6, je compte leur laisser le choix. Mes objectifs pour cette introduction :

• comprendre la console et le scope, en expliquant “use strict” et les IIFE (function(){ /* code */ }());
• comprendre l’écoute d’événements, avec addEventListener('action', fonction)
• savoir utiliser les sélecteurs natifs et jQuery, via document.getElementsByTagName, document.getElementsByClassName, document.querySelectorAll et document.querySelector vs. $('')
• savoir utiliser les manipulations du DOM, via .innerHTML et peut-être document.createDocumentFragment vs. .append('')
• savoir modifier des classes CSS, via el.classList.add/remove/contains vs. $(el).addClass/removeClass/hasClass
• savoir modifier des propriétés CSS, via el.style.property = 'foo' vs. $(el).css({ property: 'foo' })

Je ne compte pas aller vers des concepts de type programmation fonctionnelle avec les map, reduce, filter et compagnie faute de temps et de niveau. Je ne vais pas non plus essayer de jongler entre les animations jQuery et ce que l’on peut faire maintenant en CSS. Quelques liens pour approfondir :

• jQuery, c’est bien, le DOM moderne, c’est mieux !
• Ditching jQuery for Vanilla JS
• Native equivalents of jQuery functions
• Replacing jQuery with Vanilla JavaScript
• Native JavaScript Equivalents of jQuery Methods

Il faut aussi que je leur donne quelques tricks pour Sublime Text qui leur a été imposé par le précédent intervenant et la série des awesome pour HTML 5, CSS et Javascript. Et que je me retienne de les assommer de liens :-).

Il serait peut-être temps de leur parler de ces billets de blog comme ressources pour garder une trace et des liens en plus de leur travail en groupe. Je ne voudrais pas leur spoiler les cours non plus vu que je publie à l’avance… peut-être faire un point sur la curiosité et le googling de leurs profs ? Ou pas, si ça se trouve certains me lisent déjà.