From Scratch - Développement Web/Parcours Complet : Mastering Front-End

Parcours Complet : Mastering Front-End

⚡️Reprend l'intégralité des cours HTML & CSS, Javascript, React et quelques bonus.

Pourquoi ce Parcours Complet ?

Au début de mon parcours en autodidacte j'ai commencé par du Java, puis du développement mobile en C# et on va pas se mentir, je ne comprenais rien ! Après des semaines à me débattre avec des langages hostiles j'ai réalisé qu'il fallait commencer par le commencement. Oui ça parait évident dit comme ça mais quand on est livré à soi même dans l'océan de contenus que propose le Web on ne réalise pas forcément que l'on va dans la mauvaise direction.

Des mois plus tard, j'ai finalement réalisé que j'aimais le Front, créer des choses jolies et fonctionnelles, des applications où l'on prend plaisir à naviguer... mais là encore il y a une jungle de contenus, j'ai appris des technos comme jQuery, on trouve malheureusement beaucoup de contenus dépassés sans savoir que c'est dépassé. Cette formation va te permettre de sauter le passage où tu ères sur le Web sans trop savoir quoi apprendre car elle condense exactement tout ce qui est utile et important pour devenir un développeur Front-end compétent

Ce parcours te spécialise en React (la techno Front la plus demandée sur le marché) mais elle te donne aussi un socle et des bases en titane en JavaScript. Et JavaScript est la pierre angulaire indispensable du développement Web, si tu es bon en JS alors tu apprendras très vite des technos comme VueJS ou NodeJS. Finalement, tu seras un développeur compétent pour basculer sur n'importe quelle techno selon les besoins de tes clients. 

Les 17 cours complets

✅ HTML
✅ CSS [2 parties]
✅ Github [2 parties]
✅ SEO
✅ SASS
✅ JavaScript - les bases
✅ JavaScript - le DOM
✅ JavaScript - la Data
✅ JavaScript - les API
✅ JavaScript - la POO
✅ JavaScript - suite & fin 
✅ TypeScript
✅ React [2 parties]
✅ NodeJS

Les 8 applications et sites développés

⚡️En plus des 18 travaux pratiques qui se présentent chacun en 2 vidéos : une première où j'explique l'exercice et donne des pistes et une seconde où l'on corrige ensemble et où j'explique toute la réflexion pour arriver au résultat.

⚡️Ce parcours complet nous fera développer ensemble 8 sites et applications qui pourront enrichir ton Portfolio.

Partie HTML/CSS

Gaming Campus

⚡️ Première grosse intégration de niveau professionnel. Permet de se familiariser avec la puissance du Flex

Run

⚡️ Seconde intégration qui permet de comprendre l'utilité du Grid pour disposer les éléments exactement à notre convenance, via des sections ou même dans un formulaire. 

La Montagne

⚡️ Cette intégration permet de mettre en application le cours sur SASS, elle peut sembler facile au premier abord mais comporte beaucoup de petits pièges et un formulaire assez technique

Resto

⚡️ L'intégration ultime, longue et technique. Si tu es en mesure de la réaliser alors tu es capable de tout faire en CSS

Partie JavaScript

Générateur de MDP

⚡️Manipuler des tableaux
⚡️Générer un résultat aléatoire 

Application de cuisine

⚡️Faire une requête à l'API pour récupérer les données
⚡️Afficher les données à l'écran 

Générateur de blagues

⚡️Gérer une réponse de l'API
⚡️Rendre le résultat à l'écran 

Country App

⚡️Récupérer toutes les données des pays
⚡️Filtrer les données selon les choix de l'utilisateur

Yoga App

⚡️Créer un tableau selon les choix de l'utilisateur
⚡️Lancer la routine avec un compte à rebours pour chaque position 

Quiz App

⚡️Instancier un objet avec les questions et les bonnes réponses
⚡️Analyser les réponses et incrémenter le score de l'utilisateur 

Flappy Bird

⚡️Gérer le système de canvas
⚡️Prendre en compte les différents mouvements de l'oiseau selon le décor généré aléatoirement

Les vidéos

🌱 INTRODUCTION

Bande-annonce : Mastering Front-End
Aperçu
Présentation du parcours : devenir un bon autodidacte

🧱 HTML

🎥 Cours HTML
🍿 [TP1 présentation] Tableau Complexe
💡 [TP1 explication] Tableau Complexe
🍿 [TP2 présentation] Intégrer une maquette simple
💡 [TP2 explication] Intégrer une maquette simple
🍿 [TP3 présentation] Intégrer une maquette professionnelle
💡 [TP3 explication] Intégrer une maquette professionnelle

🪄 CSS

🎥 Cours CSS [1/2]
🛠️ Plugin Chrome / VS Code indispensables
🎥 Cours CSS [2/2]
🍿 [TP1 présentation] Intégration Helium (Flexbox)
💡 [TP1 explication] Intégration Helium (flexbox)
💡 [TP2 présentation + explication] Helium (Grid)
🍿 [TP3 présentation] Être responsive
💡 [TP3 explication] Être responsive
🍿 [TP4 présentation] Grid Complexe
💡 [TP4 explication] Grid complexe
🛠️ Les indispensables de CSS
🍿 [Projet 1 présentation] Intégration Gaming Campus
💡 [Projet 1 explication] Intégration Gaming Campus
🍿 [Projet 2 présentation] Intégration Run
💡 [Projet 2 explication] Intégration Run

💾 GITHUB

🎥 Cours Github [1/2]
🎥 Cours Github [2/2]

🤖 SEO

🎥 Cours SEO

🧁 SASS

🎥 Cours Sass
🍿 [Projet 3 présentation] Intégration La Montagne
💡 [Projet 3 explication] Intégration La Montagne
🍿 [Projet 4 présentation] Intégration Le Resto
💡 [Projet 4 explication] Intégration Le Resto

🚀 JAVASCRIPT [1/6]

🎥 Cours - Les bases
🛠️ Plugin Chrome / VS Code indispensables

🚀 JAVASCRIPT [2/6]

🎥 Cours - Le DOM
🛠️ Synthèse du Cours - Le générateur de bulles
🍿 [TP1 présentation] Mouse effect
💡 [TP1 explication] Mouse effect
🍿 TP2 - Présentation - Scroll Navbar
💡 [TP2 explication] Scroll Navbar
🍿 [TP3 présentation] Scroll Popup
💡 [TP3 explication] Scroll Popup
🍿 [TP4 présentation] Sidebar
💡 [TP4 explication] Sidebar

🚀 JAVASCRIPT [3/6]

🎥 Cours - La Data
🍿 [TP5 présentation] Color Generator
💡 [TP5 explication] Color generator
🍿 [TP6 présentation] Todo List
💡 [TP6 explication] Todo List
🍿 [TP7 présentation] Compte à Rebours
💡 [TP7 explication] Compte à rebours
💡 [TP8 présentation + explication] Date Calculator
🛠️ Algorithmique en JS

🚀 JAVASCRIPT [4/6]

🎥 Cours - Les API
🍿 [TP9 présentation] Country App
💡 [TP9 explication] Country App

🚀 JAVASCRIPT [5/6]

🎥 Cours - La POO
💡 [TP10 présentation + explication] Quiz App

🚀 JAVASCRIPT [6/6]

🎥 Cours - Suite et Fin
💡 [TP11 présentation + explication] Flappy Bird
🎥 Cours TypeScript

⚛️ BONUS : REACT

🎥 Cours React [1/2]
🎥 Cours React [2/2]
🛠️ Mise en ligne d'un site en React
🍿 [TP1 présentation] Cooking App
💡 [TP1 correction] Cooking App
🍿 [TP3 présentation] Créer une App de Cinéma
💡 [TP3 correction] Ciné App
📱 [APP] Crypto Watch [1/2]
📱 [APP] Crypto Watch [2/2] Ajout Redux
🎥 Cours Redux
🎥 Cours Redux Toolkit

🌳 CONCLUSION

Comprendre le métier et le marché du Dev
Aller plus loin

  • 50 €

Parcours Complet : Mastering Front-End

  • Cours
  • 74 Leçons