Ces derniers temps, il y a eu quelque chose d'un swing loin des sites Web complexes axés sur la base de données, vers des sites plus simples et plus statiques - où, ce qui est possible, bien sûr, comme avec un simple site de portefeuille ou un blog.
Cela ne veut pas dire que les gens reviennent sur les sites .html d'antan. Vous voulez toujours être en mesure de gérer efficacement les modèles et le code à l'échelle du site, et c'est là que les générateurs de sites statiques entrent en jeu.
Les générateurs de sites statiques sont conçus pour prendre vos différents fichiers statiques et les transformer en site Web. Il y en a beaucoup, beaucoup d'entre eux à choisir, et il y a des articles récents à leur sujet ici sur SitePoint, couvrant les différentes langues dans lesquelles ils viennent, les options basées sur des nœuds, leurs avantages potentiels par rapport à WordPress, et même comment rouler le vôtre avec Grunt .
Dans cet article, nous examinerons Jekyll, l'un des plus populaires et largement utilisés. Je vais décrire comment vous pouvez créer un blog, avec un codage minimal, puis l'héberger gratuitement sur les pages GitHub. Nous utiliserons également Poole, une sorte de cadre - ou «configuration fondamentale» - pour construire des sites de Jekyll.
Jekyll est écrit en Ruby. Il est installé sur votre ordinateur sous forme de joyau de rubis. Ce n'est pas un CMS, ce n'est pas un logiciel de blog, il ne vient pas avec des modèles, du contenu, etc. C'est beaucoup plus simple que ça. Considérez-le comme un programme simple qui fournit des moyens pratiques de traiter vos fichiers.
Une fois Jekyll installé, vous pouvez le mettre au travail à partir de la ligne de commande. Il peut faire des choses comme la marque de processus, et parce qu'elle génère un site statique, vous pouvez facilement visualiser les progrès localement et héberger votre site sur un serveur Web statique comme les pages GitHub.
Vous devez d'abord installer Jekyll sur votre système. Pour Mac, exécutez la commande suivante dans le terminal pour installer Jekyll:
$ gem install jekyll
Cela installera automatiquement toutes les dépendances de gemmes de Jekyll. Si vous êtes coincé lors de l'installation, consultez la page de dépannage sur le site officiel de Jekyll ou liez un problème sur GitHub.
Bien que Jekyll ne soit pas officiellement pris en charge sur Windows, vous pouvez toujours l'exécuter avec quelques ajustements. Veuillez vous référer à Jekyll sur la page Windows sur le site Web de Jekyll ou à ce guide de Julian Thilo.
Au lieu de commencer par un thème de Jekyll brut, utilisons Poole. Il a été créé par Mark Otto, et c'est ainsi qu'il le décrit:
Poole est le majordome de Jekyll, le générateur de sites statique. Il est conçu et développé par @MDO pour fournir une configuration fondamentale claire et concise pour tout site Jekyll. Il le fait en fournissant une installation complète de jekyll à la vanille avec des modèles d'exemples, des pages, des poteaux et des styles.
Vous pouvez voir la version de base ici. Bien que ce soit très bon pour un blog minimal, j'aime les deux thèmes construits plus en plus: Hyde et Lanyon. Utilisons Hyde pour construire notre blog de démonstration.
Pour obtenir la configuration de Hyde, accédez à sa page GitHub et téléchargez le référentiel. Placez-le dans le dossier de votre choix et dirigez-vous vers le terminal. Supposons que vous le gardez sur votre bureau. Exécutez les commandes suivantes pour passer à ce répertoire et démarrer le serveur:
$ gem install jekyll
La commande Jekyll Serve démarrera un serveur de développement qui vous permettra de prévisualiser le site généré dans votre navigateur localement.
Pour comprendre ce que je veux dire, ouvrez un nouvel onglet dans votre navigateur et type: http: // localhost: 4000. Si vous avez tout suivi correctement, vous y trouverez votre nouveau blog.
Le référentiel Hyde-Master que vous venez de télécharger contient de nombreux dossiers comme _Layouts, _Posts et _includes. Mais il n'y a qu'un seul dossier dont vous devez vous soucier si vous souhaitez gérer les articles pour votre blog: _Posts. Il contient tous vos messages au format Markdown.
Pour ajouter un nouvel article de blog, placez simplement votre fichier Markdown dans le dossier _Posts. Assurez-vous que vos fichiers Markdown contiennent les éléments suivants (connus sous le nom de YAML Front Matter) en haut:
$ cd Desktop/hyde-master/ $ jekyll serve
Cela indiquera à Jekyll que vous ajoutez un message. (Vérifiez les exemples de messages dans le dossier _Posts si vous avez des doutes.)
Exécutez Jekyll servir à nouveau dans votre terminal et vous trouverez le nouveau message dans votre blog si vous ouvrez http: // localhost: 4000.
Pour assurer une bonne construction de votre blog, Jekyll nécessite cette convention de dénomination:
--- layout: post title: Your Post Title ---
L'année est un numéro à quatre chiffres, le mois et le jour sont tous deux des numéros à deux chiffres, et le balisage est l'extension de fichier représentant le format utilisé dans le fichier (dans notre cas MD). Par exemple, votre premier message peut être nommé 2015-03-29-mon-premier-Post.md.
Une fois que vous avez suivi les étapes ci-dessus et que vous avez ajouté certains de vos propres articles, vous êtes prêt à montrer votre nouveau blog au monde. Vous pouvez publier vos fichiers sur de nombreux hôtes Web, mais GitHub a rendu très facile (et gratuit!) Pour héberger un site Jekyll statique via les pages GitHub. Tout ce que vous avez besoin est d'un compte github.
Avant de le pousser vers GitHub, faisons quelques modifications:
Dans le fichier config.yml:
Dans Cname, mentionnez votre_github_username.github.io au lieu de hyde.getpoole.com. Et modifier à propos de md pour inclure vos coordonnées.
Celui que vous avez apporté ci-dessus modifie, créez un référentiel Votre_GitHub_Username.github.io et déplacez tous les fichiers de votre bureau vers ce référentiel.
Essayez d'ouvrir votre_github_username.github.io dans un navigateur, et vous y trouverez votre nouveau blog.
Un point important à noter: vous devrez connaître un peu Git pour pouvoir ajouter vos nouveaux messages au référentiel. Si la ligne de commande n'est pas votre truc, il y a beaucoup d'outils - comme GitHub pour Mac - qui facilitent le travail avec Git. Quoi qu'il en soit, une fois que vous avez ajouté vos messages au référentiel, les pages GitHub prendront en charge le reste.
Ce post était de vous faire démarrer avec Jekyll, mais il y a beaucoup de choses que vous pouvez faire si vous êtes prêt à passer du temps pour apprendre. Vous trouverez un peu mieux les ressources suivantes pour comprendre Jekyll et Git:
J'espère que vous avez trouvé cet article utile. Si vous essayez de créer un blog en utilisant les étapes mentionnées ci-dessus et restez coincé n'importe où, veuillez poser une question dans les commentaires ci-dessous. Je serai actif là-bas.
Jekyll est un générateur de sites simples, conscient de blog, parfait pour les sites personnels, de projet ou d'organisation. Il prend un répertoire de modèle contenant des fichiers texte bruts dans divers formats, l'exécute via un convertisseur et un rendu et crache un site Web statique complet et prêt à publier. Le principal avantage de l'utilisation de Jekyll est sa simplicité. Il ne nécessite pas de bases de données ou de mises à jour, ce qui le rend sécurisé et facile à maintenir. De plus, vous pouvez héberger votre site Web directement sur GitHub gratuitement.
Poole est une configuration fondamentale pour les projets Jekyll. Il fournit une configuration fondamentale claire et concise pour tout site Jekyll. Il le fait en fournissant une installation complète de jekyll à la vanille avec des modèles, des pages, des messages et des styles d'exemples. Cela vous aide à vous opérer avec Jekyll en un rien de temps.
Pour installer Jekyll, vous devez faire installer Ruby sur votre système. Une fois que vous aurez Ruby, vous pouvez installer Jekyll en exécutant la commande GEM Installer Jekyll Bundler. Pour Poole, il vous suffit de télécharger ou de cloner le référentiel Poole de GitHub et vous êtes prêt à y aller.
Création d'un nouveau message dans Jekyll est simple. Il vous suffit d'ajouter un fichier dans le répertoire _Posts qui suit la convention Yyyy-mm-dd-name-of-Post.ext et Jekyll le traiteront automatiquement dans un post.
Vous pouvez personnaliser l'apparence de votre blog Jekyll en modifiant les feuilles de style et les fichiers de mise en page dans les _layouts et _SASS répertoires. Vous pouvez également ajouter vos propres feuilles de style dans le répertoire CSS.
Héberger votre blog Jekyll sur Github est facile. Il vous suffit de créer un nouveau référentiel, de pousser votre site Jekyll vers lui, puis de configurer les paramètres du référentiel pour utiliser la branche GH-Pages pour les pages GitHub.
La mise à jour de votre blog Jekyll est aussi simple que d'apporter des modifications à vos fichiers et de les pousser vers votre référentiel GitHub. Jekyll reconstruia automatiquement votre site chaque fois que vous appuyez sur les modifications.
Oui, Jekyll prend en charge plusieurs langues. Vous pouvez configurer la langue de votre site dans le fichier _config.yml et Jekyll gérera le reste.
Vous pouvez ajouter des images à votre Jekyll Blog en les plaçant dans le répertoire d'images et en les référençant dans vos messages ou pages en utilisant la marque appropriée ou la syntaxe HTML.
Oui, Jekyll prend en charge une large gamme de plugins qui peuvent étendre ses fonctionnalités. Vous pouvez installer des plugins en les ajoutant dans votre fichier Gemfile et _config.yml, puis en exécutant la commande d'installation du bundle.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Comment créer des graphiques et des graphiques d'analyse de données en PPT
Tutoriel d'utilisation de Kindeditor
La différence entre counta et count
Construire un serveur Internet
La différence entre vscode et vs
Comment résoudre le problème de téléchargement lent de Baidu Netdisk
Comment résoudre le problème que cette copie de Windows n'est pas authentique
Que signifie le port de liaison montante ?
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
