Améliorer votre blog VitePress avec une API Laravel

Bonjour ! 👋

Après avoir créé notre blog VitePress, nous sommes prêts à le rendre plus dynamique grâce à une API Laravel.

Dans la série précédente, nous avons découvert VitePress, de la création du projet jusqu'à son déploiement sur Cloudflare Pages. Nous avons construit un blog fonctionnel et automatisé, avec des métadonnées SEO, des images Open Graph et une page dédiée aux projets GitHub. Le blog gérait tout au moment de sa génération : il ne restait plus qu'à écrire et publier du contenu.

Cette série s'intéresse au développement back-end. Nous allons créer une API Laravel pour ajouter quelques fonctionnalités interactives à notre blog.

Jusqu'à présent, notre blog était principalement statique. Le contenu était généré lors du build, avec seulement quelques données chargées dynamiquement, puis les fichiers HTML résultants étaient distribués par un CDN. En ajoutant une API Laravel, nous permettrons aux lecteurs d'interagir avec le blog grâce à des fonctionnalités comme les réactions et les commentaires.

Même si la série se concentre sur le back-end, nous intégrerons également l'API à notre blog VitePress. Nous utiliserons Vue.js et Pinia Colada pour récupérer les données. VitePress est une application Vue.js, nous pouvons donc l'étendre avec les composants dont nous avons besoin.

Les exemples sont conçus pour rester faciles à suivre. La complexité inutile et la sur-ingénierie n'ont pas leur place ici. Nous nous concentrerons sur la simplicité, la clarté et l'efficacité.

Tout au long de la série, nous construirons une API Laravel et l'intégrerons à notre blog VitePress. Nous aborderons les sujets suivants :

• Configurer le projet Laravel : Créer un nouveau projet Laravel et se familiariser avec sa structure.
• Améliorer le workflow de développement : Configurer Pint, Rector, Larastan et Pest pour le formatage, la refactorisation, l'analyse statique et les tests.
• Ajouter l'authentification sociale : Permettre aux utilisateurs de se connecter avec GitHub grâce à Laravel Socialite.
• Connecter les applications : Configurer Sanctum, CORS, la protection CSRF et les premières requêtes entre le front-end VitePress et l'API Laravel.
• Gérer l'état d'authentification : Utiliser Pinia Colada pour récupérer l'utilisateur courant et le déconnecter avec une mise à jour optimiste.
• Construire l'API de commentaires : Créer les modèles, les relations, les endpoints, la validation, l'autorisation et les tests des commentaires.
• Garder le back-end synchronisé : Générer les métadonnées des articles depuis VitePress et les synchroniser avec la base de données Laravel.
• Construire l'interface de commentaires : Récupérer, créer, modifier et supprimer des commentaires depuis le front-end VitePress.

À la fin de la série, vous aurez un blog soutenu par une API Laravel. Les lecteurs pourront se connecter avec GitHub et laisser des commentaires, tandis que l'architecture sera prête à accueillir d'autres fonctionnalités interactives.

Les tests feront partie du processus de développement et seront ajoutés à chaque étape. Il n'est donc pas nécessaire de leur consacrer un article séparé.

Si vous avez des questions, des retours ou des suggestions, n'hésitez pas à les partager dans les commentaires. Vos remarques contribuent à améliorer la série.