2024-07-05に投稿2024-07-10に更新Easy-Tech10分で読む (約1522語)

快適なBlog作成環境構築

Intro

というわけで、情報共有と蓄積を兼ねてBlogを書くことに。
初回の題材は、Blog作成について。
更新は週1-2回くらいかなぁ。

AI生成利用してどこまで楽しく、楽にできるか。

TL; DR

This blog is written

in Markdown
on VSCode
with GenAI
hosted on GitHub Pages

楽しく、簡単に、効率的に

ここから先は、このBlogでおいおい取り扱う技術を簡単に紹介していく。
実際のBlog生成の手順は、最後に取り扱う。

Write in Markdown
on VSCode
with GenAI
hosted on GitHub Pages
- メリット
- デメリット
実際の操作
- バグったら

Write in Markdown

このBlogの記事はMarkdownにて作成されている。HexoでBlogらしくCompileされ、GitHub Pages上にHostされている。

Markdownにおける、この近辺の実際の執筆内容は下記の通りだ。

Blog-withHexoAndGPages.md

## TL; DR

This blog is written

- in Markdown
- on VSCode
- with GenAI
- hosted on GitHub Pages

**簡単に、効率的に、気持ちよく**

このBlogでおいおい取り扱う技術を簡単に紹介していく。
実際の記事生成の手順は最後に取り扱う。

## in Markdown

このBlogの記事はMarkdownにて作成されている。
HexoでBlogらしくCompileされ、(DXCの) GitHub Pages上にHostされている。

ここまでの内容の実際の執筆内容は下記の通りだ。

Markdownの詳細な説明は今後の記事にて行うが、ここでは簡単にメリットを挙げておこう。

シンプルで視認性のよいMarkup言語
- HTMLやLaTeXほどの自由度はないが、普段使いできるほど軽量
- なんならHTMLもある程度利用できる
#で見出し、-で箇条書き、**で太字にしている
plain textで作成されるので、管理がシンプル
compileしてよい見た目に
- css適用で自在に見た目をコントロール
- htmlやpdfなどへの変換も可能
プラットフォームに依存しないので、どこでも編集可能
Gitなどのバージョン管理システムと相性が良い

ちなみに、Compileしたときの見た目の例は以下の通り。
CSSをかませているので、ちょっとおしゃれな見た目になっている。

on VSCode

VSCodeは軽量でカスタマイズ性が高いエディタだ。Markdownを扱うには最適で、多くの拡張機能が利用可能だ。以下にVSCodeのメリットを挙げる。

マルチプラットフォーム対応（Windows, macOS, Linux）
拡張機能が豊富で、自分好みにカスタマイズ可能
Gitとの連携がスムーズで、バージョン管理が簡単
内蔵ターミナルで効率的に作業が進む
ライブプレビュー機能があり、Markdownの見た目をリアルタイムで確認できる

VSCodeは見た目からしておしゃれでわくわくさせてくれる。
VSCode Interface

with GenAI

この記事は生成AIを活用して作成されている。生成AIを使うことで、短時間で高品質なコンテンツを生成できる。具体的なメリットを以下に挙げる。

短時間で大量のコンテンツを生成可能
自然な言語表現が得やすい
編集や修正が容易
様々なスタイルやトーンに対応可能

DXC Chatへの指示内容の一部

GenAI Example

正直、一度の適当な指示では案外指示を無視するなという印象。
これからブラッシュアップしていきたい。
前の節を参考にして書くようにとは指示したが、さすがにこれは参考にしすぎだろう。

hosted on GitHub Pages

GitHubはソースコードのホスティングサービスだ。

GitHub Repositoryの例

GitHub Pagesはその機能の一部で、静的なウェブサイトをホスティングするのに適している。メリットとデメリットを以下に挙げる。

メリット

無料で使える
自動デプロイ機能がある
プロジェクトの一部として管理しやすい
カスタムドメインも設定可能

デメリット

サーバーサイドの処理が必要な場合には不向き
大規模なトラフィックに対しては対応が限られる

実際の操作

では最後に、初回のBlog作成と毎回の記事作成の操作手順を説明しよう。
具体的な操作手順は次の記事を参考にしてもらうことにして、ここでは簡単に流れを記す
https://qiita.com/genie-oh/items/8c19668c7dae6b4a153e

GitHubアカウント登録、Repository作成
(WSL環境推奨で) 関連ソフト install
(記事変換を行う) hexoの初期設定を行う
- GitHub PagesのURLが企業用GitHubなので異なる点に注意。
  - アカウントがtyoshitake2の場合はhttps://github.dxc.com/pages/tyoshitake2/tyoshitake2.github.io/になる
記事を作成する