Date de sortie : 2019
Genre : Programmation et developpement.
Ca y est , comme son nom l'indique, dans ce cours jаvascript debarque dans notre navigateur.
Depuis
le départ, je vous ai dit que nos page web sont composées de 3
langages: HTML pour la structure, CSS pour le style et la mise en page,
et jаvascript pour l'interactivité de nos pages Web
Et
bien justement c'est maintenant que vous allez tout comprendre sur
cette interactivité ! On va commencer par parler de l'objet global:
window, puis de location et surtout on va décortiquer bien comme il faut
ce qu'on appelle le DOM.
DOM
C'est quoi le DOM ?
C'est
la représentation de notre code HTML et c'est lui que jаvascript pourra
manipuler pour modifier le HTML et le CSS de nos pages Web.
Tous
nos éléments HTML sont bien organisés dans le DOM et on pourra modifier
leurs attributs, leur style CSS, leur ajouter ou leur enlever des
classes CSS.
Je
vous montrerai les différentes facons de sélectionner les éléments
éxistants du DOM et aussi comment on va pouvoir en créer de nouveaux
très facilement.
Événements
Et biensur la base de l'interactivité: ce sont les événements: vous pouvez exécuter du code en réaction à un événement.
Par exemple: Quand l'utilisateur clique sur un bouton, appuie sur une touche du clavier ou encore quand il soumet un formulaire.
Alors je vais vous montrer les différentes façons de réagir aux événements: les event handler et les event listener.
Mais
pour bien comprendre tout ça, on va examiner l'objet Event qui posséde
des propriétés particulières en fonction de la nature de l'événement .
On
va voir comment les événements se propagent: on parlera de phase de
bouillonement et de phase de capture. Et aussi comment stopper ou
modifier leur propagation avec les méthodes stopPropagation et
preventDefault.
Requêtes HTTP
Une autre chose dont on va parler: ce sont les requêtes HTTP, c'est ce qu'on appelle Ajax.
Ca
va par exemple nous permettre d'échanger avec un serveur, on pourra
recevoir, envoyer, modifier et supprimer des données de ce serveur.
Un
des gros avantages c'est qu'on pourra traiter les données qu'on
récupére directement en jаvascript et mettre à jour uniquement certains
éléments de notre page Web sans avoir à recharger toute la page.
Une des façons pour un serveur d'être capable d'intéragir avec ces requêtes c'est d'utiliser ce qu'on appele une API REST.
D'ailleurs
on va en utiliser une et je vous montrerai comment récupérer des infos
avec les requêtes GET et comment en envoyer avec les requêtes POST.
Objet et Fonctions utiles
Alors
ce cours c'est aussi pour moi l'occasion de parler tout ce dont on n'a
pas parlé jusqu'à présent et qui fait partie intégrante de jаvascript.
Je vais vous parler de l'objet Math, de l'objet Date, des expressions regulières.
On
va revenir sur les méthodes setTimeout et setInterval. Je vais vous
présenter aussi l'opérateur ternaire et on passera en revue les
fonctions qu'on peut appliquer sur les strings mais surtout sur les
arrays: comme map, filter, etc.
Bien evidemment pour chacune de ces parties, vous pourrez tester vos connaissances avec des quiz.
World Bucket List
Et
alors une fois qu'on aura fini tout ça: ce sera l'heure du dessert, de
la cerise sur le gâteau de ce cours. On va réaliser ensemble un projet
génial de A à Z. Vous allez mettre en pratique tout ce que vous avez
appris directement dans ce projet.
C'est
parti pour le rêve ! Créons ensemble l'appli World Bucket List. Pour
ceux qui ne le savent Bucket List c'est une liste de choses qu'on
souhaite faire.
Et
bien vous allez créer la votre et vous allez situer vos rêves sur la
carte du Monde ! On va utiliser l'API de Google Map pour pouvoir faire
des choses fantastiques. Vous allez localiser vos rêves: Maison sur
Pilotis aux Maldives, Safari au Kenya, Monter sur la Tour Eiffel.
Grâce aux événements, vous pourrez automatiquement zoomer sur un de vos rêves en cliquant sur les marqueurs de la carte.
Vous
pourrez aussi intéragir avec vos rêves en indiquant ceux que vous avez
déja réalisé et ceux que vous souhaitez encore réaliser: Qui a dit qu'on
pouvait réaliser ses rêves qu'une seule fois ?
Et
pour une meilleure immersion, vous allez aussi coder la visite
interactive de vos rêves grâce à Google Street View. C'est-à-dire qu'on
pourra se balader à l'intérieur de vos rêves quasiment comme s'y on
était.
Bref,
je peux vous en parler encore longtemps: ce projet est tout simplement
magique ! Et vous allez voir que même si ça parait impressionnant, vous
allez y arriver très facilement, étape par étape je vais tout vous
expliquer.
Bon vous êtes prêts, allez c'est parti !
À qui ce cours s'adresse-t-il ?
Toute personne qui souhaite comprendre comment jаvascript intéragit avec notre Navigateur
download
0 التعليقات:
إرسال تعليق