Ce site vous apprend comment utiliser l’HTML, le CSS et le Javascript, pour construire des interfaces web captivantes

Vous allez trouver des snippets dont le fonctionnement est expliqué et accompagné d’exemples.

Ces derniers présentent des techniques, des tendances, voire des concepts utilisés dans le développement front-end.

Le but étant de vous aider à apprendre les bases du développement d’interface, de façon pragmatique, tout en évitant de vous retenir prisonnier des tutoriels !

L’erreur qui limite votre potentiel

Vous avez dû voir des tonnes d’autres sites qui vous apprennent la même chose.

Malgré tout, dès qu’il s’agit de créer quelque chose ou de sortir des sentiers battus ça coince…

Vous êtes bloqué :

  • parce que, vous êtes dans un environnement complexe (un framework ou un CMS) ;
  • parce que vous avez vu plusieurs façons de faire et rien ne convient à votre cas ;
  • parce que l’écart de difficulté entre les exemples des tutos et la réalité est souvent trop grand.

C’est sur ce dernier point que nous allons nous concentrer.

Certains tutoriels vont vous apprendre comment faire un portfolio, une landing page, un formulaire avec des micro-intéractions, etc. Et d’autres vont jusqu’à vous montrer.

C’est génial, mais ça creuse le problème…

Si vous ne comprenez pas ce que vous faites, ni les techniques utilisées, ce sera dur de les intégrer dans un produit, comme le thème WordPress d’une boutique en ligne ou SaaS basée sur un framework (React , Vue,  Angular, Laravel, etc.).

Innover vous semblera impossible, alors que c’est à votre portée.

Copier / Coller du code sans le comprendre est une erreur qui limite votre potentiel, vous ne voulez pas compter uniquement dessus !

Afin de ne plus répéter cette erreur, je vous propose des snippets, qui abordent UN concept ou UNE technique à la fois.

Ceux-ci seront vus (et revus) dans divers articles afin que vous les intégriez dans votre arsenal et que vous deveniez confiant en vos compétences.

Qu’est ce qu’un snippet ?

Un snippet est une petite portion ou un exemple de code que vous pouvez réutiliser dans vos propres projets.

Ils sont “simples” et pratiques :

  1. pour apprendre et comprendre, car ils reprennent un concept, dans un exemple dénué de complexité (sans l’environnement d’un framework ou un CMS) ;
  2. pour s’inspirer ;
  3. pour montrer à quelqu’un un effet souhaité quand vous ne savez pas comment l’appeler (et je vous comprends, je ne sais pas toujours comment les nommer !) 😂.

Qui suis-je

Je m’appelle Alix, j’aide les développeurs web débutants à apprendre les bases du développement front-end.

Au quotidien, j’exerce le métier de développeur front-end. Cela consiste à construire (et non “designer”) des interfaces de pages ou d’applications web interactives.

Ça veut dire que mon rôle est de faire en sorte que les pages s’affichent aussi bien : sur un ordi que sur un téléphone, une télé, une tablette, etc.

Mais pas que…

J’implémente toutes les fonctionnalités visibles comme : des micro animations, des effets lors du scroll (ou du survol de la souris), des transitions entre les pages et bien plus encore.

Ce blog, comme beaucoup d’autres, est l’outil que j’utilise pour partager mon expérience et des tactiques intéressantes.

Il m’arrive de reproduire des effets vu sur des pages lorsque je surfs (sur internet) et j’en fais un snippet plus un article afin que, plus tard, je puisse m’en resservir dans mes projets.

En suivant les articles de ce blog, vous serez capable de faire de même.

Si vous voulez en savoir plus sur moi, n’hésitez pas à me contacter à l’adresse : bonjour@alixfdm.fr.