(Core) rework blog post layout (#1)

* Using layout for markdown files instead of plain astro file

* Redesign seems to work fine

* Deleting old welcome-v2 astro and starting to write article about cheatsheet

* Writing the plan for the new blog post

Author: tdimnet

src/layouts/BlogPostLayout.astro

@@ -34,16 +34,49 @@ import Footer from "../components/Footer.astro";
     font-size: clamp(2.5rem, 0.75rem + 1.5vw, 4rem);
     margin-top: 0;
     margin-bottom: 1rem;
+    color: #fff;
   }
 
   h2 {
     font-size: 1.75rem;
     margin-bottom: 1rem;
+    color: #fff;
   }
 
   img {
     width: 100%;
     margin-bottom: 1rem;
     border-radius: 8px;
   }
+
+  p {
+    margin-bottom: 1.5rem;
+    color: #eee;
+  }
+
+  hr {
+    color: #FFF;
+    margin-top: 1.5rem;
+    margin-bottom: 1.5rem;
+  }
+
+  a {
+    text-decoration: none;
+    color: #4effa0;
+    font-weight: 500;
+    transition: 0.4s color;
+
+    &:hover {
+      color: #4effa0aa;
+    }
+  }
+
+  .brand-name,
+  .author {
+    font-family: "Pixelify Sans", sans-serif;
+  }
+
+  .author {
+    font-size: 1.5rem;
+  }
 </style>

src/pages/blog/decouvrez-fiches-techniques.md

@@ -0,0 +1,64 @@
+---
+layout: ../../layouts/BlogPostLayout.astro
+---
+
+# Découvrez les fiches techniques
+
+
+## La recherche du bon format
+
+- Ecrire un cours prend du temps, beaucoup de temps. Il faut réfléchir aux notions, au plan et au projet.
+- Avec la V2 de NX, les intégrer à la plateforme reste prioriraire. Cependant, bien les intégrer à la nouvelle plateforme demande du temps.
+- Pour les fiches techniques, on s'est inspiré des cheatsheets. Traduit litéralement, on appelle ça des feuilles de triche. J'aimais bien cette idée d'anti-sèche.
+
+
+---
+
+
+## Un condensé d'informations qui se 
+
+- Une fiche technnique = une notion. 
+- Une fiche technique se veut rapide à écrire et à lire. Elle doit contenir le plus de notions pratiques possible.
+- Elle doit vous permettre d'aller plus loin si vous le désirez.
+- J'ai bon espoir qu'elles vont aussi nous aider pour le SEO.
+
+
+---
+
+
+## Une base pour intégrer les futurs cours
+
+- La nouvelle version de NX utilise Astro JS. Pour votre information, l'ancienne version passait par un LMS : Teachable.
+- L'avantage de développer notre propre outil est la liberté de pouvoir lier les différents contenus plus facilement.
+- Le desavantage est qu'on doit penser tous ces contenus en amont. C'est un travail passionnant mais il y a le risque de partir dans tous les sens. En travaillant sur des contenus et des formats plus courts, on peut plus facilement itérer et trouver les bonnes fonctionnalités à développer.
+- Je recommencerais à réintégrer les cours bientôt mais dans un premier temps, je préfère qu'on se concentre sur les fiches techniques. D'autant plus que je ne suis plus seul à coder sur le projet.
+
+---
+
+
+## Les premières fiches techniques JavaScript / CSS
+
+- Vous pouvez dès à présent découvrir les premières fiches techniques sur cette page. N'hésitez surtout pas à nous faire un retour via GitHub - ce lien vous permettra d'ouvrir une issue.
+- Je vous invite à lire les fiches 
+    - de Lionel sur le this en JavaScript
+    - de moi sur la méthode CSS Clamp
+    - d'Oumar sur le mot clé return en JavaScript.
+
+
+---
+
+
+Bonne lecture.
+<br>
+<span class="author">Thomas</span>
+
+
+
+Idées principales :
+
+- Cela fait un moment que je réfléchissais à un nouveau type de contenu. Les cours sont des contenus très denses avec beaucoup d'informations. Ils prennent beaucoup de temps à faire.
+- Pour prendre un main la nouvelle plateforme, et mieux imbriquer les différentes parties (le blog, les cours, les exercices), je réfléchissais à un format plus court. Je voulais aller à l'essentiel sur une notion spécifique.
+- Si vous suivez des cours ou des ressources anglophones, le terme de cheatsheet vous parle sûrement. Traduit litéralement, on appelle cela une feuille de triche. C'est un peu comme une anti sèche en quelque sorte.
+- J'aimrais bien cette idée d'anti-sèche. Cela dit, je trouve qu'elles sont parfois un peu trop "dry" : elle manque de contexte et d'application pratique.
+- Pour l'instant, avec Lionel, nous avons commencé à travailler sur des fiches techniques en lien avec le CSS et le JavaScript. Nous allons continuer à en ajouter de manière continue. Comme je le disais, l'avantage de ce format est qu'il est assez court. Il se veut synthétique tout en étant rapide et facile à lire.
+- Pour l'instant, nous avons écrit 3 à 5 fiches techniques. Vous pouvez les retrouver sur la page "fiches". Je vous invite à lire la fiche de Lionel sur le this en JavaScript ainsi que celle sur la fonction CSS Clamp.

src/pages/blog/decouvrez-les-fiches-techniques.md

@@ -0,0 +1,81 @@
+---
+layout: ../../layouts/BlogPostLayout.astro
+---
+
+# Bienvenue sur la V2
+
+![Quelqu'un assis dans un jardin au printemps, pixel art](/jardin-printemps.webp)
+
+
+## Comme un parfum de printemps.
+
+Il y a maintenant un an, je lançais la première version de NX. Je venais de quitter une entreprise et je décidais de me lancer à temps plein dans
+ce projet. Cela faisait bien un an que ça me trottait dans la tête. Je
+guettais l’opportunité idéale. C’est un peu comme quand j’ai appris à
+coder. C’était il y a maintenant 10 ans.
+
+
+À l'époque, j'étais particulièrement frustré des jobs que j'occupais.
+J'avais du mal à vivre et j'aspirais à autre chose. J'ai mûri le projet
+en me formant le soir et à midi grâce à un site : <a href="https://teamtreehouse.com/" target="_blank">TeamTreehouse</a>. Les cours de cette plate-forme m'ont très vite séduit. À ce moment-là, il y avait beaucoup moins de sites pour se former en programmation. Vous aviez le choix entre <a href="https://www.codecademy.com/" target="_blank">Codecademy</a>, <a href="https://www.freecodecamp.org/" target="_blank">freeCodeCamp</a> et Codeschool.
+
+
+Se reconvertir dans l'informatique n'était pas encore à la mode. Les
+choses ont aujourd'hui bien changé. Depuis quelques années, les
+formations en développement informatique ont poussé comme des
+champignons. Une recherche sur Google suffit pour s'en rendre compte.
+Quoi qu'il en soit, ça a été une sacrée prise de risque. J'ai dû revenir
+vivre chez ma mère.
+
+
+---
+
+
+## Le bon choix
+
+Il n'y a pas un jour où je regrette ce choix même s'il y a clairement eu des hauts et des bas. Je n'ai jamais trouvé un métier aussi passionnant. On demande souvent quelles sont les qualités principales pour un développeur. Je peux en citer au moins deux. Aimer apprendre et aimer résoudre des problèmes.
+
+
+Pour moi, c'était l'idéal. L'informatique, comme beaucoup d'autres sciences, est comme une gigantesque boîte de Pandore. Certains s'y perdent et décrochent. D'autres y sont littéralement happés et peinent à s'arrêter. Pendant longtemps, savoir poser des limites a été l'une de mes difficultés.
+
+
+En quelques années, j'ai occupé des postes de développeur, de lead développeur et de CTO. J'ai aussi mentoré des élèves et créé des cours sur <a href="https://openclassrooms.com/fr/" target="_blank">OpenClassrooms</a>. Il est fort probable que ce soit mes cours qui vous ont mené ici.
+
+
+---
+
+
+## Reprendre des risques
+
+Au fil des années, j'ai appris de nombreux langages tels que le JavaScript/TypeScript, le PHP, le Python, le Swift et le Rust. J'ai travaillé dans différents contextes tels que des big techs (<a href="https://www.datadoghq.com/" target="_blank">Datadog</a>) mais aussi des PME (<a href="https://www.senscritique.com/" target="_blank">SensCritique</a>) et des startups. J'ai contribué aussi bien à d'importants projets legacy qu'à des lancements de projets.
+
+
+Cela dit, je sentais que j'arrivais petit à petit au bout de l'histoire. L'informatique est toujours ma passion. Quand je m'ennuie, j'ouvre régulièrement mon ordinateur pour coder et apprendre de nouvelles choses. Mais une lassitude s'est petit à petit installée. Les projets sont devenus petit à petit ennuyeux et répétitifs. Je sentais que j'allais devoir reprendre des risques.
+
+
+NX a été cette prise de risques. Je me suis retrouvé à nouveau au chômage (mais pas chez ma mère). NX m'a fait découvrir des aspects de la vie d'un projet que je n'avais jamais vraiment compris. Être porteur d'un projet et savoir insuffler une vision est quelque chose de difficile. Il faut aimer ne pas savoir où on va. Surtout au début.
+
+
+---
+
+
+## S'écouter
+
+En moins d'un an, j'ai "shippé" une plateforme et écrit cinq nouveaux cours. J'en suis plutôt fier. J'ai aussi trouvé mes premiers clients. Cela a été plus facile que je le pensais. J'aurais certainement pu continuer sur cette lancée. Faire grossir le projet, embaucher. Devenir patron.
+
+
+Mais plus je me rapprochais de cette étape et moins j'en avais envie. J'aime l'informatique et j'aime enseigner. J'ai toujours vu le web et Internet comme des moyens de nous rapprocher. Plus le projet avançait, plus je sentais le décalage venir et moins j'y prenais de plaisir.
+
+
+S'écouter est quelque chose d'essentiel. Savoir reconnaître et identifier ses émotions même si c'est douloureux. Après quelques mois de réflexion, j'ai donc décidé de rendre NX totalement open-source. Les projets sont déjà <a href="https://github.com/orgs/nx-academy/repositories" target="_blank">accessibles publiquement sur GitHub</a>. Le site que vous consultez <a href="https://github.com/nx-academy/nx-academy.github.io" target="_blank">l'est aussi</a>. Je vais passer les prochaines semaines à rendre les cours publics.
+
+
+La plateforme sera gratuite. Vous n'aurez pas besoin de créer un compte. Je n'utiliserai pas Google Analytics pour traquer les utilisateurs.
+
+
+---
+
+
+Bienvenue sur la nouvelle version de <span class="brand-name">NX Academy</span>.
+<br>
+<span class="author">Thomas</span>