ハッカソン用のエンジニアを無料で生成してみよう


## はじめに
怒られないための注意書き
画像の画質がとんでもなく悪い気がしますが、もう撮り直したくないので目を凝らしてください（ホンマすまん。）

そしてこの記事を読んで、作成できるエンジニアは相当ポンコツです。
2025年3月14日時点で、実務で使えるレベルにはなっていません。

また想定しないエラーによって、途中で詰まるかもしれません。
近くに助けてくれるエンジニアがいることを確認してから、作業を始めてください。
もしいないなら、chatGPTに聞きながら頑張りましょう！

## この記事でやること
この記事では、OpenHandsとOpenRouterを組み合わせて自律型エージェントを作っています

自律型エージェントとは、目標を与えると生成と修正を繰り返して、達成するまで動いてくれるAIのことです。

OpenHandsは生成AIがエンジニアとして動けるようにパソコンを動かせるようにしてあげるものです。
言葉を喋るだけの生成AIに手をあげるイメージ。
OSS(有志の方々が公開してくれているソフトウェア)なので無料で利用できます。

OpenRouterは生成AIをシステムに組み込みやすくしてくれるサービスです。
chatGPTなどの有名な生成AIは、システムに組み込むときには普通お金がかかります。
ただ、OpenRouterは優しいので（）、一部の生成AIは無料で使わせてくれます。

この二つを組み合わせることで、無料で自律型AIエージェントを作るのが、今回の記事でやっていることです。

ちなみにこの説明はかなり厳密性に欠けるので、詳細を知りたい方はAIに聞いてください（）

## やり方
### 1 Dockerのインストール
[こちらのページ](https://www.docker.com/ja-jp/get-started/)からDockerをインストールしてください。

自分のパソコンに合わせたものをダウンロードして、ダウンロードしたものをダブルクリックで開いたらインストールできます。
![docker-desktop-download](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/docker-desktop-download.webp)

自分のパソコンがなんなのかわからない人は[この記事](https://ar-aca.tech/posts/arm64-vs-x64-check/#:~:text=%E5%B8%82%E5%A0%B4%E3%81%A7%E4%B8%BB%E6%B5%81-,4.%20%E8%87%AA%E5%88%86%E3%81%AEPC%E3%81%8CARM64%E3%81%8Bx64%E3%81%8B%E3%82%92%E7%A2%BA%E8%AA%8D%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95,-%E8%87%AA%E5%88%86%E3%81%AEPC)に書いてある方法で調べるとわかりやすいです。



### 2 OpenRouterへの登録
[こちらのページ](https://openrouter.ai/)からログインしておいてください
![open-router-register](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/open-router-register.webp)
 
ログインしたら規約に同意して
![agree-term-open-router](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/agree-term-open-router.webp)

APIキーの作成を行います
![openrouter-api-generation](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/openrouter-api-generation.webp)

![openrouter-api-parameter](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/openrouter-api-parameter.webp)

キーが生成されたら、誰にも見られない場所に保存しておいてください（パソコンのメモ帳とか）
![openrouter-apikey-copy](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/openrouter-apikey-copy.webp)

### 3. open handsの起動
ここからはターミナルを使います。
ターミナルを起動してください（[macでのやり方](https://jp.minitool.com/data-recovery/open-terminal-mac-command-prompt.html)、[windowsでのやり方](https://www2.mouse-jp.co.jp/ssl/user_support2/sc_faq_documents.asp?FaqID=43218)）

以下のコマンドを実行（コピペしてEnter）

```
docker pull docker.all-hands.dev/all-hands-ai/runtime:0.28-nikolaik
```

少し時間がかかりますが完了したら次はこのコマンドを実行

```
docker run -it --rm --pull=always \
    -e SANDBOX_RUNTIME_CONTAINER_IMAGE=docker.all-hands.dev/all-hands-ai/runtime:0.28-nikolaik \
    -e LOG_ALL_EVENTS=true \
    -v /var/run/docker.sock:/var/run/docker.sock \
    -v ~/.openhands-state:/.openhands-state \
    -p 3000:3000 \
    --add-host host.docker.internal:host-gateway \
    --name openhands-app \
    docker.all-hands.dev/all-hands-ai/openhands:0.28
```

こんな感じの画面になったらOpenhandsの起動が完了です
![openhands-started](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/openhands-started.webp)

[ここに](http://0.0.0.0:3000/)アクセスしてください。

※ エラーになったら

人によってはこんなエラーが出る人もいるかも

```
docker: Error response from daemon: error while creating mount source path '/Users/user/.openhands-state': chown /Users/user/.openhands-state: permission denied
```

そしたら↓を実行してください

> mkdir -p ~/.openhands-state && chmod 755 ~/.openhands-state

これでも無理なら、chatGPTにエラー文章をコピペしたり、隣の席のエンジニアに助けを求めてください（）

### 4. open handsとopen routerを繋げる
先ほどのリンクにアクセスすると、こんな画面になるので画像の通りに設定していってください

![set-apikey-to-openhands](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/set-apikey-to-openhands.webp)

最後に保存ボタンを押して設定完了
![openhands-finish-setting](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/openhands-finish-setting.webp)


![start-session](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/start-session.webp)

#### 無料のモデルの選び方
無料のモデルは時期によって大きく変わるので
[このページ](https://openrouter.ai/models?q=free&order=top-weekly)の上の方から適当に選んでください

OpenRouterのページにはあるけれど、選択できないものもいっぱいあります。
そういう時は、Advanced な設定を使って指定してあげましょう

![advanced-settings-for-llm](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/1280_960/advanced-settings-for-llm.webp)

CustomModelのところは

```
openrouter/[使いたいモデル名]
```

Base URLのところはこれ

```
https://openrouter.ai/api/v1
```

ちなみにモデル名はopenrouterのモデル詳細ページのここからコピーしましょう

![copy-model-name](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/copy-model-name.webp)



### 5. AIエンジニアにお願いをする
日本語で大丈夫です。
適当にお願いをしてみましょう。

![start-dev](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/start-dev.webp)

しばらく待つとこんな画面になります。
AIがなんかを作ってくれるので、待ちましょう

![loading-](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/loading-.webp)

あとは適当に、作られたものを見て、修正を依頼して完成を目指しましょう
![how-to-communicate-with-openhands](https://raw.githubusercontent.com/shunkat/image-resize-convert-uploader/master/640_480/how-to-communicate-with-openhands.webp)


**完了**です

お疲れ様でした〜〜

クオリティが高いものは難しいですが簡単なものならすぐに作ってくれます！

色々遊んでみてください！

## 最後に
今回の記事、実は、現在インターン中の[&AI](https://andai.net/)という企業の社内ハッカソンを盛り上げようと思って作ったものです。
というか最初か記事じゃなくて、Slackのメッセージで送ろうと思ったんですが
公開しとけば他のハッカソンの盛り上がりとかにも繋がる気がしたので記事にしました。

できるだけ再現性が高くて、お金の心配がない方法を考えましたが、
これで可能性を感じた人は、有料版のDevinを使うとクオリティの高さに涙を流すはずです！
もしDevinを契約するのであれば、以下の招待経由で始めれば、100ACUもらえます（あなたも私も）
https://app.devin.ai/invite/Mv1I3jZDod1aHhmc

それではまた！