HexoとGitHubに基づいて無料のブログドメイン名グラフィックティーチングを構築する

まず、完成品をお見せしましょう。https
ここに画像の説明を挿入
//wanghao221.github.io/独自のブログの作成は、2つのカテゴリに分けられます。1つはhexoで表されるgithubでホストされ、もう1つは自分でサーバーをレンタルすることです。 。主にワードプレスフレームワークを使用します。お金をかけない効果も非常に良く、自分でサーバーを購入する必要はありません。以下では、主にhexoを使用して個人ブログを作成する方法を紹介します。

HexoはMarkdownをサポートし、Markdownを使用して記事を作成します(公式Webサイトからダウンロードするか、アップロードしたリソースから無料ダウンロードできるMarkdown編集ツールtyporaをお勧めしますhttps//download.csdn.net/download/qq_44273429/ 14109665)生成されるのは静的なhtmlページであり、サーバーに公開され、アクセス効率に自然な利点があります。

まず、GitHubアカウントが必要です。アカウントをお持ちでない場合は、https//github.com/joinで登録できます。

1.Gitをダウンロードする

ウィンドウズ:

https://git-scm.com/download/win(公式ウェブサイトからダウンロード)
https://download.csdn.net/download/qq_44273429/14109903(無料ダウンロードのためにCSDNにアップロード)

Linux:

sudo apt-get install git

インストール後、Git BashHereを右クリックしgit --versionてバージョンを確認します

ここに画像の説明を挿入

2.nodejsをインストールします

ウィンドウズ:

https://nodejs.org/en/(windows8以上の公式ウェブサイトからダウンロード)
https://download.csdn.net/download/qq_44273429/14110208(CSDNにアップロードしたwindows8以上は無料でダウンロードできます)

https://nodejs.org/download/release/v13.14.0/node-v13.14.0-x64.msi(windows7バージョンのダウンロード)
https://download.csdn.net/download/qq_44273429/14110197(windows7バージョンをアップロードしますCSDNから無料でダウンロードできます)

Linux:

sudo apt-get install nodejs
sudo apt-get install npm

インストール後、任意の場所を見つけてGit Bashを右クリックすると、バージョン番号が表示され、インストールが成功したことが示されます。

ここに画像の説明を挿入

3.hexoをインストールします

前のgitとnodejsをインストールした後、hexoをインストールできます。最初にフォルダーblogを作成してから、このフォルダーにcdします(または、このフォルダーの下のgit bashを右クリックして開きます)。

コマンドを入力します

npm install -g hexo-cli

最初に応答がない場合でも慌てる必要はありません。しばらくすると、私のようになり、正常にインストールされるまでに35秒かかったことがわかります。
ここに画像の説明を挿入

次に、を使用しhexo -vてバージョン確認し
ここに画像の説明を挿入
ます。ここにインストールする必要のあるソフトウェアはすべてインストールされています。
最初にhexoを初期化します

hexo init hexoblog

このヘキソブログは自分で撮ることができます

cd hexoblog //进入hexoblog文件夹
npm install

ここに画像の説明を挿入
フォルダを開くと、次のディレクトリが表示されます
。node_modules:依存関係パッケージ
public:生成されたページ
スキャフォールドを
保存します:記事ソースのテンプレート生成します
記事のテーマを保存します
theme_config.yml:ブログ構成ファイル
ここに画像の説明を挿入

hexo g
hexo server

次に、ブラウザにhttp:// localhost:4000と入力して、次のコンテンツを表示します
ここに画像の説明を挿入
。ctrl+ cを使用してサービスをオフにします。

4.GitHubは個人リポジトリを作成します

GitHub.comで新しいリポジトリを参照してください。新しいリポジトリを
作成し、自分と同じユーザー名でリポジトリを作成します。後で.github.ioを追加します。この方法でのみ、将来GitHubページにデプロイされたときに認識されます。 、これはxxxxです。.github.io、ここでxxxはGitHubに登録するためのユーザー名です。ここで、pai-daxing1という新しいGitHubアカウントを作成し、
ここに画像の説明を挿入
[リポジトリの作成]をクリックします。

ここに画像の説明を挿入
.github.ioを追加するのを忘れて、名前を変更しました。大きな問題ではありません。

5. SSHを生成し、GitHubに追加します

gitbashに戻ります。

git config --global user.name "yourname"
git config --global user.email "youremail"

ここで、yournameはGitHubユーザー名を入力し、youremailはGitHubメールボックスを入力します。このようにして、GitHubはあなたがそのアカウントに対応しているかどうかを知ることができます。ここで私のユーザー名はpai-daxing1で、メールアドレスは[email protected]です。私のように入力してください

git config --global user.name "pai-daxing1"
git config --global user.email "[email protected]"

ここに画像の説明を挿入
次に、SSHを作成し、Enterキーを常に押します。

ssh-keygen -t rsa -C "youremail"

youremail自分のものに変更することを忘れないでください

ssh-keygen -t rsa -C "[email protected]"

ここに画像の説明を挿入
この時点で、.sshフォルダーが作成されたことが通知されます。コンピューターでこのフォルダーC:\ Users \ Administrator.sshを見つけます。

sshは、簡単に言うと秘密鍵です。その中で、id_rsaはコンピューターの秘密鍵であり、他の人に見せることはできません。id_rsa.pubは、他の人に見せることができる公開秘密鍵です。この公開鍵をGitHubに配置して、GitHub自身のアカウントにリンクすると、公開鍵に基づいて秘密鍵と一致するようにします。互いに一致すると、gitを介してファイルをGitHubに正常にアップロードできます。

次に、GitHub設定で、SSHキーの設定オプションを見つけて、[新しいSSHキー]をクリックします。

ここに画像の説明を挿入
ここに画像の説明を挿入

id_rsa.pubの情報をコピーします。(右クリックしてメモ帳で開きます)
ここに画像の説明を挿入
[SSHキーの追加]をクリックしてから、GitHubログインパスワードを入力する必要があります。その後、次のように表示されます。
ここに画像の説明を挿入

gitbashで、成功するかどうかを確認します

ssh -T git@github.com

ここに画像の説明を挿入
真ん中はあなたが確かかどうか尋ねます、はいを入力してください

6.hexoをGitHubにデプロイします

このステップでは、hexoをGitHubに関連付けることができます。つまり、hexoによって生成された記事をGitHubにデプロイし、サイト構成ファイル_config.ymlを開いて最後まで向きを変え
、GitHubアカウントであるpai-daxing1に変更します。

deploy:
  type: git
  repo: https://github.com/pai-daxing1/pai-daxing1.github.io.git
  branch: master

注意:type:とgihubの間にスペースがあります。

このとき、デプロイコマンドであるdeploy-gitを最初にインストールして、コマンドを使用してGitHubにデプロイできるようにする必要があります。

npm install hexo-deployer-git --save

その後

hexo clean
hexo generate
hexo deploy

その中で、hexo cleanは以前に生成したものを削除するか、追加する必要はありません。
hexo generateは、その名前が示すように、静的な記事を生成します。hexogの略語
を使用して記事をデプロイできます。hexodの略語を使用できます。

展開時にユーザー名とパスワードの入力が必要になる場合があることに注意してください。
ここに画像の説明を挿入
私のコンピューターが突然これをインストールするように頼んだので、インストールしました。最初にビルドしたときは、このステップがなかったようです。
ここに画像の説明を挿入

次の図は、デプロイが成功したことを示しています。しばらくすると、http://yourname.github.ioでブログを見ることができます。

ここに画像の説明を挿入
クリックして承認


これがhttp://pai-daxing1.github.ioを開く方法です。美しさを最適化する方法については後で説明します。実際、ブログには使用したくありません。いくつかのことを入れたいだけです。その上に、いくつかのHTML、ミニゲーム、ピクチャーベッドとして、またはSEOレイヤーチェーンとして使用するなど。
githubアドレス:https//github.com/pai-daxing1/pai-daxing1.github.io
ここに画像の説明を挿入

より多くのコンテンツ

長押ししてQRコードを特定し、WeChatの公式アカウントをフォローします
ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/qq_44273429/article/details/112463543
おすすめ