Zenn vs Qiitaを終わらせに来た

Naoki

## はじめに
自分自身のアウトプットの場の代表格として、Zenn・Qiitaが挙げられます。せっかく、記事を執筆したのに１つのプラットフォームでしか記事が共有されないのは、少しばかりもったいないですよね。巷では、どちらかのプラットフォームに記事を移す、であったり、どちらのプラットフォームの方が優れているのか？なんていう記事が投稿されていたりします。それなら一層のこと、どちらにも投稿すれば全て解決するのでは？なんて思ったのがこのツールの開発のきっかけでした。この記事では、ZennをGitHubで管理する要領で、Qiitaにも記事を投稿可能にするためのWorkflowについて説明します。GitHub Actionsで自動化できるようになっているので、一度実装さえしてしまえば、作業量を増やすことなく２種類のプラットフォームに記事を投稿可能です。また、GitHub Actionsに関する知識がほとんどなくても、実装できるように工夫をしていますので、ぜひお試しください。

また、今回公開しているWorkflowのソースコードはGitHubにて公開しております。詳細につきまして、ご興味のある方は以下のリンクからご覧ください。

https://github.com/C-Naoki/zenn-qiita-sync

## 事前準備
初めに、このツールの使用方法について説明いたします。実際に使用している例として、このツールを使用して記事を管理している私のリポジトリをご覧いただけると、よりイメージしやすいと思います。

https://github.com/C-Naoki/zenn-archive

### 1. GitHubリポジトリを作成する
このツールでは、執筆した記事をGitHubにて管理いたします。GitHubに新たなリポジトリを作成して、以下のようなディレクトリ構造を作成してください。

```
.
├── .github
│   └── workflows
│       └── publish.yml
├── articles
│   └── <Zenn形式の記事>
├── books
│   └── <Zenn形式の本 (任意)>
├── images
│   └── <記事で使用する画像ファイル>
└── qiita
    └── public
        └── <Qiita形式の記事>
```

ポイントとしては、`articles/` の中に執筆した記事を格納すると、`publish.yml`によって、自動的にQiita形式の記事が生成され、`qiita/public/`に格納されます。また、`books/`に保存されている本については、Qiitaへの同期は行われないことに注意してください。

### 2. Qiitaのアクセストークンを取得する
Qiita-CLIを使用するために、Qiitaのアクセストークンを取得する必要があります。https://qiita.com/settings/tokens/new からアクセストークンを取得してください。取得の流れの詳細については、以下をご確認ください。

https://github.com/increments/qiita-cli/tree/main#qiita-のトークンを発行する

### 3. QiitaアクセストークンをGitHubリポジトリにシークレット変数として登録する
`https://github.com/<USERNAME>/<REPO>/settings/secrets/actions/new` にアクセスして登録を行なってください（ただし、`<USERNAME>, <REPO>`については、作成したリポジトリの情報に置き換えてください）。ここで、`Name`に`QIITA_TOKEN`を、`Secret`に取得したトークンを入力し、`Add Secret`ボタンをクリックしてください。

以下のようになれば、登録完了です。

![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/zenn-qiita-sync-workflow/secrets.png)

### 4. GitHub ActionsのWorkflowを設定する
最後に、自動化の部分を担う`publish.yml`を設定します。特にこだわりがなければ、以下のコードをご使用ください。

```yaml
name: Publish articles

on:
  push:
  branches:
    - main
    - master
  workflow_dispatch:

permissions:
  contents: write

concurrency:
  group: ${{ github.workflow }}-${{ github.ref }}
  cancel-in-progress: false

jobs:
  publish_articles:
  runs-on: ubuntu-latest
  timeout-minutes: 5
  steps:
    - name: Checkout
      uses: actions/checkout@v4
      with:
        fetch-depth: 0

    - name: Run
      uses: C-Naoki/zenn-qiita-sync@main
      with:
        qiita-token: ${{ secrets.QIITA_TOKEN }}
```

他の設定として、`convert-commit-message`, `qiitacli-commit-message`なども使用することが可能です。今後のアップデートで、より柔軟な機能を追加する予定です。

## 使い方
使い方の基本としては、Zenn CLIと同様です。ここでは最低限の使い方を説明いたします。Zenn CLIの詳細については、以下の公式ドキュメントをご確認ください。

https://zenn.dev/zenn/articles/zenn-cli-guide

### 1. Zenn CLIをインストールする
以下の記事で説明されている手順に従って、Zenn CLIをインストールしてください。但し、Node.jsを使用することが前提となります。Node.jsのインストールについては、どのようなものでも良いですが、個人的には[volta](https://volta.sh/)をお勧めします。

https://zenn.dev/zenn/articles/install-zenn-cli

### 2. 記事を作成する
以下のコマンドを実行することで、記事のテンプレートを作成することができます。

```bash
npx zenn new:article --slug 記事のスラッグ --title タイトル
```

執筆後には、GitHubリポジトリにプッシュすることで、記事の投稿が完了します。

## コードの詳細
最後に、私が実装したコードの詳細について部分的に説明いたします。ここから先の情報は、ツールを使用する上で必須ではありませんが、興味がある方はご参照ください。

```yml
inputs:
  root:
    required: false
    default: "./qiita"
    description: "Root directory path"
  qiita-token:
    required: true
    description: 'Qiita API token'
  convert-commit-message:
    required: false
    default: "Convert Zenn articles to Qiita format"
    description: "Commit message for converting Zenn articles to Qiita format"
  qiitacli-commit-message:
    required: false
    default: "Updated by qiita-cli"
    description: "Qiita commit message"
```

この部分では、Workflowの入力値の設定を行なっています。基本的には、`qiita-token`だけ指定していただければ使用できる形式にしています。お好みに合わせて値を設定してください。

- `root`には、Qiita形式の記事を格納するディレクトリを指定します。
- `qiita-token`には、Qiitaのアクセストークンを指定します。
- `convert-commit-message`には、Zenn形式の記事から生成されたQiita形式の記事をプッシュする際のコミットメッセージを指定します。
- `qiitacli-commit-message`には、Qiita CLIを使用してQiitaに記事を投稿する際の変更点をプッシュする際のコミットメッセージを指定します。

```yml
runs:
  using: "composite"
  steps:
    ...
    - name: Get changed markdown files
      id: files
      run: |
        git diff --name-only ${{ github.event.before }} ${{ github.sha }} | grep "^articles/.*\.md$" > $GITHUB_WORKSPACE/changed_files.txt
        echo "📋 Changed markdown files:"
        cat $GITHUB_WORKSPACE/changed_files.txt
      continue-on-error: true
      shell: bash
```

ここで、前回のコミットにおいて、Zennの記事に修正が加わっているかどうかを判定します。そして、その変更されたファイルの名前を`changed_files.txt`を保存しています。また、GitHub Actionsのログから、どのファイルが変更されたか一目で理解できるように、絵文字付きで`changed_files.txt`の中身を表示しています。

```yml
runs:
  using: "composite"
  steps:
    ...
    - name: Convert Zenn articles to Qiita format
      run: |
        for file in $(cat $GITHUB_WORKSPACE/changed_files.txt); do
          filename=$(basename "$file" .md)
          echo "🚀 Convert $file to Qiita format"
          if [[ "$file" != articles/* ]]; then
            echo "⚠️ invalid file path: $file"
            if [[ -f "qiita/public/$filename.md" ]]; then
              echo "delete qiita/public/$filename.md cuz it's not included in articles/"
              rm "qiita/public/$filename.md"
            fi
            continue
          fi
          if grep -q "published: true" "$file"; then
            if [[ ! -f "qiita/public/$filename.md" ]]; then
              echo "🌱 Create new Qiita article"
              cd ./qiita
              npx qiita new "$filename"
              cd ../
            fi
            echo "🚚 Convert $file to qiita/public/$filename.md"
            node ${{ github.action_path }}/dist/index.js "$file" "./qiita/public/$filename.md"
          fi
        done
      shell: bash
      if: steps.files.outcome == 'success'
```

この部分にて、変更が加わったZenn形式の記事をQiita形式の記事に変換します。前半部分では、`articles/`に存在しないが、`qiita/public`には存在するファイルを削除しています。すなわち、Zenn形式の記事を削除した場合に、Qiita形式の記事も削除されるようにしています。また、後半部分では、`published: true`が指定されている、すなわち、記事を公開する設定がされているファイルについて、Qiitaの記事が存在しない場合はQiita形式の記事用のテンプレートを生成するようにし、その後、Zenn形式の記事をQiita形式の記事に変換しています。

変換のためのコードについては、`scripts/`ディレクトリに格納しているtypescriptのコードを、`@vercel/ncc`にてコンパイルした`dist/index.js`を使用しています。詳細については、以下の記事にて紹介されていたコードをベースに一部改良を加えたものを使用しています。

https://zenn.dev/ot07/articles/zenn-qiita-article-centralized

## まとめ
この記事では、ZennとQiitaの記事を同時に管理するためのWorkflowについて説明いたしました。GitHub Actionsを使用することで、自動化も実現しています。また、GitHub Actionsに関する知識がほとんどなくても、実装できるようにテンプレートも用意しているので、ぜひお試しください。また、使用にあたって疑問点や改善点等あれば、[issue](https://github.com/C-Naoki/zenn-qiita-sync/issues)を立てていただけると幸いです。

## 参考文献
有益な情報や価値あるコードを提供してくださった以下の記事及びOSSに感謝申し上げます。

https://github.com/zenn-dev/zenn-editor/tree/canary/packages/zenn-cli

https://github.com/increments/qiita-cli/

https://zenn.dev/ot07/articles/zenn-qiita-article-centralized

https://qiita.com/shunk_jr/items/7d1029cae8f83ee8fd84


画像結合のためのアルゴリズムを考えてみた

PythonのTips集

PLaMo-100Bのβ版トライアルAPIを用いてデモ用アプリを作ってみた


## はじめに

[PyClone](https://github.com/C-Naoki/pyclone)は、[my-python-template](https://github.com/C-Naoki/my-python-template)を効率的に利用するために私が作成したコマンドラインユーティリティです。このツールを使用すると、プロジェクトのクローン、セットアップ、GitHubへの初期バージョンのコミットを素早く行うことができます。my-python-templateに関するZennの記事は[こちら](https://zenn.dev/naoki0103/articles/my-python-template-20230629)をご覧ください。

## セットアップ

PyCloneを使用するためには、まず`pyclone`関数をシェルの設定ファイルにコピーする必要があります。Bashユーザーの場合は`.bashrc`、ZSHユーザーの場合は`.zshrc`となります。

関数の宣言は以下のようになります：

```bash
pyclone() {
    ...
}
```

## 環境変数

PyCloneを使用するためには、以下の2つの環境変数を定義する必要があります：

- `PYCLONE_PATH`: この変数には、新しいプロジェクトディレクトリを作成したいディレクトリへのパスを含める必要があります。
- `GITHUB_TOKEN`: ここにはGitHubのアクセストークンを含める必要があります。このトークンはGitHub上に新しいリポジトリを作成する際に使用されます。GitHubのアクセストークンについての詳細は、[こちら](https://docs.github.com/ja/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token)をクリックしてください。

## 使用方法

PyCloneは、ターミナルで`pyclone`を呼び出すだけで起動できます。PyCloneに自動的に新しいリポジトリをGitHub上に作成し、初期コミットを行うように指示する場合は、`-g`オプションを使用できます：

```bash
pyclone -g
```

実行中に、PyCloneは仮想環境の名前を尋ねます。これは新しいプロジェクトのディレクトリ名としても使用されます。ディレクトリがすでに存在する場合、PyCloneはそれを上書きするかどうかを尋ねます。`-g`オプションが使用された場合、PyCloneは新しいリポジトリをGitHub上に公開するかどうかも尋ねます。

## PyCloneのコード解説

以下に、PyCloneの主要な部分のコードを抜粋し、それぞれが何をしているのかを詳細に説明します。

### 1. 環境変数のチェック

```bash
if [ -z "${PYCLONE_PATH}" ]; then
    echo "Error: PYCLONE_PATH is not defined. Please define PYCLONE_PATH."
    return 1
fi

clone_path=${PYCLONE_PATH}
clone_git_path=${clone_path}/git/
```

ここでは、環境変数`PYCLONE_PATH`が定義されているかどうかをチェックします。この環境変数は新しいプロジェクトディレクトリを作成する場所を指定するためのものです。定義されていない場合、エラーメッセージが表示され、関数は終了します。これにより、ユーザーは自分の環境に合わせてプロジェクトの保存場所を自由に設定できます。

### 2. オプションの解析

```bash
while getopts "g" opt; do
    case $opt in
        g)
            git_flag=1
            ;;
        \?)
            echo "Invalid option: -$OPTARG"
            return 1
            ;;
    esac
done
shift $((OPTIND -1))
```

この部分では、`getopts`を使用してコマンドラインオプションを解析します。`-g`オプションが指定された場合、`git_flag`が1に設定され、後でGitHubに新しいリポジトリを作成するために使用されます。これにより、ユーザーは新しいプロジェクトをローカルだけでなくGitHubにも作成することが可能になります。

### 3. ディレクトリ名の入力と上書きの確認

```bash
echo -n "What is the virtual environment name? [$default_dir_name]: "
read dir_name
dir_name=${dir_name:-$default_dir_name}

if [ -d "${clone_path}/${dir_name}" ] || [ -d "${clone_git_path}/${dir_name}" ]; then


default_overwrite="no"
    while : ; do
        echo -n "The directory ${dir_name} already exists. Overwrite? (yes/no) [$default_overwrite]: "
        read overwrite
        overwrite=${overwrite:-$default_overwrite}
        if [[ "$overwrite" == "yes" ]] || [[ "$overwrite" == "no" ]]; then
            break
        else
            echo "Please enter either 'yes' or 'no'."
        fi
    done
    if [[ "$overwrite" == "no" ]]; then
        echo "Operation cancelled by user."
        return 1
    fi
fi
```

ここでは、ユーザーに仮想環境の名前（新しいプロジェクトのディレクトリ名）を入力してもらいます。その後、指定された名前のディレクトリがすでに存在する場合は、それを上書きするかどうかをユーザーに尋ねます。上書きを拒否した場合、関数は終了します。これにより、既存のプロジェクトを誤って上書きすることなく、安全に新しいプロジェクトを作成することができます。

### 4. リポジトリの公開設定

```bash
if [ $git_flag -eq 1 ]; then
    while : ; do
        echo -n "Do you publish the repository? (yes/no) [$default_publish]: "
        read publish
        publish=${publish:-$default_publish}
        if [[ "$publish" == "yes" ]] || [[ "$publish" == "no" ]]; then
            break
        else
            echo "Please enter either 'yes' or 'no'."
        fi
    done
fi
```

この部分は、`-g`オプションが指定された場合にのみ実行されます。ユーザーに新しいリポジトリを公開するかどうかを尋ねます。公開する場合は`yes`、公開しない場合は`no`を入力します。これにより、ユーザーは新しいプロジェクトを公開するかプライベートにするかを自由に選択することができます。

### 5. リポジトリのクローンと初期設定

```bash
git clone https://github.com/C-Naoki/my-python-templete.git $dir_name
cd $dir_name
sed -i "" "s/my-python-templete/$dir_name/g" pyproject.toml
rm -rf .git

make install
git init

echo "# $dir_name" > README.md
```

この部分では、まずmy-python-templateリポジトリをクローンし、そのディレクトリに移動します。次に、`pyproject.toml`ファイル内のプロジェクト名を新しいディレクトリ名に置き換えます。これにより、仮想環境名がmy-python-templateのままになることを防ぎます。その後、`.git`ディレクトリを削除し、新しいgitリポジトリを初期化します。最後に、新しい`README.md`ファイルを作成し、その中に新しいディレクトリ名を書き込みます。これにより、新しいプロジェクトの基本的のセットアップを一気に行うことが可能となっています。

### 6. PyGithubのインストールチェックとリポジトリ存在チェック

```bash
if [ $git_flag -eq 1 ]; then
    repo_check_file="repo_check_$$.txt"
    python -c "
    import pkg_resources
    import time
    try:
        pkg_resources.get_distribution('PyGithub')
    except pkg_resources.DistributionNotFound:
        import subprocess
        subprocess.run(['pip', 'install', 'PyGithub'])
    finally:
        import os
        from github import Github
        g = Github(os.getenv('GITHUB_TOKEN'))
        username = g.get_user().login
        try:
            g.get_user().get_repo('$dir_name')
            print('The repository $dir_name already exists on GitHub.')
        except:
            pass
    " > $repo_check_file
    if grep -q "The repository $dir_name already exists on GitHub." $repo_check_file; then
        echo "The repository $dir_name already exists on GitHub."
        rm $repo_check_file
        return 1
    fi
    rm $repo_check_file
    ...
fi
```

この部分では、まずPythonのパッケージ管理ツール`pkg_resources`を使って、`PyGithub`がインストールされているかどうかをチェックします。`PyGithub`はGitHubのAPIをPythonから利用するためのライブラリで、このスクリプトではGitHubに新しいリポジトリを作成するために使用されます。`PyGithub`がインストールされていない場合、スクリプトは自動的に`pip install PyGithub`を実行して`PyGithub`をインストールします。これにより、ユーザーは手動でライブラリをインストールする手間を省くことができます。

その後、指定された名前のリポジトリがGitHub上にすでに存在するかどうかをチェックします。存在する場合はエラーメッセージが表示され、関数は終了します。これにより、既存のリポジトリを誤って上書きすることなく、安全に新しいリポジトリを作成することができます。また、`repo_check_file`の命名にはプロセスIDを含めることで、既存のファイルを上書きすることなく一時ファイルを作成しています。これにより、複数のプロセスが同時に実行される場合でも安全に一時ファイルを扱うことが可能となっています。

### 7. GitHubリポジトリの作成と初期コミット

```bash
if [ $git_flag -eq 1 ]; then
    ...
    username=$(python -c "
    import os
    import time
    from github import Github
    g = Github(os.getenv('GITHUB_TOKEN'))
    username = g.get_user().login
    repo = g.get_user().create_repo('$dir_name', private=('$publish' == 'no'))
    while repo.clone_url is None:
        time.sleep(0.5)
        repo = g.get_repo(f'{username}/{dir_name}')
    print(username)")

    url="https://github.com/${username}/${dir_name}.git"
    git remote add origin $url
    git add .
    git commit -m ":tada: initial commit"
    git push -u origin master
fi
```

この部分は、`-g`オプションが指定された場合にのみ実行されます。まず、新しいGitHubリポジトリを作成し、そのURLを取得します。次に、新しいリポジトリをgitのリモートとして追加し、すべてのファイルをステージングします。その後、初期コミットを作成し、それをGitHubにプッシュします。これにより、新しいプロジェクトがGitHub上にも作成され、初期の状態がコミットされます。これにより、新しいプロジェクトのバージョン管理がすぐに始められます。(シンタックスハイライトがバグっています。修正方法をご存知の方は教えていただきたいです。。。)

## まとめ

以上が、PyCloneの紹介とその主要なコードの解説でした。PyCloneは、Pythonプロジェクトのテンプレートである[my-python-template](https://github.com/C-Naoki/my-python-template)を効率的に利用するためのツールです。このツールを使用することで、新しいプロジェクトのクローン、セットアップ、GitHubへの初期バージョンのコミットを素早く行うことができます。

また、コードの解説を通じて、PyCloneがどのように動作しているか、どのような処理を行っているかの詳細な説明も行いました。これにより、ユーザーは自身のニーズに合わせてPyCloneをカスタマイズすることも可能です。

PyCloneは、Pythonプロジェクトの初期設定を効率化するための強力なツールです。これを活用することで、開発者は新しいプロジェクトのセットアップにかかる時間を大幅に削減し、より重要な開発作業に集中することができます。

もし何かバグを見つけたり、あったほうがより便利になる機能があれば、ぜひGitHubのissueに投稿してください。皆様のフィードバックは、このテンプレートをより良いものにするための大切な情報源です。皆様からのご意見、ご感想をお待ちしております。


PyCloneの紹介と使い方

参考になった記事 覚書

## はじめに

Pythonプロジェクトを始める際には、プロジェクトの構造や依存関係の管理、コードの品質を保つためのツールなど、設定すべき項目が多くあります。そこで今回は、これらの設定を一元化したPythonプロジェクトのテンプレート、[my-python-template](https://github.com/C-Naoki/my-python-template)を作成しました。こちらについて今回は紹介いたします。

## my-python-templateの内容

このテンプレートには以下のファイルとフォルダが含まれています。

- `pyproject.toml`: プロジェクトの設定と依存関係を管理するためのファイルです。
- `.pre-commit-config.yaml`: pre-commitの設定を行うファイルです。
- `Makefile`: プロジェクトのビルドやテストなど、一連のコマンドを自動化するためのファイルです。
- `.mypy.ini`: 型チェッカーmypyの設定を行うファイルです。
- `.flake8`: Pythonの静的解析ツールflake8の設定を行うファイルです。
- `README.md`: プロジェクトの説明を記述するファイルです。
- `.gitignore`: Gitが追跡しないファイルやディレクトリを指定するファイルです。
- `poetry.lock`: プロジェクトの依存関係を具体的なバージョンまで固定するためのファイルです。これにより、開発環境の再現性が保たれます。
- `LICENSE`: プロジェクトのライセンスを記述するファイルです。
- `poetry.toml`: Poetryの設定を行うファイルです。

## my-python-templateの使い方

my-python-templateを新しいプロジェクトのベースとして使用するには、以下の手順を守ってください。

1. **新しいリポジトリを作成**: まず、GitHub上で新しいリポジトリを作成します。これが新しいプロジェクトのリポジトリになります。

2. **テンプレートを新しいディレクトリにクローン**: ローカルマシン上で、このテンプレートリポジトリを新しいプロジェクトになる新しいディレクトリにクローンします。その後、`.git`ディレクトリを削除してテンプレートから完全に切り離します。
    ```bash
    git clone https://github.com/C-Naoki/my-python-templete.git <new-project>
    cd <new-project>
    rm -rf .git
    ```

3. **ローカル開発環境の設定**: 必要なPythonのバージョンをインストールし、ローカルのPythonバージョンを設定し、新しいpoetry環境を作成して使用し、プロジェクトの依存関係をインストールします。これは、提供されている`Makefile`を使用して以下のコマンドで行うことができます。

    ```bash
    make install
    ```

4. **新しいリポジトリを初期化**: 次に、新しいディレクトリで新しいリポジトリを初期化します。

    ```bash
    git init
    ```

5. **新しいリポジトリのリモートを設定**: 新しいGitHubリポジトリを新しいプロジェクトのリモートとして設定します。

    ```bash
    git remote add origin <url-of-your-new-repository>
    ```

6. **新しいリポジトリにプッシュ**: 全てのファイルをステージングし、コミットし、新しいリポジトリにプッシュします。

    ```bash
    git add .
    git commit -m ":tada: initial commit"
    git push -u origin master
    ```

これらの手順に従うことで、このスターターセットを基に新しいプロジェクトを開始することができます。

## 使用ツールの紹介

このテンプレートでは、Pythonプロジェクトの品質を保つために、以下のツールが使用されています。

### Poetry

PoetryはPythonの依存関係管理とパッケージングを行うためのツールです。`pyproject.toml`と`poetry.lock`ファイルを使用して、プロジェクトの依存関係を管理します。これにより、開発環境の再現性と整合性が保たれます。また、Poetryはパッケージのバージョン管理も行うため、プロジェクトの成長とともに依存関係を適切に管理することが可能です。

### Flake8

Flake8はPythonの静的解析ツールで、コードの品質をチェックします。コードスタイルの違反やエラーを検出し、それらを修正することでコードの読みやすさと保守性を向上させます。Flake8はPEP 8というPythonの公式スタイルガイドに準拠しており、コードの一貫性を保つために役立ちます。

### Mypy

MypyはPythonの静的型チェッカーで、コードに型注

釈が正しく適用されているかを確認します。これにより、型エラーを早期に検出し、バグを防ぐことができます。Pythonは動的型付け言語ですが、大規模なプロジェクトでは型注釈を使用してコードの可読性と安全性を向上させることが推奨されています。Mypyはこのプロセスを支援します。

### isort

isortはPythonのインポートをソートするツールです。これにより、インポートの順序が一貫性を持ち、コードの読みやすさが向上します。大規模なプロジェクトでは、多数のモジュールをインポートすることがあり、それらを適切に管理することはコードの可読性に大きく影響します。isortはこの問題を解決します。

### Black

BlackはPythonの自動コードフォーマッターで、コードをPEP 8と互換性のある形式に自動的にフォーマットします。これにより、コードのスタイルが一貫性を持ち、読みやすさが向上します。Blackは"自動化された"フォーマッターであるため、開発者がコードスタイルについて考える時間を大幅に減らすことができます。

### pre-commit

pre-commitはGitのコミット時に自動的に実行されるフックを管理するツールです。このテンプレートでは、pre-commitを使用して、コミット前にFlake8、Mypy、isort、Blackを自動的に実行し、コードの品質を保つように設定されています。これにより、コードの品質を維持しながら、開発のスピードを維持することができます。

## まとめ

my-python-templateは、Pythonプロジェクトを始める際に必要な設定やツールを一元化したテンプレートです。このテンプレートを使用することで、新しいプロジェクトを迅速に開始し、コードの品質を維持することができます。Poetry、Flake8、Mypy、isort、Black、pre-commitといったツールを組み合わせて使用することで、Pythonプロジェクトの開発効率と品質を向上させることができます。

もし何かバグを見つけたり、あったほうがより便利になる機能があれば、ぜひGitHubのissueに投稿してください。皆様のフィードバックは、このテンプレートをより良いものにするための大切な情報源です。皆様からのご意見、ご感想をお待ちしております。


<h2 data-sourcepos="1:1-1:15">
<span id="はじめに" class="fragment"></span><a href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB"><i class="fa fa-link"></i></a>はじめに</h2>
<p data-sourcepos="3:1-3:451">Pythonプロジェクトを始める際には、プロジェクトの構造や依存関係の管理、コードの品質を保つためのツールなど、設定すべき項目が多くあります。そこで今回は、これらの設定を一元化したPythonプロジェクトのテンプレート、<a href="https://github.com/C-Naoki/my-python-template" rel="nofollow noopener" target="_blank">my-python-template</a>を作成しました。こちらについて今回は紹介いたします。</p>
<h2 data-sourcepos="5:1-5:30">
<span id="my-python-templateの内容" class="fragment"></span><a href="#my-python-template%E3%81%AE%E5%86%85%E5%AE%B9"><i class="fa fa-link"></i></a>my-python-templateの内容</h2>
<p data-sourcepos="7:1-7:93">このテンプレートには以下のファイルとフォルダが含まれています。</p>
<ul data-sourcepos="9:1-19:0">
<li data-sourcepos="9:1-9:107">
<code>pyproject.toml</code>: プロジェクトの設定と依存関係を管理するためのファイルです。</li>
<li data-sourcepos="10:1-10:78">
<code>.pre-commit-config.yaml</code>: pre-commitの設定を行うファイルです。</li>
<li data-sourcepos="11:1-11:134">
<code>Makefile</code>: プロジェクトのビルドやテストなど、一連のコマンドを自動化するためのファイルです。</li>
<li data-sourcepos="12:1-12:76">
<code>.mypy.ini</code>: 型チェッカーmypyの設定を行うファイルです。</li>
<li data-sourcepos="13:1-13:88">
<code>.flake8</code>: Pythonの静的解析ツールflake8の設定を行うファイルです。</li>
<li data-sourcepos="14:1-14:78">
<code>README.md</code>: プロジェクトの説明を記述するファイルです。</li>
<li data-sourcepos="15:1-15:106">
<code>.gitignore</code>: Gitが追跡しないファイルやディレクトリを指定するファイルです。</li>
<li data-sourcepos="16:1-16:191">
<code>poetry.lock</code>: プロジェクトの依存関係を具体的なバージョンまで固定するためのファイルです。これにより、開発環境の再現性が保たれます。</li>
<li data-sourcepos="17:1-17:85">
<code>LICENSE</code>: プロジェクトのライセンスを記述するファイルです。</li>
<li data-sourcepos="18:1-19:0">
<code>poetry.toml</code>: Poetryの設定を行うファイルです。</li>
</ul>
<h2 data-sourcepos="20:1-20:33">
<span id="my-python-templateの使い方" class="fragment"></span><a href="#my-python-template%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9"><i class="fa fa-link"></i></a>my-python-templateの使い方</h2>
<p data-sourcepos="22:1-22:132">my-python-templateを新しいプロジェクトのベースとして使用するには、以下の手順を守ってください。</p>
<ol data-sourcepos="24:1-58:0">
<li data-sourcepos="24:1-25:0">
<p data-sourcepos="24:4-24:180"><strong>新しいリポジトリを作成</strong>: まず、GitHub上で新しいリポジトリを作成します。これが新しいプロジェクトのリポジトリになります。</p>
</li>
<li data-sourcepos="26:1-32:0">
<p data-sourcepos="26:4-26:339"><strong>テンプレートを新しいディレクトリにクローン</strong>: ローカルマシン上で、このテンプレートリポジトリを新しいプロジェクトになる新しいディレクトリにクローンします。その後、<code>.git</code>ディレクトリを削除してテンプレートから完全に切り離します。</p>
<div class="code-frame" data-lang="bash" data-sourcepos="27:5-31:7"><div class="highlight"><pre><code>git clone https://github.com/C-Naoki/my-python-templete.git &lt;new-project&gt;
<span class="nb">cd</span> &lt;new-project&gt;
<span class="nb">rm</span> <span class="nt">-rf</span> .git
</code></pre></div></div>
</li>
<li data-sourcepos="33:1-38:0">
<p data-sourcepos="33:4-33:379"><strong>ローカル開発環境の設定</strong>: 必要なPythonのバージョンをインストールし、ローカルのPythonバージョンを設定し、新しいpoetry環境を作成して使用し、プロジェクトの依存関係をインストールします。これは、提供されている<code>Makefile</code>を使用して以下のコマンドで行うことができます。</p>
<div class="code-frame" data-lang="bash" data-sourcepos="35:5-37:7"><div class="highlight"><pre><code>make <span class="nb">install</span>
</code></pre></div></div>
</li>
<li data-sourcepos="39:1-44:0">
<p data-sourcepos="39:4-39:132"><strong>新しいリポジトリを初期化</strong>: 次に、新しいディレクトリで新しいリポジトリを初期化します。</p>
<div class="code-frame" data-lang="bash" data-sourcepos="41:5-43:7"><div class="highlight"><pre><code>git init
</code></pre></div></div>
</li>
<li data-sourcepos="45:1-50:0">
<p data-sourcepos="45:4-45:159"><strong>新しいリポジトリのリモートを設定</strong>: 新しいGitHubリポジトリを新しいプロジェクトのリモートとして設定します。</p>
<div class="code-frame" data-lang="bash" data-sourcepos="47:5-49:7"><div class="highlight"><pre><code>git remote add origin &lt;url-of-your-new-repository&gt;
</code></pre></div></div>
</li>
<li data-sourcepos="51:1-58:0">
<p data-sourcepos="51:4-51:165"><strong>新しいリポジトリにプッシュ</strong>: 全てのファイルをステージングし、コミットし、新しいリポジトリにプッシュします。</p>
<div class="code-frame" data-lang="bash" data-sourcepos="53:5-57:7"><div class="highlight"><pre><code>git add <span class="nb">.</span>
git commit <span class="nt">-m</span> <span class="s2">":tada: initial commit"</span>
git push <span class="nt">-u</span> origin master
</code></pre></div></div>
</li>
</ol>
<p data-sourcepos="59:1-59:144">これらの手順に従うことで、このスターターセットを基に新しいプロジェクトを開始することができます。</p>
<h2 data-sourcepos="61:1-61:27">
<span id="使用ツールの紹介" class="fragment"></span><a href="#%E4%BD%BF%E7%94%A8%E3%83%84%E3%83%BC%E3%83%AB%E3%81%AE%E7%B4%B9%E4%BB%8B"><i class="fa fa-link"></i></a>使用ツールの紹介</h2>
<p data-sourcepos="63:1-63:135">このテンプレートでは、Pythonプロジェクトの品質を保つために、以下のツールが使用されています。</p>
<h3 data-sourcepos="65:1-65:10">
<span id="poetry" class="fragment"></span><a href="#poetry"><i class="fa fa-link"></i></a>Poetry</h3>
<p data-sourcepos="67:1-67:461">PoetryはPythonの依存関係管理とパッケージングを行うためのツールです。<code>pyproject.toml</code>と<code>poetry.lock</code>ファイルを使用して、プロジェクトの依存関係を管理します。これにより、開発環境の再現性と整合性が保たれます。また、Poetryはパッケージのバージョン管理も行うため、プロジェクトの成長とともに依存関係を適切に管理することが可能です。</p>
<h3 data-sourcepos="69:1-69:10">
<span id="flake8" class="fragment"></span><a href="#flake8"><i class="fa fa-link"></i></a>Flake8</h3>
<p data-sourcepos="71:1-71:383">Flake8はPythonの静的解析ツールで、コードの品質をチェックします。コードスタイルの違反やエラーを検出し、それらを修正することでコードの読みやすさと保守性を向上させます。Flake8はPEP 8というPythonの公式スタイルガイドに準拠しており、コードの一貫性を保つために役立ちます。</p>
<h3 data-sourcepos="73:1-73:8">
<span id="mypy" class="fragment"></span><a href="#mypy"><i class="fa fa-link"></i></a>Mypy</h3>
<p data-sourcepos="75:1-75:64">MypyはPythonの静的型チェッカーで、コードに型注</p>
<p data-sourcepos="77:1-77:388">釈が正しく適用されているかを確認します。これにより、型エラーを早期に検出し、バグを防ぐことができます。Pythonは動的型付け言語ですが、大規模なプロジェクトでは型注釈を使用してコードの可読性と安全性を向上させることが推奨されています。Mypyはこのプロセスを支援します。</p>
<h3 data-sourcepos="79:1-79:9">
<span id="isort" class="fragment"></span><a href="#isort"><i class="fa fa-link"></i></a>isort</h3>
<p data-sourcepos="81:1-81:421">isortはPythonのインポートをソートするツールです。これにより、インポートの順序が一貫性を持ち、コードの読みやすさが向上します。大規模なプロジェクトでは、多数のモジュールをインポートすることがあり、それらを適切に管理することはコードの可読性に大きく影響します。isortはこの問題を解決します。</p>
<h3 data-sourcepos="83:1-83:9">
<span id="black" class="fragment"></span><a href="#black"><i class="fa fa-link"></i></a>Black</h3>
<p data-sourcepos="85:1-85:422">BlackはPythonの自動コードフォーマッターで、コードをPEP 8と互換性のある形式に自動的にフォーマットします。これにより、コードのスタイルが一貫性を持ち、読みやすさが向上します。Blackは"自動化された"フォーマッターであるため、開発者がコードスタイルについて考える時間を大幅に減らすことができます。</p>
<h3 data-sourcepos="87:1-87:14">
<span id="pre-commit" class="fragment"></span><a href="#pre-commit"><i class="fa fa-link"></i></a>pre-commit</h3>
<p data-sourcepos="89:1-89:424">pre-commitはGitのコミット時に自動的に実行されるフックを管理するツールです。このテンプレートでは、pre-commitを使用して、コミット前にFlake8、Mypy、isort、Blackを自動的に実行し、コードの品質を保つように設定されています。これにより、コードの品質を維持しながら、開発のスピードを維持することができます。</p>
<h2 data-sourcepos="91:1-91:12">
<span id="まとめ" class="fragment"></span><a href="#%E3%81%BE%E3%81%A8%E3%82%81"><i class="fa fa-link"></i></a>まとめ</h2>
<p data-sourcepos="93:1-93:504">my-python-templateは、Pythonプロジェクトを始める際に必要な設定やツールを一元化したテンプレートです。このテンプレートを使用することで、新しいプロジェクトを迅速に開始し、コードの品質を維持することができます。Poetry、Flake8、Mypy、isort、Black、pre-commitといったツールを組み合わせて使用することで、Pythonプロジェクトの開発効率と品質を向上させることができます。</p>
<p data-sourcepos="95:1-95:344">もし何かバグを見つけたり、あったほうがより便利になる機能があれば、ぜひGitHubのissueに投稿してください。皆様のフィードバックは、このテンプレートをより良いものにするための大切な情報源です。皆様からのご意見、ご感想をお待ちしております。</p>


Pythonプロジェクトのためのテンプレート: my-python-templateの紹介


## はじめに
今まで読んだ記事の中で、特に参考になったもの・保存しておきたいものをまとめておきます。主に、自分のためのメモとして作成しています。

## 論文執筆
### [アカデミックヤクザにキレられないためのLaTeX論文執筆メソッド](https://qiita.com/suigin/items/10960e516f2d44f6b6de)
- 執筆者：[suigin](https://qiita.com/suigin)さん
- サイト：Qiita
#### 補足
- LaTeXを用いて論文執筆をする際、体裁を整えるための様々な注意事項が紹介されている。
### [【LaTeX】\footnoteも\refしたい](https://qiita.com/migawariw/items/ac2b940f5dc7e870850a)
- 執筆者：[みがわり](https://qiita.com/migawariw)さん
- サイト：Qiita

## 機械学習
### [『パターン認識と機械学習』の攻略ノート：記事一覧](https://www.anarchive-beta.com/entry/2021/01/06/092619)
- 執筆者：[しょこ](https://www.anarchive-beta.com/about)さん
- サイト：はてなブログ
#### 補足
- Python, R を用いた実装例も紹介されている。
- 他にも色々な面白そうな本についての記事も作成されている。[[参考](https://www.anarchive-beta.com/entry/2020/07/13/071300)]

## ソフトウェア開発
### [Git push後のコミットメッセージを変更する方法](https://qiita.com/kaiou_fight/items/32c1798415338537ec49)
- 執筆者：[oh tsuchiya](https://qiita.com/kaiou_fight)さん
- サイト：Qiita
### [Poetry1.5.1からGPU版のPytorchのインストールが簡単になりました](https://zenn.dev/zerebom/articles/b338784c8ac76a)
- 執筆者：[zerebom](https://zenn.dev/zerebom)さん
- サイト：Zenn
### [エラーや実行完了をLINEで通知する【Python】](https://qiita.com/Jun-T/items/a63eb60ff75ede0ada04)
- 執筆者：[T Jun](https://qiita.com/Jun-T)さん
- サイト：Qiita
### [変更があるときだけコミット [GitHub Actions]](https://zenn.dev/snowcait/articles/903d86d668fcb7)
- 執筆者：[雪猫](https://zenn.dev/snowcait)さん
- サイト：Zenn
### [pyenvで最新バージョンがインストールできない](https://qiita.com/takoz/items/fa953620dee68cb87575)
- 執筆者：[takoz](https://qiita.com/takoz)さん
- サイト：Qiita

## デザイン
### [コストや時間の削減表現のテンプレート配布します！](https://raku-pre.com/cost_reduction/)
- サイト：[ラクプレ](https://raku-pre.com/)

## 数学
### [ベクトル・行列の微分チートシート](https://tekrog.com/cheatsheet-differentiation-of-vectors-and-matrices)
- サイト：[TekRog](https://tekrog.com)

## 付録（自筆記事）
最後に、手前味噌にはなりますが、宣伝を兼ねて自分の記事も紹介させていただきます
### Zenn vs Qiitaを終わらせに来た [[Zenn]](https://zenn.dev/naoki0103/articles/zenn-qiita-sync-workflow) [[Qiita]](https://qiita.com/C-naoki/items/5c5609b82a67335bf3be)
- GitHub Actionsを用いて、ZennとQiitaの記事を同期させる方法を紹介しています。
- 一度設定をしてしまえば、その後特に手を煩わすことなく、同時にZennとQiitaに記事を自動で投稿することができます。

### 画像結合のためのアルゴリズムを考えてみた [[Zenn]](https://zenn.dev/naoki0103/articles/image-stitcher-application) [[Qiita]](https://qiita.com/C-naoki/items/bf973b041709ad0cd635)
- 画像結合のためのシンプルなアルゴリズムを考え、Pythonで実装してみました。


<h2 data-sourcepos="2:1-2:15">
<span id="はじめに" class="fragment"></span><a href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB"><i class="fa fa-link"></i></a>はじめに</h2>
<p data-sourcepos="3:1-3:195">今まで読んだ記事の中で、特に参考になったもの・保存しておきたいものをまとめておきます。主に、自分のためのメモとして作成しています。</p>
<h2 data-sourcepos="5:1-5:15">
<span id="論文執筆" class="fragment"></span><a href="#%E8%AB%96%E6%96%87%E5%9F%B7%E7%AD%86"><i class="fa fa-link"></i></a>論文執筆</h2>
<h3 data-sourcepos="6:1-6:145">
<span id="アカデミックヤクザにキレられないためのlatex論文執筆メソッド" class="fragment"></span><a href="#%E3%82%A2%E3%82%AB%E3%83%87%E3%83%9F%E3%83%83%E3%82%AF%E3%83%A4%E3%82%AF%E3%82%B6%E3%81%AB%E3%82%AD%E3%83%AC%E3%82%89%E3%82%8C%E3%81%AA%E3%81%84%E3%81%9F%E3%82%81%E3%81%AElatex%E8%AB%96%E6%96%87%E5%9F%B7%E7%AD%86%E3%83%A1%E3%82%BD%E3%83%83%E3%83%89"><i class="fa fa-link"></i></a><a href="https://qiita.com/suigin/items/10960e516f2d44f6b6de" id="reference-5058ee1ad964a9ae10e2">アカデミックヤクザにキレられないためのLaTeX論文執筆メソッド</a>
</h3>
<ul data-sourcepos="7:1-8:19">
<li data-sourcepos="7:1-7:54">執筆者：<a href="https://qiita.com/suigin">suigin</a>さん</li>
<li data-sourcepos="8:1-8:19">サイト：Qiita</li>
</ul>
<h4 data-sourcepos="9:1-9:11">
<span id="補足" class="fragment"></span><a href="#%E8%A3%9C%E8%B6%B3"><i class="fa fa-link"></i></a>補足</h4>
<ul data-sourcepos="10:1-10:121">
<li data-sourcepos="10:1-10:121">LaTeXを用いて論文執筆をする際、体裁を整えるための様々な注意事項が紹介されている。</li>
</ul>
<h3 data-sourcepos="11:1-11:98">
<span id="latexfootnoteもrefしたい" class="fragment"></span><a href="#latexfootnote%E3%82%82ref%E3%81%97%E3%81%9F%E3%81%84"><i class="fa fa-link"></i></a><a href="https://qiita.com/migawariw/items/ac2b940f5dc7e870850a" id="reference-6499791dada3a5498915">【LaTeX】\footnoteも\refしたい</a>
</h3>
<ul data-sourcepos="12:1-14:0">
<li data-sourcepos="12:1-12:63">執筆者：<a href="https://qiita.com/migawariw">みがわり</a>さん</li>
<li data-sourcepos="13:1-14:0">サイト：Qiita</li>
</ul>
<h2 data-sourcepos="15:1-15:15">
<span id="機械学習" class="fragment"></span><a href="#%E6%A9%9F%E6%A2%B0%E5%AD%A6%E7%BF%92"><i class="fa fa-link"></i></a>機械学習</h2>
<h3 data-sourcepos="16:1-16:134">
<span id="パターン認識と機械学習の攻略ノート記事一覧" class="fragment"></span><a href="#%E3%83%91%E3%82%BF%E3%83%BC%E3%83%B3%E8%AA%8D%E8%AD%98%E3%81%A8%E6%A9%9F%E6%A2%B0%E5%AD%A6%E7%BF%92%E3%81%AE%E6%94%BB%E7%95%A5%E3%83%8E%E3%83%BC%E3%83%88%E8%A8%98%E4%BA%8B%E4%B8%80%E8%A6%A7"><i class="fa fa-link"></i></a><a href="https://www.anarchive-beta.com/entry/2021/01/06/092619" rel="nofollow noopener" target="_blank">『パターン認識と機械学習』の攻略ノート：記事一覧</a>
</h3>
<ul data-sourcepos="17:1-18:32">
<li data-sourcepos="17:1-17:69">執筆者：<a href="https://www.anarchive-beta.com/about" rel="nofollow noopener" target="_blank">しょこ</a>さん</li>
<li data-sourcepos="18:1-18:32">サイト：はてなブログ</li>
</ul>
<h4 data-sourcepos="19:1-19:11">
<span id="補足-1" class="fragment"></span><a href="#%E8%A3%9C%E8%B6%B3-1"><i class="fa fa-link"></i></a>補足</h4>
<ul data-sourcepos="20:1-22:0">
<li data-sourcepos="20:1-20:60">Python, R を用いた実装例も紹介されている。</li>
<li data-sourcepos="21:1-22:0">他にも色々な面白そうな本についての記事も作成されている。[<a href="https://www.anarchive-beta.com/entry/2020/07/13/071300" rel="nofollow noopener" target="_blank">参考</a>]</li>
</ul>
<h2 data-sourcepos="23:1-23:27">
<span id="ソフトウェア開発" class="fragment"></span><a href="#%E3%82%BD%E3%83%95%E3%83%88%E3%82%A6%E3%82%A7%E3%82%A2%E9%96%8B%E7%99%BA"><i class="fa fa-link"></i></a>ソフトウェア開発</h2>
<h3 data-sourcepos="24:1-24:126">
<span id="git-push後のコミットメッセージを変更する方法" class="fragment"></span><a href="#git-push%E5%BE%8C%E3%81%AE%E3%82%B3%E3%83%9F%E3%83%83%E3%83%88%E3%83%A1%E3%83%83%E3%82%BB%E3%83%BC%E3%82%B8%E3%82%92%E5%A4%89%E6%9B%B4%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95"><i class="fa fa-link"></i></a><a href="https://qiita.com/kaiou_fight/items/32c1798415338537ec49" id="reference-f7516977e818017d62ee">Git push後のコミットメッセージを変更する方法</a>
</h3>
<ul data-sourcepos="25:1-26:19">
<li data-sourcepos="25:1-25:64">執筆者：<a href="https://qiita.com/kaiou_fight">oh tsuchiya</a>さん</li>
<li data-sourcepos="26:1-26:19">サイト：Qiita</li>
</ul>
<h3 data-sourcepos="27:1-27:137">
<span id="poetry151からgpu版のpytorchのインストールが簡単になりました" class="fragment"></span><a href="#poetry151%E3%81%8B%E3%82%89gpu%E7%89%88%E3%81%AEpytorch%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%8C%E7%B0%A1%E5%8D%98%E3%81%AB%E3%81%AA%E3%82%8A%E3%81%BE%E3%81%97%E3%81%9F"><i class="fa fa-link"></i></a><a href="https://zenn.dev/zerebom/articles/b338784c8ac76a" rel="nofollow noopener" target="_blank">Poetry1.5.1からGPU版のPytorchのインストールが簡単になりました</a>
</h3>
<ul data-sourcepos="28:1-29:18">
<li data-sourcepos="28:1-28:55">執筆者：<a href="https://zenn.dev/zerebom" rel="nofollow noopener" target="_blank">zerebom</a>さん</li>
<li data-sourcepos="29:1-29:18">サイト：Zenn</li>
</ul>
<h3 data-sourcepos="30:1-30:116">
<span id="エラーや実行完了をlineで通知するpython" class="fragment"></span><a href="#%E3%82%A8%E3%83%A9%E3%83%BC%E3%82%84%E5%AE%9F%E8%A1%8C%E5%AE%8C%E4%BA%86%E3%82%92line%E3%81%A7%E9%80%9A%E7%9F%A5%E3%81%99%E3%82%8Bpython"><i class="fa fa-link"></i></a><a href="https://qiita.com/Jun-T/items/a63eb60ff75ede0ada04" id="reference-38366188170896463bd5">エラーや実行完了をLINEで通知する【Python】</a>
</h3>
<ul data-sourcepos="31:1-32:19">
<li data-sourcepos="31:1-31:52">執筆者：<a href="https://qiita.com/Jun-T">T Jun</a>さん</li>
<li data-sourcepos="32:1-32:19">サイト：Qiita</li>
</ul>
<h3 data-sourcepos="33:1-33:113">
<span id="変更があるときだけコミット-github-actions" class="fragment"></span><a href="#%E5%A4%89%E6%9B%B4%E3%81%8C%E3%81%82%E3%82%8B%E3%81%A8%E3%81%8D%E3%81%A0%E3%81%91%E3%82%B3%E3%83%9F%E3%83%83%E3%83%88-github-actions"><i class="fa fa-link"></i></a><a href="https://zenn.dev/snowcait/articles/903d86d668fcb7" rel="nofollow noopener" target="_blank">変更があるときだけコミット [GitHub Actions]</a>
</h3>
<ul data-sourcepos="34:1-35:18">
<li data-sourcepos="34:1-34:55">執筆者：<a href="https://zenn.dev/snowcait" rel="nofollow noopener" target="_blank">雪猫</a>さん</li>
<li data-sourcepos="35:1-35:18">サイト：Zenn</li>
</ul>
<h3 data-sourcepos="36:1-36:120">
<span id="pyenvで最新バージョンがインストールできない" class="fragment"></span><a href="#pyenv%E3%81%A7%E6%9C%80%E6%96%B0%E3%83%90%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B3%E3%81%8C%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%A7%E3%81%8D%E3%81%AA%E3%81%84"><i class="fa fa-link"></i></a><a href="https://qiita.com/takoz/items/fa953620dee68cb87575" id="reference-7e30b543ad5079a24dc9">pyenvで最新バージョンがインストールできない</a>
</h3>
<ul data-sourcepos="37:1-39:0">
<li data-sourcepos="37:1-37:52">執筆者：<a href="https://qiita.com/takoz">takoz</a>さん</li>
<li data-sourcepos="38:1-39:0">サイト：Qiita</li>
</ul>
<h2 data-sourcepos="40:1-40:15">
<span id="デザイン" class="fragment"></span><a href="#%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3"><i class="fa fa-link"></i></a>デザイン</h2>
<h3 data-sourcepos="41:1-41:116">
<span id="コストや時間の削減表現のテンプレート配布します" class="fragment"></span><a href="#%E3%82%B3%E3%82%B9%E3%83%88%E3%82%84%E6%99%82%E9%96%93%E3%81%AE%E5%89%8A%E6%B8%9B%E8%A1%A8%E7%8F%BE%E3%81%AE%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E9%85%8D%E5%B8%83%E3%81%97%E3%81%BE%E3%81%99"><i class="fa fa-link"></i></a><a href="https://raku-pre.com/cost_reduction/" rel="nofollow noopener" target="_blank">コストや時間の削減表現のテンプレート配布します！</a>
</h3>
<ul data-sourcepos="42:1-43:0">
<li data-sourcepos="42:1-43:0">サイト：<a href="https://raku-pre.com/" rel="nofollow noopener" target="_blank">ラクプレ</a>
</li>
</ul>
<h2 data-sourcepos="44:1-44:9">
<span id="数学" class="fragment"></span><a href="#%E6%95%B0%E5%AD%A6"><i class="fa fa-link"></i></a>数学</h2>
<h3 data-sourcepos="45:1-45:125">
<span id="ベクトル行列の微分チートシート" class="fragment"></span><a href="#%E3%83%99%E3%82%AF%E3%83%88%E3%83%AB%E8%A1%8C%E5%88%97%E3%81%AE%E5%BE%AE%E5%88%86%E3%83%81%E3%83%BC%E3%83%88%E3%82%B7%E3%83%BC%E3%83%88"><i class="fa fa-link"></i></a><a href="https://tekrog.com/cheatsheet-differentiation-of-vectors-and-matrices" rel="nofollow noopener" target="_blank">ベクトル・行列の微分チートシート</a>
</h3>
<ul data-sourcepos="46:1-47:0">
<li data-sourcepos="46:1-47:0">サイト：<a href="https://tekrog.com" rel="nofollow noopener" target="_blank">TekRog</a>
</li>
</ul>
<h2 data-sourcepos="48:1-48:27">
<span id="付録自筆記事" class="fragment"></span><a href="#%E4%BB%98%E9%8C%B2%E8%87%AA%E7%AD%86%E8%A8%98%E4%BA%8B"><i class="fa fa-link"></i></a>付録（自筆記事）</h2>
<p data-sourcepos="49:1-49:117">最後に、手前味噌にはなりますが、宣伝を兼ねて自分の記事も紹介させていただきます</p>
<h3 data-sourcepos="50:1-50:176">
<span id="zenn-vs-qiitaを終わらせに来た-zenn-qiita" class="fragment"></span><a href="#zenn-vs-qiita%E3%82%92%E7%B5%82%E3%82%8F%E3%82%89%E3%81%9B%E3%81%AB%E6%9D%A5%E3%81%9F-zenn-qiita"><i class="fa fa-link"></i></a>Zenn vs Qiitaを終わらせに来た <a href="https://zenn.dev/naoki0103/articles/zenn-qiita-sync-workflow" rel="nofollow noopener" target="_blank">[Zenn]</a> <a href="https://qiita.com/C-naoki/items/5c5609b82a67335bf3be" id="reference-c20ca3848eb6d1d10ced">[Qiita]</a>
</h3>
<ul data-sourcepos="51:1-53:0">
<li data-sourcepos="51:1-51:103">GitHub Actionsを用いて、ZennとQiitaの記事を同期させる方法を紹介しています。</li>
<li data-sourcepos="52:1-53:0">一度設定をしてしまえば、その後特に手を煩わすことなく、同時にZennとQiitaに記事を自動で投稿することができます。</li>
</ul>
<h3 data-sourcepos="54:1-54:201">
<span id="画像結合のためのアルゴリズムを考えてみた-zenn-qiita" class="fragment"></span><a href="#%E7%94%BB%E5%83%8F%E7%B5%90%E5%90%88%E3%81%AE%E3%81%9F%E3%82%81%E3%81%AE%E3%82%A2%E3%83%AB%E3%82%B4%E3%83%AA%E3%82%BA%E3%83%A0%E3%82%92%E8%80%83%E3%81%88%E3%81%A6%E3%81%BF%E3%81%9F-zenn-qiita"><i class="fa fa-link"></i></a>画像結合のためのアルゴリズムを考えてみた <a href="https://zenn.dev/naoki0103/articles/image-stitcher-application" rel="nofollow noopener" target="_blank">[Zenn]</a> <a href="https://qiita.com/C-naoki/items/bf973b041709ad0cd635" id="reference-d21cebcc2d594b0a7163">[Qiita]</a>
</h3>
<ul data-sourcepos="55:1-55:107">
<li data-sourcepos="55:1-55:107">画像結合のためのシンプルなアルゴリズムを考え、Pythonで実装してみました。</li>
</ul>


## はじめに
2024年2月から株式会社Preferred Network（以下、PFN）の子会社である株式会社Preferred Elements（以下、PFE）にて開発されているPLaMoという言語モデルのβ版トライアルAPIの発行が2024年8月9日から順次発行が開始されました[^1]。この記事では、この言語モデルおよび、β版トライアルAPIを利用して作成したデモ用アプリについて簡単にご紹介いたします。アプリについては以下のリンクからお試しいただけます。ただし、β版トライアルAPIの利用自体は期間限定であるため、期間外はご利用いただけなくなります。ご了承ください。
[^1]: [PFEが開発する大規模言語モデルPLaMo β版の無料トライアルの申込受付を開始](https://www.preferred.jp/ja/news/pr20240807/)

https://plamo100b-demo.streamlit.app/

また、作成したソースコードについてはGitHubにて公開しています。興味のある方は以下のリンクからご覧ください。

https://github.com/C-Naoki/PLaMo-100B

## PLaMo-100Bとは？
PLaMo-100Bは、PFNが2024年2月から開発している大規模言語モデルであり、パラメータの規模としては1000億にも及びます。このモデルの事前学習自体は、5月に完了しており、そして、2024年8月に事後学習も完了し、トライアルAPIの提供が開始される運びとなっています。このモデルの開発自体はなんと、データ収集からモデルの開発まで全てPFN独自に行われております。加えて、性能についても申し分なく、Jasterという日本語性能評価ベンチマークでGPT-4を超え、日本固有の知識を問うRakuda BenchmarkでもGPT-4の性能を超えることが確認されています[^2]。
[^2]: [1,000億パラメータの独自LLM「PLaMo-100B」の事後学習が完了](https://tech.preferred.jp/ja/blog/plamo-100b-post-training/)

PLaMo-100Bの開発プロジェクトは、経済産業省が主導する国内の生成AIの開発力を強化するためのプロジェクト「GENIAC（Generative AI Accelerator Challenge）」に採択され、計算資源の提供支援を受けているという背景もあり、日本の生成AIの研究開発をリードする存在として注目されています。

### ベンチマークを用いた評価実験
PFNのブログにて公開されている実験を簡易的に紹介いたします。詳しくは、[PFNのブログ](https://tech.preferred.jp/ja/blog/plamo-100b-post-training/)をご覧ください。

以下の表は、Jasterという日本語の言語理解能力を測定するベンチマークを用いた実験結果です。
![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/plamo100b-demo/jaster.png)

このように、PLaMo-100B-Instruct（事後学習済みのPLaMo-100B）は全体的にGPT-4モデルを上回る性能を示しています。ただし、MR (Mathematical Reasoning) カテゴリのデータに対しては、GPT-4モデルを大きく下回る性能となってしまっているようです。

2024年10月15日追記：数学推論タスクの精度向上に関する検討がなされているようです[^3]。直接的にPLaMo-100Bの精度向上のための取り組みではないようですが、今後の性能向上に期待が持てる結果となっています。
[^3]: [LLMにおける合成データセットによる数学推論タスクの精度向上の検討](https://tech.preferred.jp/ja/blog/llm-synthetic-dataset-for-math/)

また、過去にPFNが開発していた言語モデルであるPLaMo-13B[^4]もあるのですが、このモデルとの比較実験の結果が見受けられませんでした。どの程度性能が向上しているのかどうか確認してみたいところです。加えて、表中のGPT-4はGPT-4oを指しているのかどうかに関する言及も見つけることができませんでいた。2024年8月現在、最新手法といえば、Gemini-1.5-Proをはじめとして、GPT-4oやClaude 3.5 Sonetなどが挙げられる[^5]と思いますが、どの程度の性能差なのか純粋に気になります。
[^4]: [PLaMo-13Bを公開しました](https://tech.preferred.jp/ja/blog/llm-plamo/)
[^5]: [LMSYS Chatbot Arena Leaderboard](https://chat.lmsys.org/?leaderboard)

## 作成したデモ用アプリについて
リンクを踏んでいただきますと、以下のようなアプリが表示されます。アプリの開発自体は、PythonのStreamlitというライブラリを使用しています。
![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/plamo100b-demo/app.png)

### アプリの全体像
機能としては以下に記すような非常に簡易的なもののみとなっています。
- 入力としては、システムメッセージおよびユーザーメッセージを入力できます。
  - システムメッセージとは、チャットボット側に役割を与えることが可能です。
- そして、メッセージの履歴については一時的に保持されるようになっており、それをCSV形式でエクスポートすることも可能です。

メッセージの履歴については以下のように表示されます。画像中の「会話の履歴をCSVでエクスポート」ボタンを押すことで、CSV形式でエクスポートすることが可能です。
![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/plamo100b-demo/history.png)


## まとめ
PLaMo-100BというPFNが開発した大規模言語モデルについての簡単な説明および評価実験の確認を行いました。日本発祥の強力な言語モデルが生まれたことは非常に喜ばしく、今後の展望が非常に興味深いです。また、PLaMo-100Bのβ版トライアルAPIを利用して、デモ用アプリを作成しました。しかし、まだまだ開発途中ではありますので、今後のアップデートをお待ちください。また、このデモ用アプリについてのフィードバックや要望があれば、ぜひお知らせください。


<h2 data-sourcepos="1:1-1:15">
<span id="はじめに" class="fragment"></span><a href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB"><i class="fa fa-link"></i></a>はじめに</h2>
<p data-sourcepos="2:1-2:700">2024年2月から株式会社Preferred Network（以下、PFN）の子会社である株式会社Preferred Elements（以下、PFE）にて開発されているPLaMoという言語モデルのβ版トライアルAPIの発行が2024年8月9日から順次発行が開始されました<sup><a href="#fn-1" id="fnref-1">1</a></sup>。この記事では、この言語モデルおよび、β版トライアルAPIを利用して作成したデモ用アプリについて簡単にご紹介いたします。アプリについては以下のリンクからお試しいただけます。ただし、β版トライアルAPIの利用自体は期間限定であるため、期間外はご利用いただけなくなります。ご了承ください。</p>
<p data-sourcepos="5:1-5:37"><iframe id="qiita-embed-content__9c8ee54e66ff746896fbf01d18ceb3b4" src="https://qiita.com/embed-contents/link-card#qiita-embed-content__9c8ee54e66ff746896fbf01d18ceb3b4" data-content="https%3A%2F%2Fplamo100b-demo.streamlit.app%2F" frameborder="0" scrolling="no" loading="lazy" style="width:100%;" height="29">
</iframe>
</p>
<p data-sourcepos="7:1-7:156">また、作成したソースコードについてはGitHubにて公開しています。興味のある方は以下のリンクからご覧ください。</p>
<p data-sourcepos="9:1-9:37"><iframe id="qiita-embed-content__fa6458acb2329e98b7c313da837b0f16" src="https://qiita.com/embed-contents/link-card#qiita-embed-content__fa6458acb2329e98b7c313da837b0f16" data-content="https%3A%2F%2Fgithub.com%2FC-Naoki%2FPLaMo-100B" frameborder="0" scrolling="no" loading="lazy" style="width:100%;" height="29">
</iframe>
</p>
<h2 data-sourcepos="11:1-11:22">
<span id="plamo-100bとは" class="fragment"></span><a href="#plamo-100b%E3%81%A8%E3%81%AF"><i class="fa fa-link"></i></a>PLaMo-100Bとは？</h2>
<p data-sourcepos="12:1-12:733">PLaMo-100Bは、PFNが2024年2月から開発している大規模言語モデルであり、パラメータの規模としては1000億にも及びます。このモデルの事前学習自体は、5月に完了しており、そして、2024年8月に事後学習も完了し、トライアルAPIの提供が開始される運びとなっています。このモデルの開発自体はなんと、データ収集からモデルの開発まで全てPFN独自に行われております。加えて、性能についても申し分なく、Jasterという日本語性能評価ベンチマークでGPT-4を超え、日本固有の知識を問うRakuda BenchmarkでもGPT-4の性能を超えることが確認されています<sup><a href="#fn-2" id="fnref-2">2</a></sup>。</p>
<p data-sourcepos="15:1-15:379">PLaMo-100Bの開発プロジェクトは、経済産業省が主導する国内の生成AIの開発力を強化するためのプロジェクト「GENIAC（Generative AI Accelerator Challenge）」に採択され、計算資源の提供支援を受けているという背景もあり、日本の生成AIの研究開発をリードする存在として注目されています。</p>
<h3 data-sourcepos="17:1-17:46">
<span id="ベンチマークを用いた評価実験" class="fragment"></span><a href="#%E3%83%99%E3%83%B3%E3%83%81%E3%83%9E%E3%83%BC%E3%82%AF%E3%82%92%E7%94%A8%E3%81%84%E3%81%9F%E8%A9%95%E4%BE%A1%E5%AE%9F%E9%A8%93"><i class="fa fa-link"></i></a>ベンチマークを用いた評価実験</h3>
<p data-sourcepos="18:1-18:204">PFNのブログにて公開されている実験を簡易的に紹介いたします。詳しくは、<a href="https://tech.preferred.jp/ja/blog/plamo-100b-post-training/" rel="nofollow noopener" target="_blank">PFNのブログ</a>をご覧ください。</p>
<p data-sourcepos="20:1-21:97">以下の表は、Jasterという日本語の言語理解能力を測定するベンチマークを用いた実験結果です。<br>
<a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fjaster.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=f5e38ce1d5c7d8c74d6fbdfdf3e3527b" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fjaster.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=f5e38ce1d5c7d8c74d6fbdfdf3e3527b" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fjaster.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=41646df955df7ccec4607b28616b2e30 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/plamo100b-demo/jaster.png" loading="lazy"></a></p>
<p data-sourcepos="23:1-23:313">このように、PLaMo-100B-Instruct（事後学習済みのPLaMo-100B）は全体的にGPT-4モデルを上回る性能を示しています。ただし、MR (Mathematical Reasoning) カテゴリのデータに対しては、GPT-4モデルを大きく下回る性能となってしまっているようです。</p>
<p data-sourcepos="25:1-25:283">2024年10月15日追記：数学推論タスクの精度向上に関する検討がなされているようです<sup><a href="#fn-3" id="fnref-3">3</a></sup>。直接的にPLaMo-100Bの精度向上のための取り組みではないようですが、今後の性能向上に期待が持てる結果となっています。</p>
<p data-sourcepos="28:1-28:636">また、過去にPFNが開発していた言語モデルであるPLaMo-13B<sup><a href="#fn-4" id="fnref-4">4</a></sup>もあるのですが、このモデルとの比較実験の結果が見受けられませんでした。どの程度性能が向上しているのかどうか確認してみたいところです。加えて、表中のGPT-4はGPT-4oを指しているのかどうかに関する言及も見つけることができませんでいた。2024年8月現在、最新手法といえば、Gemini-1.5-Proをはじめとして、GPT-4oやClaude 3.5 Sonetなどが挙げられる<sup><a href="#fn-5" id="fnref-5">5</a></sup>と思いますが、どの程度の性能差なのか純粋に気になります。</p>
<h2 data-sourcepos="32:1-32:45">
<span id="作成したデモ用アプリについて" class="fragment"></span><a href="#%E4%BD%9C%E6%88%90%E3%81%97%E3%81%9F%E3%83%87%E3%83%A2%E7%94%A8%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6"><i class="fa fa-link"></i></a>作成したデモ用アプリについて</h2>
<p data-sourcepos="33:1-34:94">リンクを踏んでいただきますと、以下のようなアプリが表示されます。アプリの開発自体は、PythonのStreamlitというライブラリを使用しています。<br>
<a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fapp.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=e9b9c85b8844d6562b55c77fc83da530" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fapp.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=e9b9c85b8844d6562b55c77fc83da530" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fapp.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=90be79835f3bcef762ecd4fd2347fe1a 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/plamo100b-demo/app.png" loading="lazy"></a></p>
<h3 data-sourcepos="36:1-36:25">
<span id="アプリの全体像" class="fragment"></span><a href="#%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E5%85%A8%E4%BD%93%E5%83%8F"><i class="fa fa-link"></i></a>アプリの全体像</h3>
<p data-sourcepos="37:1-37:99">機能としては以下に記すような非常に簡易的なもののみとなっています。</p>
<ul data-sourcepos="38:1-41:0">
<li data-sourcepos="38:1-39:109">入力としては、システムメッセージおよびユーザーメッセージを入力できます。
<ul data-sourcepos="39:3-39:109">
<li data-sourcepos="39:3-39:109">システムメッセージとは、チャットボット側に役割を与えることが可能です。</li>
</ul>
</li>
<li data-sourcepos="40:1-41:0">そして、メッセージの履歴については一時的に保持されるようになっており、それをCSV形式でエクスポートすることも可能です。</li>
</ul>
<p data-sourcepos="42:1-43:98">メッセージの履歴については以下のように表示されます。画像中の「会話の履歴をCSVでエクスポート」ボタンを押すことで、CSV形式でエクスポートすることが可能です。<br>
<a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fhistory.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=53e1c555003dcd6b7cd1d8c37a70859b" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fhistory.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=53e1c555003dcd6b7cd1d8c37a70859b" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fplamo100b-demo%2Fhistory.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=663d57992963a15f1ce227f0515f4e11 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/plamo100b-demo/history.png" loading="lazy"></a></p>
<h2 data-sourcepos="46:1-46:12">
<span id="まとめ" class="fragment"></span><a href="#%E3%81%BE%E3%81%A8%E3%82%81"><i class="fa fa-link"></i></a>まとめ</h2>
<p data-sourcepos="47:1-47:625">PLaMo-100BというPFNが開発した大規模言語モデルについての簡単な説明および評価実験の確認を行いました。日本発祥の強力な言語モデルが生まれたことは非常に喜ばしく、今後の展望が非常に興味深いです。また、PLaMo-100Bのβ版トライアルAPIを利用して、デモ用アプリを作成しました。しかし、まだまだ開発途中ではありますので、今後のアップデートをお待ちください。また、このデモ用アプリについてのフィードバックや要望があれば、ぜひお知らせください。</p>
<section class="footnotes">
<ol>
<li id="fn-1">
<p data-sourcepos="3:7-3:155"><a href="https://www.preferred.jp/ja/news/pr20240807/" rel="nofollow noopener" target="_blank">PFEが開発する大規模言語モデルPLaMo β版の無料トライアルの申込受付を開始</a> <a href="#fnref-1" class="">↩</a></p>
</li>
<li id="fn-2">
<p data-sourcepos="13:7-13:144"><a href="https://tech.preferred.jp/ja/blog/plamo-100b-post-training/" rel="nofollow noopener" target="_blank">1,000億パラメータの独自LLM「PLaMo-100B」の事後学習が完了</a> <a href="#fnref-2" class="">↩</a></p>
</li>
<li id="fn-3">
<p data-sourcepos="26:7-26:168"><a href="https://tech.preferred.jp/ja/blog/llm-synthetic-dataset-for-math/" rel="nofollow noopener" target="_blank">LLMにおける合成データセットによる数学推論タスクの精度向上の検討</a> <a href="#fnref-3" class="">↩</a></p>
</li>
<li id="fn-4">
<p data-sourcepos="29:7-29:84"><a href="https://tech.preferred.jp/ja/blog/llm-plamo/" rel="nofollow noopener" target="_blank">PLaMo-13Bを公開しました</a> <a href="#fnref-4" class="">↩</a></p>
</li>
<li id="fn-5">
<p data-sourcepos="30:7-30:76"><a href="https://chat.lmsys.org/?leaderboard" rel="nofollow noopener" target="_blank">LMSYS Chatbot Arena Leaderboard</a> <a href="#fnref-5" class="">↩</a></p>
</li>
</ol>
</section>



## はじめに
撮りたい対象が非常に大きい時、一枚の写真では収まりきらないケースというのはよくあります。そのような時に、複数の写真を結合して一枚の写真にしなければ、画像として視認性が低くなってしまいます。この記事では、そのようなケースに対応するための画像結合のためのアルゴリズムを考え、Pythonで実装してみました。提案アルゴリズムは、「入力画像の共通部分を事前情報なしで検出し、自動的に結合する」ことが可能です。

作成したソースコードについてはGitHubにて公開しています。興味のある方は以下のリンクからご覧ください。

https://github.com/C-Naoki/image-stitcher

## 出力例
以下に、アルゴリズムを用いて結合した出力例を示します。初めに、アルゴリズムに入力する画像の例を添付します。具体的には、以下に示す２枚の画像の結合を行います。画像については、[CIFAR-10データセット](https://www.cs.toronto.edu/~kriz/cifar.html)の中から選択しました。

![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/input.png)

図中の赤いエリアは、データが存在しない部分を表しています。また、右側の画像は、正解画像に比べて90度回転しています。開発したアルゴリズムは、この回転を加味して画像を結合することが可能です。

![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/rotated.png)

続いて、右画像の回転を補正し、左右の向きを揃えた結果が上図の通りです。緑色の枠で囲まれている部分が、アルゴリズムが自動的に検知した共通部分です。また、タイトル中に記載されている角度（上図では270°）が、アルゴリズムが検出した回転すべき最適な角度を意味しています。入力画像は、元データを90°回転させていることから、最適な角度を検出できていることがわかると思います。

![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/result.png)

そして、最終的に結合した結果が上図の通りです。アルゴリズムは、入力画像の共通部分を事前情報なしで検出し、自動的に結合することが可能であることが、この例から直感的に理解していただけると思います。

なお、他の実験結果例については、ここでは省略しますが、GitHubの [tutorial.ipynb](https://github.com/C-Naoki/image-stitcher/blob/main/notebooks/tutorial.ipynb) にて公開しているので、興味のある方はそちらをご覧ください。

## アルゴリズムの概要
以下では、提案アルゴリズムの概要を説明します。

### 1. 共通部分探索
![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/case1.png)

概要図は上記のとおりです。提案アルゴリズムは、$h_c$を共通部分の高さ、$w_c$を共通部分の幅とし、これらを基準とした全探索を行います。共通部分のサイズが $h_c \times w_c$であると仮定すると、共通部分は以下の**4箇所にのみ**存在することがわかります。

1. Image1の左上とImage2の右下の重複部分
2. Image1の右上とImage2の左下の重複部分
3. Image1の左下とImage2の右上の重複部分
4. Image1の右下とImage2の左上の重複部分（上図に対応）

これらにより、特定の共通部分に対して、4箇所を探索することで、過不足なく共通部分を検索することが可能です。

```python
for hc in range(min_h, max(h1, h2) + 1):
    for wc in range(min_w, max(w1, w2) + 1):
        for ix in range(2):
            for iy in range(2):
```

上記のコードの`ix`と`iy`の組み合わせが、上記の4箇所に対応しています。

#### 局所解に対する対策

画像結合において、局所解への収束は、品質の低い画像提供を意味します。このような問題を防ぐために、提案アルゴリズムは共通部分の最小値を設定することが可能です。共通部分のサイズをベースとした全探索を用いたことで、このような問題に簡単に対応可能です。

#### 画像の回転に対する対策

画像の回転に対しては、探索アルゴリズムを適用する前に片方の入力画像 (Image2) を回転させるというシンプルな方法で対処しています。

```python
for angle in [0, 90, 180, 270]:
    # 画像を回転
    _image2 = rotate(image2, angle, resize=True, preserve_range=True).astype(np.uint8)
```

### 2. 共通部分の拡張
![](https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/case2.png)

上記で説明したアルゴリズムは、共通部分のサイズが $h_c \times w_c$であると仮定しています。しかし、このアルゴリズムは、$h_c<\min(h_1, h_2)$ かつ $w_c<\min(w_1, w_2)$ という暗黙の仮定に基づいています。すなわち、任意の入力サイズに対応することはできません。このような問題に対応するために、上図のように、$h_c$と$w_c$を拡張することで、任意のサイズの入力画像に対して、提案アルゴリズムを適用することが可能になりました。

## まとめ
本記事では、画像結合のためのアルゴリズムを提案し、Pythonで実装してみました。提案アルゴリズムは、入力画像の共通部分を事前情報なしで検出し、自動的に結合することが可能です。また、提案アルゴリズムは、局所解への収束や画像の回転に対しても対処可能です。最後に、提案アルゴリズムの概要を説明し、その有効性を出力例を基に明らかにしました。

### 追記
2024/10/01: 200+ GitHub Stars🌟 を頂きました。ありがとうございます！


<h2 data-sourcepos="2:1-2:15">
<span id="はじめに" class="fragment"></span><a href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB"><i class="fa fa-link"></i></a>はじめに</h2>
<p data-sourcepos="3:1-3:588">撮りたい対象が非常に大きい時、一枚の写真では収まりきらないケースというのはよくあります。そのような時に、複数の写真を結合して一枚の写真にしなければ、画像として視認性が低くなってしまいます。この記事では、そのようなケースに対応するための画像結合のためのアルゴリズムを考え、Pythonで実装してみました。提案アルゴリズムは、「入力画像の共通部分を事前情報なしで検出し、自動的に結合する」ことが可能です。</p>
<p data-sourcepos="5:1-5:147">作成したソースコードについてはGitHubにて公開しています。興味のある方は以下のリンクからご覧ください。</p>
<p data-sourcepos="7:1-7:41"><iframe id="qiita-embed-content__4f44ad4b4ccf39eb66a6992d4b9cd0db" src="https://qiita.com/embed-contents/link-card#qiita-embed-content__4f44ad4b4ccf39eb66a6992d4b9cd0db" data-content="https%3A%2F%2Fgithub.com%2FC-Naoki%2Fimage-stitcher" frameborder="0" scrolling="no" loading="lazy" style="width:100%;" height="29">
</iframe>
</p>
<h2 data-sourcepos="9:1-9:12">
<span id="出力例" class="fragment"></span><a href="#%E5%87%BA%E5%8A%9B%E4%BE%8B"><i class="fa fa-link"></i></a>出力例</h2>
<p data-sourcepos="10:1-10:364">以下に、アルゴリズムを用いて結合した出力例を示します。初めに、アルゴリズムに入力する画像の例を添付します。具体的には、以下に示す２枚の画像の結合を行います。画像については、<a href="https://www.cs.toronto.edu/~kriz/cifar.html" rel="nofollow noopener" target="_blank">CIFAR-10データセット</a>の中から選択しました。</p>
<p data-sourcepos="12:1-12:108"><a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Finput.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=05be261924f6f0a41c68291471c845d0" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Finput.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=05be261924f6f0a41c68291471c845d0" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Finput.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=f49581e88a8aa9ea78c1d2366cfe93ef 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/input.png" loading="lazy"></a></p>
<p data-sourcepos="14:1-14:278">図中の赤いエリアは、データが存在しない部分を表しています。また、右側の画像は、正解画像に比べて90度回転しています。開発したアルゴリズムは、この回転を加味して画像を結合することが可能です。</p>
<p data-sourcepos="16:1-16:110"><a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Frotated.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=c7dad7e47bf2f2abdd6ff4062f27524b" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Frotated.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=c7dad7e47bf2f2abdd6ff4062f27524b" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Frotated.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=b273f46e592e8b7379401f00a35775ba 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/rotated.png" loading="lazy"></a></p>
<p data-sourcepos="18:1-18:537">続いて、右画像の回転を補正し、左右の向きを揃えた結果が上図の通りです。緑色の枠で囲まれている部分が、アルゴリズムが自動的に検知した共通部分です。また、タイトル中に記載されている角度（上図では270°）が、アルゴリズムが検出した回転すべき最適な角度を意味しています。入力画像は、元データを90°回転させていることから、最適な角度を検出できていることがわかると思います。</p>
<p data-sourcepos="20:1-20:109"><a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fresult.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=e35007f10e97567935d287b3ae470fe1" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fresult.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=e35007f10e97567935d287b3ae470fe1" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fresult.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=7884902e84150529279037591f0e2a71 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/result.png" loading="lazy"></a></p>
<p data-sourcepos="22:1-22:288">そして、最終的に結合した結果が上図の通りです。アルゴリズムは、入力画像の共通部分を事前情報なしで検出し、自動的に結合することが可能であることが、この例から直感的に理解していただけると思います。</p>
<p data-sourcepos="24:1-24:273">なお、他の実験結果例については、ここでは省略しますが、GitHubの <a href="https://github.com/C-Naoki/image-stitcher/blob/main/notebooks/tutorial.ipynb" rel="nofollow noopener" target="_blank">tutorial.ipynb</a> にて公開しているので、興味のある方はそちらをご覧ください。</p>
<h2 data-sourcepos="26:1-26:30">
<span id="アルゴリズムの概要" class="fragment"></span><a href="#%E3%82%A2%E3%83%AB%E3%82%B4%E3%83%AA%E3%82%BA%E3%83%A0%E3%81%AE%E6%A6%82%E8%A6%81"><i class="fa fa-link"></i></a>アルゴリズムの概要</h2>
<p data-sourcepos="27:1-27:69">以下では、提案アルゴリズムの概要を説明します。</p>
<h3 data-sourcepos="29:1-29:25">
<span id="1-共通部分探索" class="fragment"></span><a href="#1-%E5%85%B1%E9%80%9A%E9%83%A8%E5%88%86%E6%8E%A2%E7%B4%A2"><i class="fa fa-link"></i></a>1. 共通部分探索</h3>
<p data-sourcepos="30:1-30:108"><a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fcase1.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=789f1287f1748f86d490a8d5bb812fc9" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fcase1.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=789f1287f1748f86d490a8d5bb812fc9" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fcase1.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=8a019c1a3326a0802a9e98a41e1592e4 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/case1.png" loading="lazy"></a></p>
<p data-sourcepos="32:1-32:347">概要図は上記のとおりです。提案アルゴリズムは、$h_c$を共通部分の高さ、$w_c$を共通部分の幅とし、これらを基準とした全探索を行います。共通部分のサイズが $h_c \times w_c$であると仮定すると、共通部分は以下の<strong>4箇所にのみ</strong>存在することがわかります。</p>
<ol data-sourcepos="34:1-38:0">
<li data-sourcepos="34:1-34:51">Image1の左上とImage2の右下の重複部分</li>
<li data-sourcepos="35:1-35:51">Image1の右上とImage2の左下の重複部分</li>
<li data-sourcepos="36:1-36:51">Image1の左下とImage2の右上の重複部分</li>
<li data-sourcepos="37:1-38:0">Image1の右下とImage2の左上の重複部分（上図に対応）</li>
</ol>
<p data-sourcepos="39:1-39:157">これらにより、特定の共通部分に対して、4箇所を探索することで、過不足なく共通部分を検索することが可能です。</p>
<div class="code-frame" data-lang="python" data-sourcepos="41:1-46:3"><div class="highlight"><pre><code><span class="k">for</span> <span class="n">hc</span> <span class="ow">in</span> <span class="nf">range</span><span class="p">(</span><span class="n">min_h</span><span class="p">,</span> <span class="nf">max</span><span class="p">(</span><span class="n">h1</span><span class="p">,</span> <span class="n">h2</span><span class="p">)</span> <span class="o">+</span> <span class="mi">1</span><span class="p">):</span>
    <span class="k">for</span> <span class="n">wc</span> <span class="ow">in</span> <span class="nf">range</span><span class="p">(</span><span class="n">min_w</span><span class="p">,</span> <span class="nf">max</span><span class="p">(</span><span class="n">w1</span><span class="p">,</span> <span class="n">w2</span><span class="p">)</span> <span class="o">+</span> <span class="mi">1</span><span class="p">):</span>
        <span class="k">for</span> <span class="n">ix</span> <span class="ow">in</span> <span class="nf">range</span><span class="p">(</span><span class="mi">2</span><span class="p">):</span>
            <span class="k">for</span> <span class="n">iy</span> <span class="ow">in</span> <span class="nf">range</span><span class="p">(</span><span class="mi">2</span><span class="p">):</span>
</code></pre></div></div>
<p data-sourcepos="48:1-48:99">上記のコードの<code>ix</code>と<code>iy</code>の組み合わせが、上記の4箇所に対応しています。</p>
<h4 data-sourcepos="50:1-50:32">
<span id="局所解に対する対策" class="fragment"></span><a href="#%E5%B1%80%E6%89%80%E8%A7%A3%E3%81%AB%E5%AF%BE%E3%81%99%E3%82%8B%E5%AF%BE%E7%AD%96"><i class="fa fa-link"></i></a>局所解に対する対策</h4>
<p data-sourcepos="52:1-52:366">画像結合において、局所解への収束は、品質の低い画像提供を意味します。このような問題を防ぐために、提案アルゴリズムは共通部分の最小値を設定することが可能です。共通部分のサイズをベースとした全探索を用いたことで、このような問題に簡単に対応可能です。</p>
<h4 data-sourcepos="54:1-54:38">
<span id="画像の回転に対する対策" class="fragment"></span><a href="#%E7%94%BB%E5%83%8F%E3%81%AE%E5%9B%9E%E8%BB%A2%E3%81%AB%E5%AF%BE%E3%81%99%E3%82%8B%E5%AF%BE%E7%AD%96"><i class="fa fa-link"></i></a>画像の回転に対する対策</h4>
<p data-sourcepos="56:1-56:184">画像の回転に対しては、探索アルゴリズムを適用する前に片方の入力画像 (Image2) を回転させるというシンプルな方法で対処しています。</p>
<div class="code-frame" data-lang="python" data-sourcepos="58:1-62:3"><div class="highlight"><pre><code><span class="k">for</span> <span class="n">angle</span> <span class="ow">in</span> <span class="p">[</span><span class="mi">0</span><span class="p">,</span> <span class="mi">90</span><span class="p">,</span> <span class="mi">180</span><span class="p">,</span> <span class="mi">270</span><span class="p">]:</span>
    <span class="c1"># 画像を回転
</span>    <span class="n">_image2</span> <span class="o">=</span> <span class="nf">rotate</span><span class="p">(</span><span class="n">image2</span><span class="p">,</span> <span class="n">angle</span><span class="p">,</span> <span class="n">resize</span><span class="o">=</span><span class="bp">True</span><span class="p">,</span> <span class="n">preserve_range</span><span class="o">=</span><span class="bp">True</span><span class="p">).</span><span class="nf">astype</span><span class="p">(</span><span class="n">np</span><span class="p">.</span><span class="n">uint8</span><span class="p">)</span>
</code></pre></div></div>
<h3 data-sourcepos="64:1-64:28">
<span id="2-共通部分の拡張" class="fragment"></span><a href="#2-%E5%85%B1%E9%80%9A%E9%83%A8%E5%88%86%E3%81%AE%E6%8B%A1%E5%BC%B5"><i class="fa fa-link"></i></a>2. 共通部分の拡張</h3>
<p data-sourcepos="65:1-65:108"><a href="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fcase2.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=d7a2f832690346481bb246e8ecd2bbeb" target="_blank" rel="nofollow noopener"><img src="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fcase2.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;s=d7a2f832690346481bb246e8ecd2bbeb" alt="" srcset="https://qiita-user-contents.imgix.net/https%3A%2F%2Fraw.githubusercontent.com%2FC-Naoki%2Fzenn-archive%2Fmain%2Fimages%2Fimage-stitcher-application%2Fcase2.png?ixlib=rb-4.0.0&amp;auto=format&amp;gif-q=60&amp;q=75&amp;w=1400&amp;fit=max&amp;s=2c3b1e6ac4ad173357c03077aa843bc5 1x" data-canonical-src="https://raw.githubusercontent.com/C-Naoki/zenn-archive/main/images/image-stitcher-application/case2.png" loading="lazy"></a></p>
<p data-sourcepos="67:1-67:580">上記で説明したアルゴリズムは、共通部分のサイズが $h_c \times w_c$であると仮定しています。しかし、このアルゴリズムは、$h_c&lt;\min(h_1, h_2)$ かつ $w_c&lt;\min(w_1, w_2)$ という暗黙の仮定に基づいています。すなわち、任意の入力サイズに対応することはできません。このような問題に対応するために、上図のように、$h_c$と$w_c$を拡張することで、任意のサイズの入力画像に対して、提案アルゴリズムを適用することが可能になりました。</p>
<h2 data-sourcepos="69:1-69:12">
<span id="まとめ" class="fragment"></span><a href="#%E3%81%BE%E3%81%A8%E3%82%81"><i class="fa fa-link"></i></a>まとめ</h2>
<p data-sourcepos="70:1-70:489">本記事では、画像結合のためのアルゴリズムを提案し、Pythonで実装してみました。提案アルゴリズムは、入力画像の共通部分を事前情報なしで検出し、自動的に結合することが可能です。また、提案アルゴリズムは、局所解への収束や画像の回転に対しても対処可能です。最後に、提案アルゴリズムの概要を説明し、その有効性を出力例を基に明らかにしました。</p>
<h3 data-sourcepos="72:1-72:10">
<span id="追記" class="fragment"></span><a href="#%E8%BF%BD%E8%A8%98"><i class="fa fa-link"></i></a>追記</h3>
<p data-sourcepos="73:1-73:88">2024/10/01: 200+ GitHub Stars🌟 を頂きました。ありがとうございます！</p>


Naoki Chihara

Search

#Search box