[CV plus points] Hexo framework crée un site de blog personnel, un enseignement pratique.

Communauté de combat Python

Communauté de combat Java

Appuyez longuement pour identifier le code QR ci-dessous, ajoutez au besoin

Scannez le code QR à suivre pour ajouter un service client

Entrez dans la communauté Python ▲

Scannez le code QR à suivre pour ajouter un service client

Entrez dans la communauté Java

Auteur 丨 Li Du

Source 丨 Classes autres que les classes (ID: LDCldc123095)

Récemment, des fans ont également interviewé pendant la période Golden 9th et Silver 10. Davantage de diplômés ont déclaré que j'avais posé plus de questions d'entrevue pendant cette période. Les derniers numéros étaient enclins à interviewer des articles. Dans ce numéro, je vais vous présenter un curriculum vitae plus une opération. Utilisez le framework hexo pour créer un blog personnel.

En tant que nouveau diplômé ou programmeur avec 1 à 3 ans d'expérience professionnelle, vous avez votre propre site de blog personnel, ce qui est certainement un bonus pour votre CV. Cependant, le coût de l'apprentissage est vraiment très faible. Il ne faut que des dizaines de minutes pour créer votre propre blog personnel. .

Pas beaucoup de potins, commençons à construire notre propre blog!

Installer l'environnement Node

Tout d'abord, nous devons installer l'environnement Node sur cette machine, nous pouvons aller directement sur le site officiel de Node.js: https://nodejs.org/en/ et cliquer sur l'image ci-dessous pour la télécharger.

Après le téléchargement, double-cliquez directement, puis c'est l'opération stupide de l'étape suivante. Il convient de noter ici: Certaines personnes peuvent avoir installé l'environnement Node sur leurs ordinateurs, et vous pouvez vérifier la version Node en exécutant la commande suivante dans la fenêtre cmd :

node -v

Si la version de Node est inférieure à 10, vous devez mettre à jour la version de votre Node , car l'exécution de Node10 ou d'une version inférieure signalera une erreur lors de l'installation d'hexo et vous indiquera clairement que la version ne correspond pas au message d'erreur .

Après l'installation, vérifiez à nouveau la fenêtre cmd et entrez les deux commandes suivantes:

node -v
npm -v

Après avoir installé l'environnement Node, il suffit d'installer Git. L'installation de Git est très simple, sautez-le ici, téléchargez-le sur le site officiel de Git :, https://git-scm.com/downloadset puis c'est une opération pas à pas imbécile.

Installer hexo

Tout d'abord, créez un nouveau dossier utilisé pour stocker dans leur propre local dans hexole code, je suis ici pour E:\MyBloginstaller directement sous hexo.

Dans le répertoire E: \ MyBlog, cliquez avec le bouton droit de la souris pour l'ouvrir Git Bash, puis exécutez la npm install -g hexocommande dans Gir Bash . Lorsque vous voyez la figure suivante, cela signifie que l'installation est terminée. La première fois que vous pouvez attendre est plus longue:

Puis exécutez :, hexo initinitialisez le projet hexo, tirez réellement le projet de github:

Lorsque l'hexo est initialisé, vous pouvez voir qu'il y a beaucoup plus de fichiers liés au projet hexo dans votre répertoire actuel:

Parmi ces répertoires, les fichiers et dossiers les plus importants sont: sourceet les themesdossiers et les _config.ymlfichiers:

  1. source : Ce dossier est l'endroit où nos propres articles sont stockés, et les articles sont stockés dans le dossier _posts sous ce répertoire.

  2. thèmes : Utilisé pour stocker les informations sur le thème du blog.

  3. _config.yml : C'est le fichier de configuration du blog hexo, contenant de nombreuses informations de configuration.

Ensuite, exécutez: npm installet hexo g, utilisez la source npm pour installer les composants dépendants et compilez pour générer une page statique .

Après avoir exécuté la commande ci-dessus, vous constaterez que le projet contient un publicdossier supplémentaire . Ce dossier est utilisé pour stocker les pages statiques . Les pages statiques de ce dossier sont générées dynamiquement en fonction du fichier de configuration, il vous suffit donc de modifier le fichier de configuration _config.ymlLes informations de configuration dans peuvent modifier la page statique générée:

Le dernier est de démarrer hexo, en exécutant la commande :, la hexo spage suivante apparaîtra:

Il vous a clairement indiqué que pour accéder au port 4000 local, entrez dans le navigateur:, http://localhost:4000si la page suivante apparaît, la configuration locale est réussie:

Ce que nous pouvons voir maintenant est le thème par défaut de hexo. Les informations du thème sont stockées dans le dossier paysage sous thèmes.

Si vous souhaitez modifier ce thème par défaut, comme la grande police Hexo dans l'image ci-dessus, nous devons le modifier avec le nom de notre propre blog. Tout d'abord, ouvrez MyBlogle fichier de configuration dans le répertoire _config.yml:

Il y a beaucoup d'informations de configuration dans ce fichier de configuration. Nous pouvons d'abord trouver les champs de titre et d'auteur et les modifier pour former nos propres informations.

Ensuite , exécutez: hexo cleanet hexo g,: hexo cleanque supprimer le cache d' origine, il dirigera le compilateur d' origine généré dossier public statique supprimé directement ;: hexo gva à nouveau générer des pages statiques en fonction du fichier de configuration .

Enfin, nous relançons le projet ( hexo s), visitez http://localhost:4000:

Notre article Hello World est remplacé par notre propre article, qui se trouve sous le dossier source / _posts que nous avons mentionné précédemment:

Il nous suffit de remplacer ce md par le md de notre propre article, puis d'exécuter les trois commandes suivantes à tour de rôle:

hexo clean
hexo g
hexo s

Jetons un coup d'œil à l'effet:

C'est beaucoup plus beau. Notez également que si vous souhaitez afficher le sujet soumis dans la case rouge sur le côté droit de l'image ci-dessus, ajoutez un titre à votre article, et il sera automatiquement reconnu:

---
title: 我以为我对Mysql事务很熟,直到我遇到了阿里面试官
---

De plus, cliquez sur l'heure soumise affichée dans la case bleue pour passer à l'enregistrement de classification soumis:

classification

Cependant, je pense toujours que ce thème est moche. Pour le moment, nous utiliserons la bibliothèque de thèmes officielle d'hexo :, https://hexo.io/themes/ici, vous pouvez choisir de prévisualiser votre propre bibliothèque de thèmes:

Ici, je choisis un thème relativement grand, je clique dans la case rouge pour prévisualiser le thème, et je clique sur la case bleue pour sauter à l' githubadresse de code source du thème .

Si vous souhaitez utiliser ce thème, vous devez télécharger le thème, cliquez d'abord sur la case bleue pour entrer l'adresse github du thème, copiez l'adresse github, puis vous devez exécuter la commande suivante:

git clone https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis

Cela signifie télécharger le code source du thème dans le dossier volantis sous le dossier du thème des thèmes. Après le téléchargement, modifiez la configuration des champs suivants dans le fichier de configuration _config.yml du répertoire MyBlog:

Enfin, l'implémentation hexo clean、hexo get hexo sla commande, vous pouvez voir l'effet dans le navigateur:

Pensez-vous que vous êtes grand en un instant, beaucoup de génialité, de sorte qu'un auto-blog soit obligé de sortir, vous n'avez pas besoin d'écrire l'interface et le backend vous-même, il est donc très pratique d'utiliser directement hexo pour créer un blog technique personnel, et les besoins de base peuvent être satisfaits .

en ce moment. Après ce déploiement, vous pouvez pousser le code vers le référentiel github, mais avant de le pousser vers github, votre dossier MyBlog doit être associé à votre référentiel distant . Cette méthode d'association est décrite dans cet article [ (1) Expliquer les bases Git, de l'entrée à la compétence (tutoriel au niveau nounou) ] J'en ai déjà parlé, donc je n'entrerai pas dans les détails ici, copiez simplement les clés de votre fichier local .ssh / id_rsa dans les clés SSH de l'entrepôt distant .

Lorsque votre entrepôt local est associé à l'entrepôt distant, créez un entrepôt dans l'entrepôt distant comme indiqué dans la figure ci-dessous. Le nom de l'entrepôt doit être: votre nom d'utilisateur + ".github.io" :

Enfin , configurez les informations suivantes MyBlogdans le _config.ymlfichier de configuration sous le dossier :

De cette façon, vous pouvez utiliser les quatre commandes suivantes pour pousser votre code local vers l'entrepôt distant:

npm install hexo-deployer-git --save
hexo clean
hexo generate
hexo deploy

Enfin, entrez: http: // + "votre nom d'utilisateur" +. Github.io dans votre navigateur , vous pouvez visiter votre propre blog personnel, par exemple, mon site de blog personnel est :, l' http://liduchang.github.ioeffet final:

Ceci, utilisez le framework hexo pour créer un tutoriel de blog personnel est terminé, la dernière chose à noter à ce sujet: en plus des fichiers de configuration dans le _config.ymlfichier MyBlog peuvent être modifiés, ainsi que themes/volantissous le _config.ymlfichier de configuration du dossier peut également être modifié, cela peut Étudiez-le vous-même.

Puis après chaque modification, les quatre commandes suivantes sont exécutées:

hexo clean
hexo g
hexo s
hexo d

Je pense que les informations sur le thème peuvent être relativement simples, car elles sont configurées en fonction des informations de configuration. Si le thème du blog est trop compliqué, il faut aller à son adresse source github pour étudier la signification de chaque champ de configuration ou le regarder. Le commentaire prendra beaucoup de temps, je pense que ce n'est pas nécessaire.

Après un test d'accès multi-utilisateurs, il est démontré que certaines personnes ne peuvent pas accéder à leur téléphone portable, certaines peuvent accéder à leur téléphone, certaines ne peuvent pas accéder à leurs ordinateurs et d'autres peuvent accéder à leurs ordinateurs. La raison spécifique n'est pas claire. Si quelqu'un connaît la raison, vous pouvez visiter Je ne suis pas reconnaissant de m'en avoir indiqué la raison dans la section des commentaires.

Enfin, si votre interlocuteur ne peut pas voir le site que vous avez créé, il devra surveiller son sort. Il est fort probable qu'il ne pourra pas y accéder. Hahahaha, eh bien, ce problème est ici. Rendez-vous dans le prochain numéro. Bienvenue à visiter le mien. https://liduchang.github.io/:.site

程序员专栏 扫码关注填加客服 长按识别下方二维码进群

Contenu passionnant récent recommandé:  

 955. 6 nouvelles entreprises sont ajoutées à la liste des entreprises WLB sans heures supplémentaires

 Les dernières statistiques des salaires des programmeurs en octobre 2020!

 L'intervieweur m'a demandé combien de façons de créer des fils? j'ai ri

 Utilisation de la bibliothèque itchat python


Regardez le bon article ici pour le partager avec plus de gens ↓↓

Je suppose que tu aimes

Origine blog.csdn.net/Px01Ih8/article/details/109323759
conseillé
Classement