すべての開発者は独自の技術ブログ サイトを持つことを期待しており、CSDN、Blog Garden、Nuggets などを利用して技術記事を共有する開発者が増えています。この記事の目的は、誰でもすぐに自分だけの無料ブログサイトを構築できるようにすることです その実現原理: まず、事前に記述された md ドキュメントコードから Hexo を使用して静的ページを生成し、コードの静的 Web サイトホスティング機能を使用しますデプロイおよびパッケージ化するためのクラウド ページ。コード。
まずアドレスにアクセスします: http://magnumhou.gitee.io/magnum-blog/
1. 事前準備
1.1 Giteeアカウントの登録
自分の Github または Gitee アカウントを登録します。この記事では Gitee デモを使用します。
一般に Code Cloud として知られる Gitee は、中国における Git ベースのコード ホスティングおよび研究開発コラボレーション プラットフォームです。
Gitee公式サイトアドレス：https://gitee.com/
Github に対する Gitee の利点は次のとおりです。
- 誰もが理解できる理由により、Github へのアクセス速度が非常に遅くなり、場合によってはアクセス障害が発生することもあります。Code Cloudは国産プラットフォームなので飛びの速さを体感できます。
- GitHub と比較すると、Code Cloud は無料の Git ウェアハウスを提供するだけでなく、コードの品質検査やプロジェクトのデモンストレーションなどの機能も統合しています。チームの共同開発のために、Code Cloud はプロジェクト管理、コード ホスティング、ドキュメント管理サービスも提供しており、5 人未満の小規模チームには無料で提供されます。
Baidu を使用して倉庫プロセスを登録および作成できます。それは非常に簡単です。
1.2 Gitのインストール
ダウンロード アドレス
対応するシステム プラットフォームを選択し、ダウンロード後、愚かな方法でインストールします。
インストールが完了したら、「ファイル名を指定して実行」を開き、CMD コマンドを入力し、Enter キーを押してコマンド ライン ウィンドウを開き
、次の Git コマンドを入力します。
git --version
バージョン番号が表示されます。これは、git のインストールが成功したことを意味します。
1.3 Git と Gitee 間の接続の確立
任意のディレクトリで git bash コマンド ラインを開き、次のコマンドを入力して公開キーを生成します。
ssh-keygen -t rsa -C 邮箱
キャリッジ リターン (y/n) が表示されるので、y を入力し、キャリッジ リターンを押し続けてキャリッジ リターンを生成します。
C:\Users\Dell.ssh ディレクトリを開き、id_rsa.pub ファイルを見つけてメモ帳で開きます。
注: コンピュータが異なれば、ユーザー ディレクトリも異なります。
ブラウザに戻り、クラウド ウェアハウスに作成された gitee ページを見つけて、右上隅の個人情報をクリックし、[設定] を見つけて開き、左の列で [SSH 公開キー] を見つけます。公式公開
キーを生成するための「セキュリティ設定」 ガイダンス手順
公開キーのデフォルトの数は 0 です。「公開キーの追加」列で、「タイトル」と「公開キー」を追加します。
注: タイトル名はカスタム公開キーであり、メモ帳で開いた「id_rsa.pub」ファイルの内容です。
貼り付けが完了したら、「OK」をクリックします。この時点で、「現在の SSH 公開キー番号: 1」が表示されます。
グローバル設定には次のコマンドを入力します。
git config --global user.name "你的用户名"
git config --global user.email "你的邮箱"
バージョン ライブラリに含まれるファイルを gitee リモート ウェアハウスに送信します。
git add .
git commit -m 'first commit'
git remote add origin 你的仓库地址
git push -u origin master
この時点で送信は完了しています。ブラウザを開いて倉庫の住所を入力し、更新してファイルを表示します。
1.4 ノードのインストール
Node.js® は、オープンソースのクロスプラットフォーム JavaScript ランタイム環境です。
Node.js (Node.js バージョンは 10.13 以上である必要があります。Node.js 12.0 以降を推奨します)
ノードのダウンロード アドレス
中国のアドレス
インストールプロセスは比較的簡単で、簡単にインストールできます。
インストールが完了したら、コマンドラインを開いて次のコマンドを実行します。
node -v
バージョン番号が表示されたら、インストールは成功です。デフォルトでは、独自のパッケージマネージャー npm が付属しており、次のコマンドで確認できます。
npm -v
1.5 Hexo のインストール
Hexoは、高速、簡潔、効率的なブログ フレームワークです。数百のページを数秒で即座にレンダリングでき、強力なプラグイン統合システムを備えています。
公式サイトアドレス
グローバルインストール
$ npm install -g hexo-cli
npm に精通している上級ユーザーの場合、hexo パッケージはローカルにのみインストールできます。
$ npm install hexo
任意の場所にフォルダーを作成します。フォルダーを開いた後、右クリックして [Git Base] -> [Git Base Here] を選択し、
次のコマンドを入力すると、Hexo は Web サイトに必要なすべてのファイルをターゲット フォルダーに自動的に作成します。
hexo init
フォルダーを更新すると、次のディレクトリが表示されます
赤いボックス内のファイルは自分でパッケージ化して生成する必要があります
package.json のコード:
{
"name": "magnum-blog",
"version": "0.0.0",
"private": true,
"scripts": {
"build": "hexo generate",
"clean": "hexo clean",
"deploy": "hexo deploy",
"server": "hexo server"
},
"hexo": {
"version": "6.3.0"
},
"dependencies": {
"hexo": "^6.3.0",
"hexo-deployer-git": "^4.0.0",
"hexo-generator-archive": "^2.0.0",
"hexo-generator-category": "^2.0.0",
"hexo-generator-index": "^3.0.0",
"hexo-generator-tag": "^2.0.0",
"hexo-renderer-ejs": "^2.0.0",
"hexo-renderer-marked": "^6.0.0",
"hexo-renderer-stylus": "^2.1.0",
"hexo-server": "^3.0.0",
"hexo-theme-landscape": "^0.0.3"
}
}
関連する指示は次のとおりです
# 安装依赖包
npm install
# 构建
npm run build
# 启动
npm run server
開始後、ブラウザにパス localhost:4000 を入力して効果を確認します。次のような Web サイトが表示されます。
ここのウェブサイトのデフォルトのテーマを置き換えました。アドレス: https://hexo.io/themes/
お気に入りのテーマは選択しましたか? この時、指定したテーマのgithubに入ってダウンロード
する ダウンロードした圧縮パッケージを解凍してhexo/themesに入れる一つ前の階層に戻り、_config.ymlを開いて
中のテーマに対応する値を
修正する 実行オーダー
npm run server
ページを更新すると、希望のテーマが表示されます。！！
2.開発
使い慣れた md ツールを選択して、ブログ開発の旅を始めましょう。
これらはブログの冒頭に追加する必要があることに注意してください。
---
# 文章标题
title: Hello My Bolg
# 文章日期格式：2018-05-30 15:20:36
date:
# 文章标签
tags:
# 文章分类
categories:
---
次のように home.md コンテンツを記述します。
---
title: '我的博客首页'
---
<pre>
《春江晚景》
竹外桃花三两枝，
春江水暖鸭先知。
茼蒿满地芦芽短，
正是河豚欲上时。
</pre>
書き込んだ .md ファイルを hexo フォルダー下のソース ディレクトリ下の _posts フォルダーに置くと、その中にデフォルトのポストである hello-world.md ファイルがあることがわかります。
開始しnpm run server、ページを更新します
3. コードクラウドを展開する
ブログ ディレクトリを右クリックして PowerShell を開き、次のコマンドを実行します。
# 安装 hexo-deployer-git 插件（将代码推送到码云用）
npm install hexo-deployer-git --save
hexo ルート ディレクトリにある _config.yml ファイルを開き、deploy の値を変更します。
次のコマンドを実行して、コードを Code Cloud にデプロイします。
hexo deploy
プッシュが完了したら、コード クラウドのプロジェクト アドレスに移動し、更新して確認すると、アップロードしたファイルが表示されます。
[サービス] をクリックして、[Gitee Pages] を選択します。
注: この手順では、規制上の理由から実名認証 (ID カードをアップロードする必要があります) が必要であり、認証が完了した後でのみ操作を続行できます。
指定したブランチを選択してサービスを開始し、該当するアドレスをクリックするとブログが表示されます。！！
