Cours en ligne JavaScript. Développement professionnel des interfaces web - cours gratuit de HTML Academy, formation 9 semaines, date 15 octobre 2023.
Miscellanea / / December 04, 2023
Pourquoi le cours est-il professionnel ?
Dans ce cours, vous apprendrez à réaliser de vrais projets, du même niveau de complexité que dans l'industrie. Et vous les ferez correctement, de sorte qu'après la formation, vous produisez des résultats de haut niveau pour lesquels les entreprises sont prêtes à payer.
À quoi s'attendre pendant la formation
Vies
Des émissions en direct dans lesquelles les enseignants analysent des questions complexes issues de la théorie et de la pratique. Ils ont lieu de 19 à 21 heures, heure de Moscou, l'inscription est disponible le lendemain.
Pratique
Après le cours, vous faites des devoirs dans lesquels vous travaillez sur votre projet et renforcez le matériel de cours.
Révision des codes
Le mentor vérifiera la qualité des missions et partagera son expérience sur la façon de faire mieux.
Section 1 Introduction à JavaScript
Voyons comment fonctionne le cours, de quels outils vous aurez besoin et comment les configurer. Voyons ce qu'est le langage JavaScript, y compris la spécification ECMAScript et le navigateur.
Comment se déroule le cours? Questions d'organisation.
Schéma de travail sur le cours.
Revue des projets.
Critères de qualité.
Langage JavaScript
Spécification ECMAScript.
Que donne le navigateur à JavaScript ?
Bases de JavaScript.
Syntaxe de base: parenthèses, accolades, opérateurs, mots réservés, commentaires.
Les éléments de base sont les variables et les fonctions.
Primitives et types de données complexes.
Outils.
Éditeurs de codes.
Linters.
Serveur de développement.
Section 2 Fonctionnalités JavaScript de base
Commençons par étudier les constructions de base de JavaScript, en particulier les fonctions. Examinons les nuances de la déclaration des variables. Faisons connaissance avec les outils de développement.
Variables.
Zones de visibilité.
Expressions conditionnelles.
Opérateur ternaire.
Commutateur opérateur à choix multiples.
Cycles.
Casting.
Les fonctions.
Fonctions de flèche.
Paramètres de fonction par défaut.
paramètres de repos.
Levage de variables et de fonctions.
Introduction à DevTools (outils de développement).
Section 3 Objets et tableaux
Section sans direct
Vous vous familiariserez avec les types de données complexes: tableaux et objets. Apprenez à les créer et à les gérer.
Types de données complexes.
Tableaux.
Méthodes de tableau de base.
Objets.
Rappels (fonctions de rappel).
Section 4 Objets et fonctions intégrés
Examinons les objets et fonctions qui existent dans le langage JavaScript lui-même. Parlons du contexte d'exécution de ceci. Exécutons et déboguons le code dans la console des outils de développement.
Déstructuration.
syntaxe de diffusion.
Objets intégrés et leurs méthodes.
Chaîne.
Nombre.
Booléen.
Date.
Mathématiques.
Opérateur nouveau.
Fonctions JavaScript intégrées.
Contexte de la fonction.
Le mot-clé est le suivant.
Perte d'environnement.
Outils de développement. Utilisation de la console.
Section 5 Organisation du code
Examinons le concept de portées. Discutons du principe DRY (ne vous répétez pas) et de la façon de l'utiliser pour écrire moins de code tout en faisant plus. Apprenons ce que sont les modules et comment « casser » le code dessus; Qu'est-ce qu'un point d'entrée ?
Zones de visibilité.
Portée globale de la fenêtre.
Fermetures
Modularité.
Réutilisation du code, principe DRY.
Le concept de module.
Point d'entrée.
Modules ECMAScript, syntaxe d'importation et d'exportation.
DevTools: débogage du code à l’aide des sources.
Section 6 DOM et événements
Section sans direct
Vous vous familiariserez avec le modèle objet de document. Modèle Objet de Document ou DOM). Réfléchissez à la façon de décrire les réactions aux actions des utilisateurs: saisie de texte, clic sur certains éléments, défilement, etc.
Arbre DOM.
le document est la racine de tout.
Arborescence DOM.
Rechercher des éléments sur une page.
Gestion des attributs des éléments.
Modèles et données.
Événements sur la page.
Gestionnaires d'événements.
Section 7: Manipulation du DOM
Essayons de créer, supprimer, déplacer et manipuler des éléments DOM. À l'aide de modèles, nous dessinerons les données créées précédemment.
Gestion de l'arborescence DOM.
Gestion des attributs des éléments DOM.
Déplacer des éléments dans l'arborescence DOM.
Approches de création d’éléments DOM.
Création d'objets DOM.
Gestion du balisage: append, prepend, insertAdjacentHTML, innerHTML, textContent.
Modèle.
Modèles de chaînes (chaînes de modèles).
Étiquette spéciale .
Section 8 Travailler avec des événements
Nous gérerons l'interaction de l'utilisateur afin que la page réponde à la saisie de texte dans les formulaires, aux clics sur certains éléments, au défilement, etc. Voyons comment rendre cette interaction accessible.
Événements.
Objet événement, gestion des événements: PreventDefault et stopPropagation.
Phases de l'événement et délégation.
Événements de clavier et accessibilité.
Boucle d'événement.
Validation du formulaire.
Pristine est une bibliothèque de validation de formulaires.
Validation à l'aide d'expressions régulières.
DevTools: capacités d'éléments (inspecteur) pour travailler avec le DOM et les événements.
Section 9 API externes et bibliothèques tierces
Voyons comment ne pas « écrire votre propre vélo », mais réutiliser l'expérience et le code de quelqu'un d'autre. Faisons connaissance avec le concept d'interface logicielle. Application Programming Interface ou API), considérez l'API des bibliothèques JavaScript tierces et l'API JavaScript des services de cartographie. Jetons un coup d'œil rapide aux API que le navigateur fournit aux développeurs.
Notion d'API.
Services de cartographie et leur API JavaScript.
OuvrirStreetMap.
Brochure.
Bibliothèques tierces.
Pourquoi les bibliothèques sont-elles nécessaires ?
Comment se connecter à un projet.
noUiSlider.
Présentation de l'API du navigateur.
Article 10 Réseau
Section sans direct
Vous examinerez vous-même le protocole HTTP et le format de données JSON. Considérez comment l'interaction de l'utilisateur avec le site change lors de l'utilisation du réseau et ce qui peut mal se passer.
Protocole HTTP et formats de données.
JSON.
Gestion des exceptions.
essayez... attrapez.
Outils pour travailler avec les requêtes réseau.
Article 11 Asynchronie. La mise en réseau
Examinons le concept d'asynchronie et comment y parvenir à l'aide de promesses. Promesse, promesse). Faisons connaissance avec les technologies qui permettent d'adresser des requêtes au serveur depuis un navigateur. Voyons comment gérer les erreurs dans la pratique lorsque vous travaillez avec le réseau en cas de problème.
Asynchronie.
setTimeout et setInterval.
Promesse.
Travailler avec le réseau.
récupérer pour contacter le serveur.
Gestion des erreurs dans les requêtes.
DevTools: travailler avec les requêtes réseau dans le réseau.
Première semaine de soutenance
Achèvement des travaux sur le projet et préparation de la soutenance finale.
Section 12 Commentaires et optimisation
Nous optimisons le travail avec les données et les événements sur notre site Web. Nous mettons en œuvre une interface de feedback claire et conviviale.
Travail avancé avec les tableaux.
Tri.
Filtration.
Optimisations des performances.
Suppression d'images - limitation.
Élimination du rebond - anti-rebond.
API de fichiers.
URL.createObjectURL().
Lecteur de fichiers.
Deuxième semaine de soutenance
La première évaluation du projet par le mentor évaluateur selon des critères de qualité.
Troisième semaine de soutenance
Améliorer le projet en fonction des commentaires du mentor évaluateur et le soumettre à une deuxième évaluation.
Article 13 Final
Résumons le cours, puis discutons des fonctionnalités de JavaScript que vous pourriez rencontrer au travail. Le concept de code hérité et que faire avec, avec le code. Jetons un coup d'œil rapide aux outils de développement front-end avancés afin que vous puissiez comprendre où aller ensuite.
JavaScript spécial.
Mode strict « utiliser strict ».
Point-virgules facultatifs.
Code hérité.
jQuery.
var et portée fonctionnelle.
XMLHttpRequest.
Fonctions constructeur.
Prototypes.
Outils avancés.
Webpack.
Transpilers et polyfills.
Babel.
Quatrième semaine de soutenance
Effectuer les modifications finales et recevoir une note finale.
sashascript2022
26.07.2022 G.
Je considère le cours JavaScript. Le développement d’interfaces Web professionnelles est un bon début pour apprendre JavaScript.
Avantages: Matériel actuel, rien de superflu, pas d'eau + les avantages ci-dessus. Inconvénients: C'était très difficile pour moi au début, puisque j'apprends la langue à partir de zéro) J'ai suivi ce cours du 15 février au 18 avril 2022. Et acquis de solides connaissances de base en JavaScript. Mais ce n’est pas tout ce que j’ai fait pendant le cours. J'ai également appris les bases du HTML, du CSS, les bases du travail avec Git et Github et bien plus encore...
Sperme Bushmanov
27.05.2022 G.
Bons cours !
Avantages: Donne des résultats à l'étudiant, clairement structuré, bien pensé, bonne présentation de la matière. Inconvénients: Aucun, mais il convient de noter que la programmation en général demande beaucoup de temps. J'ai terminé le cours "Javascript". Développement professionnel d'interfaces web." Magnifique cours! Les progrès en programmation après le cours sont évidents. Il faut vraiment consacrer beaucoup de temps à apprendre...
Sperme Bushmanov
27.05.2022 G.
Bons cours !
Avantages: Donne des résultats à l'étudiant, clairement structuré, bien pensé, bonne présentation de la matière. Inconvénients: Aucun, mais il convient de noter que la programmation en général demande beaucoup de temps. J'ai terminé le cours "Javascript". Développement professionnel d'interfaces web." Magnifique cours! Les progrès en programmation après le cours sont évidents. Il faut vraiment consacrer beaucoup de temps à apprendre...