TUTO Projet Fullstack #2 - Créer un formulaire de contact moderne complet

Pour ce deuxième projet de développement web Fullstack, je vous propose de réaliser un formulaire de contact très complet !

Pourquoi Fullstack ? Car nous mettrons en oeuvre à la fois des compétences Front-end, que Back-End.
On vous propose dans ce cours en ligne, de mettre en orchestration les langages HTML, CSS, Javascript, PHP/MySQL pour obtenir un projet final concret.
 

Voici le déroulé de cette formation créer un formulaire de contact fullstack

Cette formation en vidéo se déroulera en 6 parties bien distinctes, que vous pourrez suivre à votre propre rythme.

• La 1ère partie sera consacrée à la mise en place Front End du formulaire.
  Pour cela, nous allons utiliser le langage HTML pour construire notre formulaire, puis le langage CSS pour le mettre en forme. Nous en profiterons pour ajouter un effet sur le placeholder de nos différents champs, afin d'améliorer l'expérience utilisateur. Et pour cela, nous utiliserons le langage JavaScript.
• La 2ème partie sera consacrée au contrôle du formulaire côté front.
  Nous ferons appel une nouvelle fois au langage JavaScript.
• La 3ème partie sera une partie intermédiaire entre le côté front et le côté back de notre développement.
  Ici, nous allons effectuer une transition au moment de la validation du formulaire, là aussi afin d'augmenter l'expérience utilisateur.
• La 4ème partie sera consacrée au côté Back end de notre développement.
  Nous allons utiliser le langage PHP en programmation orientée objet (POO).
  Nous allons créer une classe de validation du formulaire, ainsi qu'une méthode permettant l'envoi de mail si tous les champs du formulaire répondent à nos attentes.
• La 5ème partie sera consacrée à l'insertion des données issues du formulaire dans une base de données MySQL.
  Une nouvel fois avec la POO. Nous allons créer une classe de Manager qui se chargera de l'insertion, sous couvert que les données issues du formulaire répondent à nos attentes.
• La 6ème partie sera consacrée à la protection de notre formulaire.
  Nous mettrons en place le système de Recaptcha de Google.
• La 7ème et dernière partie sera consacrée à la mise en place d'une animation de loading pour faire patienter l'utilisateur.
  Pour cela nous utiliserons le langage CSS qui sera couplé aux langages HTML et JavaScript.

A la fin de cette formation, vous aurez acquis un grand nombre de compétences. Vous aurez développé un code propre et moderne.
Et aurez abordé un certain nombre de problématiques que le développeur fullstack est amené à rencontrer dans son quotidien.

Un QCM vous sera proposé en fin de formation et vous permettra de valider les connaissances théoriques acquises pendant la formation.

Tous les fichiers de travail sont fournis !
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.

Si ce type de formation très orientée projet vous intéresse, apprenez à créer un système d'upload complet.

Bonne formation !