Gestion du site notion.slyc.ch
Je suis ravi de vous présenter le site notion.slyc.ch, une version personnalisée du site transitivebullsh.it. Ce projet a été conçu en utilisant le Next.js Notion Starter Kit hébergé sur GitHub.
Qu'est-ce que notion.slyc.ch ?
Le site notion.slyc.ch utilise Notion comme CMS associé à
react-notion-x, facilité par Next.js et hébergé sur Vercel. Il affiche le blog de l'auteur originel du répo, Travis Fischer, qui malheureusement n'a plus le temps de mettre à jour le projet lui-même.Fonctionnalités clés
Voici quelques-unes des fonctionnalités remarquables du site :
- Support robuste pour le contenu Notion : Grâce à
react-notion-x, tout le contenu Notion est magnifiquement rendu sur le site.
- Excellente vitesse de page : Le site est optimisé pour des temps de chargement rapides.
- Prise en charge des images et des aperçus fluides : Les images sont servies efficacement, donnant des aperçus d'image fluides et sexy.
- Support complet du mode sombre : Les utilisateurs peuvent basculer entre les modes clair et sombre via une icône dans le pied de page.
- Recherche rapide via CMD+K / CMD+P : Il est facile de trouver du contenu en utilisant des raccourcis clavier rapides.
- Responsive pour différents appareils : Le site est conçu pour être accessible et agréable sur divers appareils.
Configuration et Déploiement
La configuration de base nécessite seulement quelques étapes :
- Cloner le répo : Vous pouvez facilement cloner le répo à partir de GitHub.
- Modifier
site.config.ts: Changez les valeurs nécessaires dans le fichier de configuration.
- Installer les dépendances : Utilisez
npm installpour installer les dépendances nécessaires.
- Tester localement : Utilisez
npm run devpour tester le site localement.
Après cette configuration de base, vous pouvez déployer le site sur Vercel en utilisant
npm run deploy.Cache et Performances
Pour améliorer les performances, notamment les aperçus d'image, il est possible d'activer le cache Redis. Cependant, cette fonctionnalité est optionnelle. Si vous choisissez de l'activer, définissez
isRedisEnabled à true dans site.config.ts et configurez les variables d'environnement REDIS_HOST et REDIS_PASSWORD.Stylisation
Les styles CSS pour le contenu Notion sont situés dans
styles/notion.css. Vous pouvez personnaliser les blocs Notion en ciblant les classes CSS globales exportées par react-notion-x styles.css.Mode sombre et Images sociales automatiques
Le mode sombre est totalement pris en charge et peut être basculé facilement. De plus, toutes les métadonnées sociales et les tags Open Graph sont générés automatiquement à partir du contenu Notion, ce qui permet un partage social professionnel par défaut.
Je suis heureux de gérer et de maintenir le site notion.slyc.ch, offrant une expérience utilisateur riche et intégrée à partir du contenu Notion, en hommage à l'excellent travail originel de Travis Fischer. Pour en savoir plus sur les détails techniques du projet, n'hésitez pas à visiter le répo sur GitHub.
