Microfolio - Installation & Découverte | Guide complet

En ce moment, je passe beaucoup de temps à explorer Internet à la recherche de projets open source auto-hébergeables. Dans mes recherches, je suis déjà tombé sur plusieurs outils intéressants, comme Papra, un projet open source pour la gestion documentaire. Et quelle surprise de tomber sur l'article de Korben, qui présente un projet baptisé Microfolio.

Ce générateur de portfolio statique permet de créer facilement un site sans écrire une seule ligne de code. Une alternative légère et open source aux CMS traditionnels, idéale pour ceux qui veulent mettre en place rapidement un portfolio moderne.

Présentation de Microfolio

Microfolio est un générateur de portfolio statique développé par Adrien Revel, assisté par Claude Code. Son objectif : permettre à chacun de créer facilement un portfolio moderne sans écrire une seule ligne de code.

Le fonctionnement est simple : tout repose sur des fichiers Markdown. Il suffit de déposer vos fichiers dans les dossiers appropriés et de rédiger la présentation de vos projets en Markdown, et en quelques secondes, vous obtenez un portfolio élégant et professionnel.

Sur le plan technique, Microfolio s'appuie sur SvelteKit 2 et Tailwind CSS 4 pour offrir un rendu graphique moderne et performant. SvelteKit transforme le code en JavaScript pur et optimisé, garantissant un affichage ultra-rapide de votre site.

Depuis sa sortie, le projet a été bien accueilli par la communauté open source : il compte aujourd'hui plus de 129 étoiles sur GitHub.

Installation

Installer Microfolio est vraiment simple, et il existe deux façons de procéder selon votre système d'exploitation.

Pour macOS

brew install aker-dev/tap/microfolio

microfolio new mon-portfolio

cd mon-portfolio

microfolio dev

Et voilà ! Vous avez un portfolio prêt à être rempli avec vos magnifiques réalisations.

Pour les autres systèmes d'exploitation

Pour Windows ou Linux, certains prérequis sont nécessaires : Node.js LTS 20+, pnpm comme gestionnaire de paquets et Git.

git clone https://github.com/aker-dev/microfolio.git my-portfolio
cd my-portfolio

pnpm install

pnpm dev

Je vous l'accorde, l'installation sur ces systèmes peut être un peu plus complexe, mais rien d'insurmontable. En quelques étapes, vous aurez votre portfolio statique fonctionnel.

Pour ceux qui rencontrent des difficultés, vous pouvez me contacter directement ou consulter le GitHub officiel du projet.

Configuration et découverte

La configuration de Microfolio est assez simple. Vos projets se trouvent dans le dossier content, situé à la racine de votre installation Microfolio. Vous y trouverez un exemple déjà rédigé ainsi qu'une structure type pour organiser vos projets.

Pour créer un nouveau projet, il vous suffit de créer un dossier dans le répertoire projects, de copier l'exemple existant et de le personnaliser selon vos besoins.

Pour plus de détails, vous pouvez consulter la documentation officielle en français.

Fonctionnalités intégrées

Microfolio propose de nombreuses fonctionnalités pratiques, enrichies au fil des versions :

• 📁 CMS basé sur des fichiers : fonctionnement sans base de données
• 🎨 Vues multiples : modes Projets, Liste et Carte
• 📱 Design responsive : conçu avec une approche mobile-first
• 🏷️ Étiquetage intelligent : filtres avec compteurs et liste rétractable
• 🗺️ Carte interactive : intégration Leaflet avec projets géolocalisés
• 🚀 Génération statique : performances optimisées
• 🖼️ Lightbox d'images : galerie avec navigation et affichage des métadonnées
• 📊 Métadonnées EXIF/IPTC : extraction et affichage automatique des infos techniques
• 🌙 Mode sombre : bascule en pied de page avec préférence persistante
• ⚡ Optimisation d'images : génération de miniatures WebP via

  pnpm optimize-images

• 🔗 URLs partageables : état des filtres, recherche et pagination synchronisés dans l'URL
• 🌐 Internationalisation : anglais et français, compatible RTL
• 🏷️ Métadonnées OG : aperçus optimisés pour le partage sur les réseaux sociaux
• 📄 Pagination et tri : personnalisables par date, titre, type ou localisation

Tous les détails sont disponibles ici

Déploiement

Pour ce qui est du déploiement, rien de sorcier ! Il suffit d'exécuter :

• Sur macOS :

  microfolio build

• Sur les autres systèmes :

  pnpm build

Pour l'hébergement, vous pouvez utiliser GitHub Pages. Il vous suffira de publier le dossier build directement sur un dépôt dans la branche main et d'activer GitHub Pages dans les paramètres du dépôt.

Conclusion

Microfolio est parfait pour les photographes, artistes, graphistes ou toute personne qui ne sait pas coder et/ou qui ne souhaite pas dépenser des milliers d'euros pour un site professionnel.

Avec ce générateur de portfolio statique open source, vous pouvez créer un site moderne, élégant et performant en quelques étapes seulement, sans compétences techniques avancées. Et avec les évolutions récentes de la v0.7.0, le projet est clairement passé à la vitesse supérieure.

Merci à Adrien Revel pour ce magnifique projet et à Korben pour l'avoir mis en avant.