Css Flexbox - L'Ultime Formation !

Apprendre FlexBox avec des visuels et du code simple.

What you'll learn

Comprendre et maîtriser véritablement le CSS Flexbox et son fonctionnement.

Apprendre le CSS Flex Box sur le plan théorique avant de l'appliquer à des cas réels d'utilisation et sur de vrais projets

Comprendre les avantages du CSS FlexBox via des exemples simples et pratiques.

Coder ensemble un template avec le CSS Flexbox

Profiter de la puissance du CSS 3

Coder facilement des sites Responsive

Maîtriser la mise en page selon les axes (Axe principal & secondaire)

Maîtriser les propriétés flexbox du container et des items

Coder facilement un menu résponsive

Requirements

Les connaissances de bases en HTML et CSS suffisent. Pas besoin d'être un expert.

Aucune expérience préalable en Flex Box n'est requise.

Description

Bonjour les amis et bienvenue sur cette formation CSS FlexBox.Vous ne savez pas ce que c'est quoi FlexBox?Les CSS FlexBox CSS aussi connus sous le nom "CSS Flexible Box Layout Module" sont un standard CSS3 permettant la disposition des éléments dans une page web en permettant d'avoir un design responsive (Qui s'adapte donc à l'écran de l'utilisateur).De nos jours, le CSS FlexBox n'est plus une option pour les développeurs front et c'est la raison pour laquelle j'ai créé cette formation. En effet, il existe beaucoup de tutoriels sur FlexBox mais, hélas, ces derniers ne vont pas droit au but afin de vous expliquer clairement les différentes propriétés afin que vous puissiez bien maîtriser. Ces tutos sont souvent des exercices faits directement dans de gros projets avant un code spaghetti ce qui les rends difficiles et assez confus.Dans cette formation, j'ai décidé de vous expliquer FlexBox de la manière la plus simple possible. Oui, nous allons aborder les divers concepts et techniques en deux étapes. Première  étape: Je vous l'explique d'une manière visuelle. Pour cela, je vous ai préparé des slides Keynote pour chaque propriété qui sera d'ailleurs étudiée dans une vidéo bien dédiée. Deuxième étape: Nous allons faire un petit exercice qui va droit au but afin de vous expliquer la propriété étudiée avec un code simple et clair. En outre, je vous ai créé un guide en format PDF que vous pouvez télécharger en début de formation. Il vous servira comme un guide mémoire pour bien vous repérer tout au long de la formation. C'est aussi un guide que vous pouvez garder pour le consulter en cas de besoin.Pour conclure la formation, nous allons réaliser quelques maquettes afin de mettre en pratique les notions acquises dans la formation. En effet, c'est une étape souvent négligée pourtant essentielle car c'est le moyen qui permet d'effectuer des exercices et de travailler sur un véritable projet digne de ceux qu'on pourrait réaliser en entreprise. Bonne formation à tous :-)Donkey Geek PS: Je ferai de mon mieux pour répondre à vos questions ayant un lien direct au contenu de cette formation. En revanche, je ne suis pas habilité à intervenir sur vos projets personnels ou ceux sur lesquels vous travaillez en entreprise.

Overview

Section 1: Introduction

Lecture 1 Introduction

Lecture 2 Adaptez la formation à votre rythme

Section 2: Les propriétés flexbox

Lecture 3 Display Flex

Lecture 4 Flex Direction

Lecture 5 Flex Wrap

Lecture 6 Flex Flow

Lecture 7 Justify Content

Lecture 8 Align Items

Lecture 9 Align Content

Lecture 10 Order

Lecture 11 Flex Grow

Lecture 12 Flex Shrink

Lecture 13 Flex Basis

Lecture 14 Combiner le Flex Grow, Flex Shrink et Flex Basis via Flex.

Lecture 15 Align Self

Section 3: Exercices Pratiques

Lecture 16 Exercice Pratique: Template avec CSS Flexbox - Partie 1

Lecture 17 Exercice Pratique: Template avec CSS Flexbox - Partie 2

Lecture 18 Exercice Pratique: Template avec CSS Flexbox - Partie 3

Lecture 19 Exercice Pratique: Template avec CSS Flexbox - Partie 4

Lecture 20 Exercice Pratique: Template avec CSS Flexbox - Partie 5

Lecture 21 Exercice Pratique: Template avec CSS Flexbox - Partie 6

Lecture 22 Exercice Pratique: Template avec CSS Flexbox - Partie 7

Lecture 23 Exercice Pratique: Template avec CSS Flexbox - Partie 8

Section 4: Remerciements

Lecture 24 Remerciements

Cette formation s'adresse à tous les étudiants qui souhaitent étendre leurs horizons au-delà des fonctionnalités de base du CSS et devenir capable de coder facilement leurs templates responsives en HTML/CSS les plus modernes en 2021.,Des gens sans expérience en CSS Flexbox et qui veulent l'apprendre.,Les designers web/mobile qui veulent gagner en efficacité et profiter de la puissance du CSS3 grâce a Flexbox,Développeurs qui veulent devenir rapidement des experts en CSS FlexBox