[CVプラスポイント] Hexoフレームワークは、個人的なブログサイト、実践的な教育を構築します。

Python戦闘コミュニティ

Java戦闘コミュニティ

長押しして以下のQRコードを特定し、必要に応じて追加します

QRコードをスキャンして、カスタマーサービスを追加します

Pythonコミュニティに参加する▲

QRコードをスキャンして、カスタマーサービスを追加します

Javaコミュニティに参加する

著者丨LiDu

ソース丨クラス以外のクラス(ID:LDCldc123095)

最近はゴールデン9日、シルバー10日もファンの方にインタビューを行っており、この時期にインタビューの質問をする方が多いとのことで、最後の数号は記事にインタビューする傾向がありました。今号ではレジュームプラスポイントの運用をさせていただきます。 hexoフレームワークを使用して、個人のブログを作成します。

新卒者または1〜3年の実務経験を持つプログラマーとして、あなたはあなた自身の個人的なブログサイトを持っています。これは間違いなくあなたの履歴書のボーナスアイテムです。しかし、学習のコストは本当に非常に低いです。あなた自身の個人的なブログを構築するのに数十分しかかかりません。 。

あまりゴシップはありません、私たち自身のブログを作り始めましょう!

ノード環境のインストール

まず、このマシンにNode環境をインストールする必要があります。Node.jsの公式ウェブサイトhttps://nodejs.org/en/に直接アクセスし、下の画像をクリックしてダウンロードできます。

ダウンロードした後、直接ダブルクリックすると、次のステップのばかげた操作になります。ここで注意する必要があります。一部の人は自分のコンピューターにノード環境をインストールしている可能性があります。コマンドウィンドウで次のコマンドを実行すると、ノードのバージョンを確認できます

node -v

Nodeのバージョンが10未満の場合は、Nodeのバージョンを更新する必要があります。Node10以下を実行すると、hexoのインストール時にエラーが報告され、バージョンがエラーメッセージと一致しないことが明確に示されます

インストール後、cmdウィンドウを再度確認し、次の2つのコマンドを入力します。

node -v
npm -v

Node環境をインストールした後は、Gitをインストールするだけです。Gitのインストールは非常に簡単です。ここでスキップして、Gitの公式Webサイトからダウンロードしてください。https://git-scm.com/downloadsそうすれば、ばかげたような段階的な操作になります。

hexoをインストールします

まず、hexoコード独自のローカルに保存するために使用する新しいフォルダーを作成しますここでは、のE:\MyBlogに直接インストールしhexoます。

E:\ MyBlogディレクトリで、右クリックして開きGit Bash、Gir Bashでnpm install -g hexoコマンドを実行します。次の図が表示されている場合は、インストールが完了したことを意味します。最初に待つ時間が長くなります。

次に、次を実行しhexo initます。hexoプロジェクトを初期化し、実際にgithubからプロジェクトをプルします。

hexoが初期化されると、現在のディレクトリにhexoプロジェクトに関連するファイルがさらにたくさんあることがわかります。

これらのディレクトリの中で、より重要なファイルとフォルダは次のとおりです。sourceおよびthemesフォルダと_config.ymlファイル:

  1. ソース:このフォルダは私たち自身の記事が保存されている場所であり、記事はこのディレクトリの下の_postsフォルダに保存されています。

  2. テーマ:ブログのテーマ情報を保存するために使用されます。

  3. _config.yml:hexoブログの設定ファイルです。たくさんの設定情報が入っています。

次に実行:npm installおよびhexo gnpmソースを使用して依存コンポーネントをインストールし、コンパイルして静的ページを生成します

上記のコマンドを実行すると、プロジェクトに追加のpublicフォルダーがあることがわかります。このフォルダーは静的ページを格納するために使用されます。このフォルダー内静的ページは構成ファイルに基づいて動的に生成されるため、構成ファイルを変更するだけです。_config.ymlの構成情報は、生成された静的ページを変更できます。

最後に、コマンドを実行してhexoを起動しhexo sます。次のページが表示されます。

ローカル4000ポートにアクセスするには、ブラウザに入力することを明確に示しています。http://localhost:4000次のページが表示された場合、ローカルセットアップは成功しています。

現在表示されているのは、hexoのデフォルトのテーマです。テーマ情報は、themesの下のlandscapeフォルダーに保存されています。

上の図の大きなHexoフォントなど、このデフォルトのテーマを変更する場合は、独自のブログ名に変更する必要があります。まず、次MyBlogのディレクトリにある構成ファイルを開きます_config.yml

この構成ファイルには多くの構成情報があります。最初にタイトルフィールドと作成者フィールドを見つけて変更し、独自の情報を作成します。

次に、元のキャッシュ削除する:hexo cleanhexo g、:hexo clean実行します。これにより、元のコンパイラで生成された静的パブリックフォルダが直接削除されます;:構成ファイルに従って静的ページhexo gが再度生成されます

最後に、プロジェクトを再開します(hexo s)、訪問http://localhost:4000

Hello Worldの記事は、前述のsource / _postsフォルダーにある独自の記事に置き換えられています。

このmdを独自の記事のmdに置き換えてから、次の3つのコマンドを順番に実行するだけです。

hexo clean
hexo g
hexo s

効果を見てみましょう:

これははるかに美しいです。また、上の写真の右側にある赤いボックスに送信された件名を表示する場合は、記事にタイトルを追加すると、自動的に認識されることに注意してください。

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

さらに、青いボックスに表示されている送信時刻をクリックして、送信された分類レコードにジャンプします。

分類

ただし、このテーマはまだ醜い感じがします。現時点では、hexo:の公式テーマライブラリを使用しhttps://hexo.io/themes/ます。ここでは、独自のテーマライブラリをプレビューすることを選択できます。

ここでは、比較的背の高いテーマを選択し、赤いボックスをクリックしてテーマをプレビューし、青いボックスをクリックしてテーマのgithubソースコードアドレスにジャンプします

このテーマを使用する場合は、テーマをダウンロードし、最初に青いボックスをクリックしてテーマのgithubアドレスを入力し、githubアドレスをコピーしてから、次のコマンドを実行する必要があります。

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

これは、テーマのソースコードをテーマのテーマフォルダの下のvolantisフォルダにダウンロードすることを意味します。ダウンロード後、MyBlogディレクトリの構成ファイル_config.ymlの次のフィールドの構成を変更します。

最後に、実装hexo clean、hexo ghexo sコマンド、ブラウザで効果を確認できます。

一瞬で背が高くなり、すごいのでしょうか?インターフェースやバックエンドを書かなくても自作​​のブログが出てくるので、直接hexoを使ってパーソナルテクニカルブログを作るのも便利で、基本的なニーズに応えられます。 。

現時点では。この展開後、コードをgithubリポジトリにプッシュできますが、githubにプッシュする前に、MyBlogフォルダをリモートリポジトリに関連付ける必要があります。この関連付け方法については、この記事で説明します[ (1)基本を説明するGit、入門から習熟まで(乳母レベルのチュートリアル) ]すでに話しましたが、ここでは詳しく説明しません。ローカルの.ssh / id_rsaファイルのキーをリモートウェアハウスのSSHキーにコピーするだけです。

ローカルウェアハウスがリモートウェアハウスに関連付けられている場合は、次の図に示すように、リモートウェアハウスにウェアハウスを作成します。ウェアハウス名は次のようにする必要があります。ユーザー名+ ".github.io"

最後にMyBlogフォルダの下の_config.yml構成ファイル次の情報構成します

このようにして、次の4つのコマンドを使用して、ローカルコードをリモートウェアハウスにプッシュできます。

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

最後に、ブラウザhttp:// + "your username" +。github.ioと入力すると、自分の個人ブログにアクセスできますたとえば、私の個人ブログサイトはhttp://liduchang.github.io次のとおりです。最終的な効果:

これで、hexoフレームワークを使用して個人のブログチュートリアルを作成しました。最後に注意する点は次のとおり_config.ymlです。MyBlogファイルthemes/volantis内の_config.yml構成ファイルを変更できるだけでなく、フォルダーの下の構成ファイルも変更できます。自分で勉強してください。

次に、変更を加えるたびに、次の4つのコマンドが実行されます。

hexo clean
hexo g
hexo s
hexo d

テーマ情報は、構成情報に基づいて構成されているため、比較的単純なものになると思います。ブログのテーマが複雑すぎる場合は、githubのソースアドレスにアクセスして、各構成フィールドの意味を調べるか、彼を確認する必要があります。コメントには時間がかかりますが、不要だと思います。

マルチユーザーアクセステストの結果、携帯電話にアクセスできない人、電話にアクセスできる人、コンピューターにアクセスできない人、コンピューターにアクセスできる人がいることがわかりました。具体的な理由は不明です。理由がわかっている場合は、次のURLにアクセスしてください。コメント欄で理由を教えてくれて感謝していません。

最後に、インタビュアーがあなたが構築したサイトを見ることができない場合、彼は彼の運命を見なければなりません。訪問できないかもしれません。ハハハハ、まあ、この問題はここにあります。次の問題でお会いしましょう。私の訪問へようこそ。個人https://liduchang.github.io/サイト:

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

最近のおすすめのエキサイティングなコンテンツ:  

 955.6つの新しい会社がWLB非残業会社のリストに追加されました

 2020年10月のプログラマー給与の最新統計!

 インタビュアーは、スレッドを作成する方法はいくつありますか?私は笑った

 pythonitchatライブラリの使用


ここで良い記事を見て、もっと多くの人と共有してください↓↓

おすすめ

転載: blog.csdn.net/Px01Ih8/article/details/109323759