Semaine 4 : un peu de JS, beaucoup de jQuery - SimplonSt-Gaudens/programme-web-dev-promo-2 GitHub Wiki
Semaine 4
Objectifs
- Revoir les bases de Js
- Réaliser un programme complet
- Se faciliter la vie avec jQuery
Lundi
Veille de la semaine
- Mercredi : Materialize (CSS)
- Vendredi : SEO
- Lundi prochain : Pug.js
Kata
En Javascript, écrire une fonction “masquer()” telle que :
- 1 string en entrée
- remplace tous les caractères sauf les 4 derniers par “#”
Quelques notions essentielles pour la suite
Les types en Js
Dans l'adresse du navigateur, tapez about:blank Ouvrir la console dév.
var a = "hello"; a; typeof a;
var b; typeof b;
var c = function(){}; typeof c; typeof c();
var d = function(){return 1;}; typeof d; typeof d();
var e = function(){return "hello";} typeof e();
typeof 1; typeof "1";
1 === "1" 1 == "1"
La coercition
Exercice : créer une fonction qui prend deux objets en entrée et écrit dans la console si leur type est * identique ou pas.
- pareil(2, 3); // le type est le même
- pareil(2,"2"); // le type est différent
Manipuler le DOM
- Présentation
- Tester en ligne : HyperDev!
- http://www.w3resource.com/javascript-exercises/javascript-dom-exercises.php
Exercices
- La calculatrice node.js
- Le retour du CV : reprenez votre CV, complétez-le et profitez d'un framework CSS au choix pour le rendre plus beau.
Rendez tout ça pour dimanche minuit.
Mercredi
jQuery, c'est parti!
Attention! Au cours de vos explorations pour vous former à jQuery, on vous parlera souvent d'AJAX. Pour l'instant, ne prêtez pas attention à cela. On en parlera plus tard.
Pourquoi jQuery?
- Un framework pour ne pas réinventer la roue
- Faciliter la compatibilité avec les navigateurs
- Rajouter des animations
- Manipuler le DOM plus facilement
- Avoir des outils pour les formulaires
Plein de liens!
- Présentation
- En bref
- Codecademy
- Site de référence
- Tutoriels pour jQuery
- openclassrooms est toujours votre ami (pas autant que google mais presque)
- RTFM : l'API jQuery
- Mémento jQuery
Debug
Exercices à rendre dimanche
Révisions
Vendredi
Le moment rassurant
Randori
En Javascript, écrire une fonction “maxEtMin()”telle que :
- 1 string constitué de chiffres séparés par des espaces en entrée
- renvoie un string contenant le nombre le plus haut ainsi que le plus bas
Exemple
- maxEtMin("1 2 3 4 5"); // return "5 1"
- maxEtMin("1 2 -3 4 5"); // return "5 -3"
- maxEtMin("1 9 3 4 -5"); // return "9 -5"
C'est beau, ça bouge : jQuery UI
Vous pensez pouvoir utiliser cela pour vous faciliter la vie sur les exercices à rendre cette semaine?
UX? UI?
Exercices à rendre dimanche
Lecture
- Cycle de vie du dev
- Et si vous n'aviez pas besoin de jQuery?
- L'auto-complétion dans votre terminal!
- Marre de saisir vos login/mdp pour github?
- Petit récap sur les fonctions javascript
- Du javascript partout
- Encore plus de javascript
- Et toujours des tutos!
- Awesome!
- Des tonnes de cours gratuits en vidéo sur Khan Academy