Bienvenue dans le deuxième volet de notre série sur jargons.dev !

Allons-y !

Suite au commit initial, j'ai commencé à travailler sur "le script fork" (vous vous demandez ce que c'est ?? Vous le découvrirez plus tard dans la série ?) mais je dois l'avouer et comme vous le découvrirez dans l'historique des commits, que j'ai pris une longue pause (3 mois) de mon travail sur jargons.dev. Durant cette période, j'ai eu l'occasion de faire une réflexion subconsciente qui a été formidable pour le projet.

Opportunité de réflexion

J'ai arrêté de travailler sur jargons.dev pendant un moment, pas intentionnellement mais parce que j'étais tellement impliqué dans le travail que je faisais sur Hearts, que je n'ai même pas pensé à jargons.dev. Eh bien, au cours de ces mois, la nouvelle année est arrivée (avec de nouveaux objectifs bien sûr), j'ai également expérimenté et été exposé à de nouvelles technologies. Une technologie m'a marqué et c'était Astro.

Astro en résonance avec jargons.dev

En janvier, j'avais pour objectif "d'apprendre de nouvelles technologies avec des documents", c'était un défi qui m'a permis de démarrer avec Astro après avoir entendu de très bonnes choses à ce sujet.

Avance rapide en mars, je me suis retrouvé à travailler sur un autre projet parallèle complètement différent (wp-theme), je regardais un flux YT d'Eddie Jaoude où je l'ai fait savoir à Eddie mais sa réponse finirait par me pousser à travailler sur jargons.dev

Vous avez pas mal de projets parallèles... je ne sais pas lequel.

Cette déclaration m'a fait réfléchir très sérieusement, c'est pourquoi j'ai décidé d'arrêter tous les nombreux projets parallèles et de me concentrer immédiatement sur certains qui comptaient, jargons.dev m'est facilement revenu à l'esprit.

À ce stade, j'étais déjà un peu familier avec Astro, — étant un framework pour les applications Web basées sur le contenu, avec un système de fichiers super simple, prêt pour i18n, SSG avec un excellent référencement (important pour le projet), performant, prise en charge d'autres bibliothèques frontales comme ReactJS avec des îles (j'aime particulièrement celle-ci) ; c'était un outil conçu au paradis pour créer jargons.dev.

Eh bien, je me suis rapidement mis au travail le week-end suivant, je devais travailler sur la partie dictionnaire de base du projet.

Le dictionnaire de base

J'ai initialisé un nouveau projet Astro pour celui-ci, aussi simple que d'exécuter la commande ci-dessous et de suivre les invites...

npm create astro@latest

J'ai également ajouté l'intégration tailwindcss pour le style ; Intégration mdx pour le contenu ; c'était également très facile à configurer en exécutant simplement la commande respectivement

npx astro add tailwind
npx astro add mdx

J'ai continué et accompli les tâches suivantes

• Création d'une page d'accueil standard avec un formulaire de recherche statique
• Temporairement résolu d'avoir le répertoire src/pages/word comme répertoire qui doit contenir chaque mot du dictionnaire sous forme de fichier mdx.
• Implémentation de la mise en page word.astro, qui sert de cadre dans lequel le contenu de tous les fichiers .mdx pour les mots à l'intérieur du répertoire src/pages/word/ peut être rendu à l'aide de frontmatter.
• A également ajouté un mini formulaire de recherche statique à la barre de navigation de la disposition des mots.

Avec cette fonctionnalité, nous sommes déjà en mesure d'afficher les mots du dictionnaire sur la route jargons.dev/word/[word]. Cela signifie que lorsque le fichier tuple.mdx est présent dans le répertoire src/pages/word/, nous pourrons accéder à la page pour voir le mot du dictionnaire en visitant jargons.dev/word/tuple

Les relations publiques

exploit : implémenter le dictionnaire de base #4

babillage publié le 24 mars 2024

Cette requête Pull implémente l'application de dictionnaire de base avec AstroJS

Modifications apportées

• Démarrage d'un nouveau projet astro
• Page d'accueil créée
• Implémentation de 2 mises en page
  • Base - wrapper principal principal pour toutes les pages et mises en page
  • Word - mise en page à utiliser sur les pages Word
• Implémentation de déclencheurs de formulaire de recherche statique sur la page d'accueil et dans la mise en page Word

Captures d'écran

Page d'accueil

Page Word

Voir sur GitHub