ブログ執筆時に GitHub Copilot を使って効率化していること3選

2023.10.23

こんにちは、CX 事業本部 Delivery 部の若槻です。

GitHub Copilot は、GitHub と OpenAI が共同で開発(OpenAI Codex を利用)している AI 駆動のコード補完ツールです。VS Code などの IDE にプラグインをインストールすることで利用できます。

私は DevelopersIO のブログ記事執筆を VSCode で行っているのですが、その際に GitHub Copilot を使って効率化していることをご紹介します。(ちなみに最初の 2 つは GitHub Copilot Chat を使っているため、ChatGPT でも代替できると思います。)

効率化していること

URL スラッグの作成

ブログ記事の URL のスラッグを決める際の注意点として、SEO(検索エンジン最適化)やユーザビリティの観点から、一般的には以下のポイント(ChatGPT の回答結果より)を考慮したスラッグを設定することで、ブログの検索エンジンの視認性やユーザビリティを向上させることができます。

  1. 簡潔に: スラッグは短く、意味のあるものであるべきです。長すぎる URL はユーザーにとって扱いづらく、検索エンジンのクローラーにも効果的にインデックスされづらいことがあります。
  2. キーワードを含める: スラッグには記事の内容を表すキーワードを含めるとよいでしょう。これにより、検索エンジンのランキングに寄与する可能性があります。
  3. 不要な単語を避ける: 例えば、a、an、the などの冠詞や助詞をスラッグから除外するとよいでしょう。
  4. ハイフンを使用: スラッグ内の単語はハイフン(-)で区切るのが一般的です。アンダースコア(_)よりもハイフンの方が SEO に有利とされています。
  5. 特殊文字の使用を避ける: URL には特殊文字(例:&, %, $など)を含めないようにしましょう。これはエンコーディングの問題を引き起こす可能性があります。
  6. 一貫性を持たせる: 全ての記事のスラッグが同じスタイルや構造を持つようにしましょう。これにより、ユーザーや検索エンジンがサイトの構造を理解しやすくなります。
  7. 日付の使用を慎重に: 日付をスラッグに含めるかどうかは、サイトの内容や目的によって異なります。ニュースサイトの場合、日付を含めるのが一般的ですが、永続的なコンテンツを提供するブログの場合は、日付を省略することが推奨されることもあります。
  8. 数字のみのスラッグを避ける: 数字だけのスラッグは内容を示していないため、ユーザーにとって理解しにくく、SEO の観点からも効果的ではありません。

私は、[記事タイトル] というタイトルの記事のスラッグの候補を3つ教えて GitHub Copilot Chat に候補を出してもらい、その中から選択をするようにしています。

またスラッグ発行用のチャットを用意して、はじめに上記のやり取りをした以降は、[記事タイトル] の場合のように入力さえすれば、スラッグ候補をおのずと 3 つ生成してくれるようになり便利です。

以前はスラッグ作成に Amazon Translate を使用していたのですが、タイトル直訳となりあまりスラッグに適さない出力となることも多かったため、今ではもっぱら上記方法に頼っています。

テーブルマークダウンの作成

Web ページ上のコンテンツなどを記事の本文内にマークダウンテーブル形式で記述したい場合があります。

私の場合よくあるのが次のような Amazon Athena のマネジメントコンソールでのクエリ結果を記述したいケースです。

そのような場合は、ページ上から該当箇所をクリップボードにコピーします。

それを GitHub Copilot Chat に貼り付けて、マークダウンでテーブル形式にして のように質問すると、回答でマークダウンテーブル形式での出力結果を得ることができます。

#
id
airtemperature
timestamp
year
month
day
1	
d002
1.1
2023-10-21 17:53:41.528
2023
10
23
2	
d001
5.0
2023-10-21 17:53:41.528
2023
10
23
3	
d001
10.05
2023-10-21 17:53:41.528
2023
10
22

| id | airtemperature | timestamp                | year | month | day |
|----|----------------|-------------------------|------|-------|-----|
| 1  | d002           | 1.1                      | 2023 | 10    | 23  |
| 2  | d001           | 5.0                      | 2023 | 10    | 23  |
| 3  | d001           | 10.05                    | 2023 | 10    | 22  |

また、以前には以下記事の方法も紹介しています。テキストだけでなくリンク URL も合わせて取得したい場合は、こちらの方法が便利です。

記事文章の作成

何かしらの技術スタックや概念などの説明を記載したい場合に、[何かしら]とは、のように記述すると、GitHub Copilot が説明や定義を自動で補完してくれます。添削が必要な場合も多いのですが、大枠はそのまま利用できるので文章執筆の効率化にはなります。

おわりに

ブログ執筆時に GitHub Copilot を使って効率化していること 3 選でした。

他にも次のように Prettier や Textlint を導入したりと色々やってます。合わせて御覧ください。

参考

以上