Zenn
👋

【Windows】1日2つだけのコマンドで、見返したくなるTILを投稿する

に公開
til
idea

■ はじめに

現在プログラミングを学習中の初心者です。今回が初めての記事投稿です。
この記事では、

  • 1日2つだけのコマンドでGitHubにTILを投稿する方法
  • 後々見返したくなるようなTILのディレクトリ構成

について共有します。
もし間違いや改善点があれば、ご教示いただけると幸いです🙇‍♀️🙏

■ TILとは？

TILは、「Today I Learned」の略です。
以下の記事がわかりやすいです。
https://www.asobou.co.jp/blog/web/github-til
https://makitani.net/shimauma/today-i-learned

GitHubで毎日記録すると毎日の草（コミット履歴）にも反映されて、日々の努力を一段と理解しやすくなります😊

■ 筆者環境

Windows11
WSL2（Ubuntu24.04）
※本記事内で登場するコマンド操作は、Ubuntuで入力しています。
Git
GitHub

■ 対象読者

  • 基本的なGitコマンド（pull,add,commit,pushなど）を使った経験がある方
  • 基本的なシェルコマンド（cd, mkdir, touchなど）を使った経験がある方
  • 最小限のコマンド・クリック数で毎日草(GitHubのコミット履歴)を生やしたい方
  • あとあと見返したくなるような学習振り返りを作成したい方
  • .bashrcでaliasなどの設定をした経験があると、なお◎
  • なるべくMacユーザーにも役立つように意識していますが、筆者環境の問題でWindowsユーザーの方が真似しやすい部分は多いかと思います🙇‍♀️

■ 注意事項

  • 本記事に登場するcode は、Windows限定のコマンドです。
    Macでも追加設定(別筆者様の記事に移動します)をすれば使用可能のようですが、
    後述のファンクション設定でも使用可能かどうかは未確認です🙇‍♀️
  • 本記事内では、.bashrcを使用します。zshをお使いの方は適宜書き換えて実行ください。
    ＜例＞
    ・.bashrc → .zshrc
    ・ source ~/.bashrc → source ~/.zshrc
  • 本記事内では、マークダウン記法の説明は行いません。
    マークダウン記法（[リンクテキスト](URL)や# 見出しなど）に不慣れな方は、下記のような記事を参照いただけますと幸いです。

https://docs.github.com/ja/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax

https://qiita.com/kamorits/items/6f342da395ad57468ae3

■ 事前準備

TILリポジトリを作成

TILリポジトリ（GitHub・ローカル環境）を未作成の方は、以下対応ください。

  1. GitHub上でTILリポジトリを作成する。
    以下記事「GitHubでリポジトリを作成する」の通りに進めるとわかりやすいかと思います。

https://www.asobou.co.jp/blog/web/github-til
2. 作成したTILリポジトリを、ローカル環境にクローンする。
ターミナルで作業ディレクトリに移動し、以下のコマンドを実行します。
※作業ディレクトリは各自で決めます。
(筆者はホームディレクトリ直下にTILリポジトリをクローンしています)
※ホームディレクトリ = Ubuntuなどを起動したときに初期表示されるディレクトリ

※下記User_nameの部分には、自分のGitHubのユーザーネームを入力します。（カッコ不要）
※下記Ripository_nameの部分には、GitHubで設定したリポジトリ名（til, TILなど）を入力します。（カッコ不要）

 git clone git@github.com:(※⚠️User_name)/(※⚠️Ripository_name).git

■ 本題

1日2つだけのコマンドでGitHubにTILを投稿する方法

※本記事では、mainブランチのみでTIL投稿を行います。

🤔従来のコマンド操作（計6つのコマンド入力）

従来は、GitHubにTILを投稿するにあたって下記のコマンド入力が必要です。

TIL編集開始まで → 3回コマンド入力
# TILのディレクトリへ移動
cd (TILのディレクトリを指定)

# GitHub側ディレクトリの情報を、ローカル環境に反映
git pull origin main

# 【Macユーザ要注意】VSCodeでディレクトリ（フォルダー）を開く
code .
TIL編集後 → 3回コマンド入力

※TIL編集開始までのコマンド操作後に編集したファイルを、すべて一気に登録する手順となります。

# 編集したファイルをステージングエリアに登録
git add .

# ステージングエリアに登録したファイルをコミットする
git commit -m "⚠️コミットメッセージ"

# コミットしたファイルをプッシュし、変更をリモートリポジトリへ反映する
git push origin main

😁ファンクション（関数）で計2つのコマンド入力に

先ほどの手順では計6回のコマンド入力が必要でしたが、.bashrcファイルでファンクション（関数）を登録することにより、毎日のコマンド入力をたったの2回に減らせます！
最初の登録だけ少し大変ですが、1度登録してしまえば毎日のTIL投稿が一気にラクになるので、頑張って登録してみましょう💪

□ ファンクション使用イメージ

先に、ファンクションを作ることで どのようにTIL投稿ができるようになるのかを紹介します。

TIL編集開始まで → コマンド入力1回
# TILのディレクトリへ移動
# GitHub側ディレクトリの情報を、ローカル環境に反映
# コードエディタでディレクトリ（フォルダー）を開く
til
TIL編集後 → コマンド入力1回

※⚠️コミットメッセージ には各々のコミットメッセージを入れます。
　シングルまたはダブルクォーテーションも付けてください。

# 編集したファイルをステージングエリアに登録
# ステージングエリアに登録したファイルをコミットする
# コミットしたファイルをプッシュし、変更をリモートリポジトリへ反映する
til_cmpsh '⚠️コミットメッセージ'
□ ファンクションの作り方

大変お待たせしました（?）
それでは、一緒にファンクションを作ってみましょう。

  1. ホームディレクトリ（Ubuntuなどを起動したときに初期表示されるディレクトリ）直下にある、 .bashrc をコードエディタなどで開きます。
    Windowsであれば code .bashrcの実行でVSCodeによる.bashrc起動ができます。
  2. .bashrc 内で、以下のようにファンクションを書いていきます。
    ※(⚠️pwdコマンドで返される絶対パス)の部分には、ローカル環境のTILのディレクトリでpwdを実行したときに返される絶対パスを入力します。（カッコ不要）
# TIL起動
til() {
  cd (⚠️pwdコマンドで返される絶対パス)
  git pull origin main
  code .
}

# Til_add~push
# 引数にコミットメッセージのコメントを""で囲って記載
til_cmpsh() {
    local commit_message="$1"
    
    # 引数チェック
    if [ -z "$commit_message" ]; then
        echo "使用方法: til_cmpsh <"コミットメッセージ">"
        return 1
    else
        cd (⚠️pwdコマンドで返される絶対パス)
        git add .
        git commit -m "$commit_message"
        git push origin main
    fi
}
上記コード説明

til()

→ TIL編集開始までのコマンドをまとめたファンクションです。
コマンド実行するときは、tilだけ入力してEnterを押します。
cd の後は絶対パスを指定しているので、どのディレクトリから実行しても、
TILのディレクトリに移動してgit pullやcodeコマンドを実行してくれます。

til_cmpsh()

→ TIL編集後のコマンドをまとめたファンクションです。
「ファイルを保存して、GitHubなどにアップロードする」一連の流れを、1回のコマンドで済ませられるようにする関数、のイメージです。
コマンド実行するときは、til_cmpsh 'add:0615til'のように入力してEnterを押します。
この'add:0615til'は、コミットメッセージになります。

  1. local commit_message="$1"

    • cmpsh の後ろのコミットメッセージを commit_message という変数に保存します。
    • シェルスクリプトの世界において、"$1"は第1引数の参照を行います。

  2. if [ -z "$commit_message" ]; then

    • もしコミットメッセージが入力されていなければ（空っぽなら）…
    echo "使用方法: til_cmpsh <"コミットメッセージ">"
return 1
    • 「こうやって使ってね」という案内を表示して、処理をやめます。
    • -zは、「文字列長が0なら真」という意味のオプションです。
    • return 1は、エラーとして処理を終了するための書き方です。

  3. else

    • コメントがある場合は、以下の処理を実行：
    cd (⚠️pwdコマンドで返される絶対パス)
    • 特定の作業ディレクトリに移動します。
    • ※ここは実際には cd /home/username/TIL のように絶対パスを書く必要があります。
      pwdコマンドで確認して置き換えてください。
    git add .
    • 編集した（追加・削除も含む）すべてのファイルをステージングエリアに登録します。
    git commit -m "$commit_message"
    • 登録したファイルを、入力されたコミットメッセージを付けてコミットします。
    git push origin main
    • コミットしたファイルをプッシュし、変更をリモートリポジトリへ反映します。
    • main は反映先の名前ブランチ名です。
  1. 最後に、source ~/.bashrcを実行して .bashrc に記述した内容を読み込ませます。
    .bashrcで設定をしても、source ~/.bashrcを実行しなければ設定が反映されないのでご注意ください。

以上で、毎日2回だけのコマンド入力でGitHubにTILを投稿する方法の登録完了です！
ぜひ、til til_cmpshを使って毎日TILを投稿してみてください🌱

後々見返したくなるようなTILのディレクトリ構成

1. 日ごとではなく月ごとのファイルを作る

私は、日毎のファイルではどこに何があるかがすぐわからなくなり、見返したり更新したりしなくなってしまうと思ったので、月ごとにファイルを作ることにしました。
「まずは草を生やすのに慣れたい！」という方でしたら、このようにファイル内に
学習時間・大まかな学習内容を毎日追記してpushしていくと負担が少なく続けられるかと思います。
このようにまとめておくと、1週間分の学習時間を確認するのにも便利ですし、「いつ何をしていたか」も一目でわかります。

▽私の 2406.mdファイルです
Image from Gyazo

↓ 私が「月ごとのファイルで更新してみよう！」と考えるきっかけになった記事です😊
https://qiita.com/kumaryoya/items/4cb59023ee8896a328d2#できるだけ毎日草を生やす

2. 学習カテゴリごとにフォルダ分けをする

草を生やすだけではなく、日々の学習内容をしっかりアウトプットしたい！という方は、学習カテゴリごとにフォルダ分けをするのがおすすめです。
私は今のところ、下記のようにフォルダ分けしています。（sql_active_recordは微妙ですね・・。）

  • 00_til（月ごとファイルを格納、1番に表示したいので00_始まり。）
  • 99_uncategorized（未分類ファイルを格納、他カテゴリとは表示順を分けたいので99_始まり）
  • event（イベント記録ファイルを格納、以降のフォルダは恐らくアルファベット順）
  • git（git学習記録ファイルを格納）
  • rails（rails学習記録ファイルを格納）
  • ruby（ruby学習記録ファイルを格納）
  • sql_active_record（sql_active_record学習記録ファイルを格納）

3. 月ごとの学習ファイルに、詳細記録へのリンクを付ける

これは少し手間がかかりますが、せっかく学習カテゴリごとにアウトプットしているのであれば、月ごとの学習ファイルに詳細記録へのリンクを付けるのもおすすめです。
「あの日に学習してた○○、どんな内容だっけ？」といったときに、簡単に確認できるようになります。

動画のように、マークダウンのリンク表記でつかう[]()の()内に../を入力すると、他フォルダ・ファイル名の候補が出てきますので、リンクを飛ばしたいページを選択してください。
Image from Gyazo

また、ファイル名の直後に#見出し名（空白なし、#は見出しに関わらず1つ）を入れると、見出しへのジャンプも可能です。

↓ 左側がジャンプ元のページ、右側がジャンプ先のページです。
　（文字が小さいので適宜画像クリックで拡大ください🙇‍♀️）
Image from Gyazo

以上、日々のアウトプットにお役立ていただけますと幸いです。
記事をお読みいただき、ありがとうございました！

参考ページ

https://qiita.com/P-man_Brown/items/b18f31e3bb98b08ff31b
https://lazy-developer.jp/bash-zsh-differences/#toc8
https://qiita.com/shisshi_engineer/items/2edda14c742bfa9a8163
https://zenn.dev/collabostyle/articles/4ad7e7169da15b
https://qiita.com/wakayama-y/items/a9b7380263da77e51711
https://itpfdoc.hitachi.co.jp/manuals/3020/30203s3530/JPAS0299.HTM
https://qiita.com/yutat93/items/b5bb9c0366f21bcbea62

Discussion