Améliorez-vous en JavaScript
20 Projets en JavaScript
Enfin des projets en JavaScript natif ! (vanilla).
Le web est inondé de Frameworks, de librairies et d’outils en JavaScript, mais il reste très à sec quand il s’agit du langage en lui-même, quand il s’agit de JavaScript natif.
Déjà qu’il n’y a pas trop de contenu en Anglais sur le JS natif.
Alors en Français …
C’est pour remédier à ça que j’ai tourné ce cours « 20 projets en pur JavaScript »
Pour aider ceux qui souhaitent apprendre ce langage et savoir une bonne fois pour toute ce qui appartient à JavaScript et ce qui appartient à un Framework ou autre librairie.
Je vois trop de gens qui se lancent directement dans les Frameworks JS, sans avoir les connaissances nécessaires.
Ils se retrouvent complètement perdus et frustrés, à deux doigts de la crise de nerf, ce qui est compréhensible.
Ils se disent qu’avec quelques tutos sur des animations JS ou des petits bouts de codes ils auront le bagage nécessaire.
Mais c’est une erreur, une solution de fortune, ce n’est pas assez.
Le vrai problème c’est l’expérience, il faut pratiquer.
Il faut visualiser le JavaScript, à quoi il sert, pourquoi a-t-il été créé, où en est t’il de son évolution ?
Pour devenir architecte, on dessine des bâtiments, pour devenir developpeur JS, on code en JavaScript.
Alors retroussons-nous les manches et attaquons ces projets !
La liste des projets que nous allons effectuer :
- Application "calcul d'IMC".
- Quizz.
- Recherche Wikipedia.
- Un créateur de cookies.
- Une application météo.
- Un créateur de dégradés en JS.
- Une app "Pomodoro".
- Un système de validation de mot de passe dans un formulaire.
- Créer un jeu de cartes mémoires.
- Créer un système de scroll infini, comme Pinterest, Instagram, Unsplash...
- Coder un slider stylé et animé.
- Un générateur de mots de passe.
- Une liste d'utilisateurs filtrable.
- Un lecteur vidéo personnalisé, comme Youtube.
- Le jeu du morpion sur navigateur.
- Une animations de particules en JavaScript.
- Une landing page animée super stylée.
- Un jeu qui calcule notre vitesse de frappe au clavier.
- Une calculatrice complète.
- Un lecteur audio stylé.
Avec ça tu as vraiment de quoi te familiariser avec ce langage, nous traiterons de sujets comme :
- Gérer des données et les transformer.
- Les conditions, boucles, etc …
- Appeler des API pour aller chercher des données.
- Faire du JavaScript asynchrone.
- Coder en JavaScript moderne.
- Utiliser des objets / tableaux.
- Utiliser des classes pour créer des objets dans un style orienté-objet.
- Créer des interface stylées (HTML / CSS)..
- Utiliser des fonctions et coder dans un style orienté fonction.
- Gérer toutes sortes d’évenements.
- Voir l’utilisation du DOM en profondeur, une des clés pour bien comprendre JS.
- Etc … On va vraiment voir beaucoup de choses
A qui s’adresse ce cours ?
Ce cours s’adresse aux personnes ayant un niveau débutant/intermédiaire, ne sois surtout pas apeuré par le nombre de projets, j’explique tout de A à Z.
Et n’oublie pas que pour progresser, il faut se frotter à des projets qui nous dépassent, pour découvrir de nouvelles choses et booster son apprentissage.
Certains projets sont donc vraiment orientés débutants, d’autre atteignent un niveau intermédiaire.
Dans tous les cas un léger bagage est nécessaire, si tu as déjà fait des boucles, utilisé des fonctions et des conditions, tu as les connaissances de bases requises.
Besoin d'aide ?
Rejoignez la communauté sur Discord, ou suivez les tutoriels de l'École du Web sur Youtube.
Contenu du cours
- Introduction au projet (1:29)
- Coder l'HTML (6:22)
- Coder le CSS (12:40)
- JavaScript partie 1 : Validation de l'utilisateur et l'email (15:23)
- JavaScript partie 2 : Validation du mot de passe (9:23)
- JavaScript partie 3 : Afficher la force du mot de passe (8:22)
- JavaScript partie 4 : Envoyer le formulaire (10:22)
- Introduction au projet (1:23)
- coder l'HTML et le CSS (14:33)
- JavaScript partie 1 : Générer un nombre au hasard dans un intervalle (7:36)
- JavaScript partie 2 : Rajouter les ensembles de caractères (4:51)
- JavaScript partie 3 : Créer le mot de passe (14:58)
- JavaScript partie 4 : Intégrer la "range" et la copie de mot de passe (9:23)
- Introduction au projet (2:02)
- Coder l'HTML et le CSS (11:05)
- JavaScript partie 1 : Gérer les chiffres et les opérateurs (10:49)
- JavaScript partie 2 : Recoder la méthode eval() partie 1 (17:18)
- JavaScript partie 3 : Calcul de l'évaluation et récursion (11:15)
- JavaScript partie 4 : Gérer la suppression et le reset et les finitions (7:47)
Cliquez sur les questions
Foire aux questions.
Oui, il vous suffit de cliquer sur votre profil > gérer les abonnements > annuler l'abonnement.
Il vous suffit de rejoindre le serveur Discord dans lequel vous pouvez discuter développement web, demander de l'aide ou encore participer à des concours ou des exercices.
Le Parcours Front-End est une feuille de route vous permettant de suivre les cours qui feront de vous un développeur Front-End dans l'ordre.
Il est très important de pratiquer quand on apprend de nouvelles compétences, c'est pourquoi j'ai une page spécialement remplie de dizaines de cours et de projets pratiques!
Rejoignez des milliers d'étudiants