As tu déjà entendu parler de « Frameworks » ?
Qu’il ne faut pas confondre avec langage.
Si tu ne connais pas ce mot …
Pour faire simple, c’est une sorte de bibliothèque.
Par exemple, Angular JS, React JS, Vue JS, sont des frameworks.
Le langage derrière c’est JavaScript.
En CSS ils existent aussi de nombreux frameworks.
On me demande souvent quel est l’intérêt d’utiliser un framework CSS ?
Premièrement le gain de temps :
En utilisant un framework CSS tu auras accès immédiatement à des fonctionnalités qui couvrent 80% de tes besoins.
- Gestion des polices simplifiées.
- Les Layouts (zones qui structures tes pages web).
- Les Composants (Buttons, Carrousels, Menus, Formulaires, Tooltip, Alert, Modal …).
- Les Etats (visible, masqué, over).
- Les Grids (Les box qui se réorganisent automatiquement en fonction de la taille de l’écran).
Ensuite la standardisation :
Les frameworks sont « cross browser compatible ».
Cela veut dire que tu n’as pas à te poser la question de la compatibilité du navigateur.
Tu as déjà surement vu ce bout de code horrible qui permet d’appliquer un style CSS spécial pour IE.
<!–[if IE]>
<link rel= »stylesheet » type= »text/css » href= »all-ie-only.css » />
<![endif]–>
Bref avec les frameworks CSS tout ça c’est fini !
Ils sont fiables.
Contrairement au code CSS que tu vas développer dans ton coin.
Ou avec une équipe sur ton projet.
Les frameworks CSS sont utilisés par des milliers de développeurs à travers le monde.
Chaque anomalie est systématiquement reportée et corrigée.
Mais il y a une contrepartie à payer de tous ces avantages …
Beaucoup de sites se ressemblent.
Comme ces frameworks sont très répandus, si tu ne customises pas un peu ton site, il va ressembler à beaucoup d’autres.
Par exemple à force d’utiliser Boostrap (le framework le plus répandu), tu reconnais immédiatement un site en boostrap…
Du code lourd (pas en kilogrammes mais en kilo-octets ^^).
Souvent les frameworks sont chargés en entier, même si tu dois utiliser un simple bouton.
Du coup ça alourdi le temps de chargement de la page.
Il est difficile de sortir du moule.
Si tu utilises le cadre fourni par ces frameworks tout vas bien.
Mais dès que tu essayes de customiser, d’adapter, ça peut vite devenir une grosse galère.
Mais ce sont des inconvénients minimes comparés aux énormes avantages qu’ils proposent.
Ils te font gagner tellement de temps qu’ils se sont répandus à toute vitesse ces dernières années.
Il y a des frameworks CSS spécialisés pour chaque besoin.
Par exemple si tu veux un framework très léger.
Tu peux te renseigner sur :
- Pure CSS purecss.io
- Mini CSS minicss.org
- Spectre picturepan2.github.io/spectre/
Si tu cherches un framework modulaire.
Tu peux regarder du coté de :
- Bulma bulma.io
Si tu cherches un framework très customisable.
- Tailwind CSS tailwindcss.com
Si tu cherches un framework avec une sémantique claire (noms de classes représentatifs)
Tu peux te renseigner sur :
- semantic-ui semantic-ui.com
Et enfin si tu ne sais pas trop quel framework utiliser.
Si tu cherches un framework très utilisé en entreprise, très rependu, très standard.
Je te conseil de partir sur les 2 plus gros frameworks du moment :
- Boostrap 4 getbootstrap.com
- Materialize CSS materializecss.com
Avec ces 2 frameworks tu ne prends pas de risques.
Si tu bosses sur des projets en freelance ou en CDI, tu as 90% de chances de tomber sur un des deux.
Si tu souhaites approfondir ce sujet là.
J’ai ressorti la formation CSS pour les non web designer.
Accéder maintenant : go.mikecodeur.com/formation-css
Un formation en 9 modules vidéos :
✓ On revoit les bases :
Si tu es 100% débutant pas de problème on revoit les bases.
✓ Les erreurs de débutants :
Pour ne pas passer pour un débutants et t’éviter une perte de temps, je te montre toutes les erreurs de débutant à ne surtout pas commettre.
✓ Prise en main de Flexbox :
Comprendre Flexbox c’est obligatoire ! Je te montre tout les principes.
✓ On fait un site en Flexbox
Tu seras à l’aise avec Flexbox après avoir fait un site responsive uniquement en Flexbox.
✓ Les Frameworks Front End
Tu auras une vision claire des frameworks front-end, de leurs avantages et inconvenants. Ce sera plus claire pour faire un devis pour une mission freelance.
✓ Prise en main de Boostrap 4
Maîtrise Boostrap 4, ses concepts, et les composants les plus couramment utilisés.
✓ Prise en main de Materialize CSS
De plus en plus répandu en entreprise, dans les start-up et en freelance, deviens à l’aise avec Materialize CSS.
✓ Les projets en CSS
Pour aller plus loin, une liste de projets à réaliser ton coté pour bien ancrer ces connaissances.
✓ Un accès slack
Pose moi directement tes questions et communique avec d’autres membres de la formation sur l’espace privé Slack.
Tout est là avec 130,00 € offerts seulement jusqu’à dimanche soir !
Démarrer la formation : go.mikecodeur.com/formation-css
À tout de suite dans le premier module,
Mike
