はじめに
皆さんはCursorエディタは活用されていますでしょうか？Cursorエディタとは、VSCodeをフォークして作られた、AIでコード実装を補助してくれる機能がついたコードエディタのことです。以降長いのでCursorと呼称します。
記事作成の経緯
最近（2025/6/20）、CursorのBackground Agents機能が実装されSlackと連携できるようになったとの公式リリースのメールが飛んできたので、早速そちらを試してみることにしました。
以前投稿させていただいたYoloモードの件以上にAIエディタの可能性を感じましたので、こちらの機能を使えるようになるまでの具体的な手順と、具体的な作業依頼の事例を本記事ではご紹介します！
以前のYoloモードに関する投稿記事はこちらです↓
CursorエディタのYoloモードが想像以上だった件
ところでBackground Agentsって何？
公式ページの説明は以下の通りです。
「バックグラウンドエージェントを使用すると、リモート環境でコードを編集・実行できる非同期エージェントを起動できます。いつでもエージェントのステータスを確認したり、フォローアップを送信したり、引き継いだりできます。」
…要はコード編集作業を丸投げして裏で作業してもらうことができます。
Slackと連携できるようになった
この機能とSlackが連携できるようになりました。公式ページの説明は以下の通りです。
要はSlackからメンション機能でCursorに作業を丸投げできるわけです。
本記事の内容
前述しました通り、本記事では、
- 設定手順： CursorとSlack（とGitHub）の連携設定の手順
- 具体的お題： Webブラウザ上で動く電卓アプリの作成
の2つにフォーカスしてご紹介したいと思います。
この機能をより使いこなしたいという方は、公式ページのほうにより詳細な解説がありますのでそちらをご覧になるのが良いかと思います。本記事は取っ掛かりとして参考程度にどうぞ～。
以下、本記事ではCusor 1.1.3およびSlack 25.06（※スマホのみ）を使用して説明します。
設定手順：Cursor・Slack・GitHubの設定
作業の流れ
以下の順に行っていきます。
- 作業用のリモートリポジトリの作成（とクローン）
- Slackのワークスペースの作成
- CursorとSlackを接続
- CursorとGitHubを接続
- 上限金額の設定
実のところ公式ページの解説動画の内容と被りますが、ところどころつまづいた箇所の補足など入れつつ説明したいと思います。
ただし1点だけ注意すべき点があります↓
CursorのPrivacy ModeはOFFにする必要あり
公式ページに記載されている通り、今回のSlackとの連携機能を使用するには、Cursorに備わっているPrivacy Mode（＝ソースコードやユーザー入力がAIの学習目的で保存されないようにする機能）をOFFにする必要があります。そのような情報を取り扱うケースでは本機能は使用すべきでないと思われます。ご注意ください。
Privacy Modeが有効になっているかどうかは、以下の手順で確認できます。
- File → Preferences → Cursor Settings の順で選択
- General → Privacy のコンボボックスで Share Data / Privacy Mode with Storage / Privacy Mode のどれが選択されているかで確認
以下具体的な設定手順です。
（スクショを交えてかなり細かくて長いので折りたたみました。）
具体的な設定手順
0. 作業用のリモートリポジトリの作成（とクローン）
これを作らないと始まりませんね。GitHubにアクセスしリポジトリを作成します。
今回はテスト用としてCirsorSlackIntegTestという名称でPrivateで作成しました。
1. Slackのワークスペースの作成
Slackのワークスペースを作成します。日常的にSlackを使っている方ならば説明は不要だと思います。今回は「OgabkCursorWork」という名前で専用のワークスペースを作成してみました。
2. CursorとSlackを接続
まず、Cursorを起動して、Cursor Settingsを開きます。
続いて、Tools & Integrations のタブを開き、Connectを選択します。
Slackのワークスペースにサインインするよう言われるので、予め作成しておいたワークスペース名を入力してサインインします。
Slackにサインインしていない場合はサインインします。
するとブラウザで以下の画面が開くので、内容を確認し「許可する」をクリックします。
Cursorにサインインしていない場合はサインインします。
ここまで上手くいけば、下図のような画面に遷移します。「Link Account」をクリックします。
ここでも上手くいけば、この画面に遷移します。「Connect Slack」の左にチェックが入っていたら、Slackのワークスペースとの接続は完了です。
上記の画面に遷移せず、「Link Failed」と出て、下図のようなエラーが出る場合があります。その場合はPrivacy Modeが有効のままとなっています。Cursor Settingsを再度開き、そちらから Privacy Modeを無効化（＝Share Dataを有効化）してください。
3. CursorとGitHubを接続
まずConnect GitHubをクリックします。
ブラウザでこの画面が開きます。「Authorize Cursor」をクリックします。
下図のような設定画面が開きます。CursorのBackground-Agentsと共同作業するリポジトリを選択する画面だと思います。皆さんそれぞれの状況に応じてどちらかを選択してください。
今回はテスト用にCursorがアクセス可能なリポジトリを絞りたかったので、Only select repositoriesにチェックを入れ、Select repositoriesのプルダウンメニューから今回用に作成したリポジトリを選択しました。
この状態で「Install & Authorize」をクリックします。
ここまでが上手くいけば、下図の画面で所望のリポジトリをプルダウンメニューから選べるようになっているはずです。所望のリポジトリを選択しましょう。
4. 上限金額の設定
ようやく設定作業も大詰めです。最後にBackground Agentsの課金上限金額を設定します。
下図だと背景色と文字色が被ってとても分かりにくいのですが、よく見ると左から「＄50 ＄100 ＄200 ＄500 ＄」と並んでいるのが分かります。皆さんそれぞれのお財布👛事情に合わせて選択してください。
決定ボタンも、これまた見づらい色をしていますが、右下に「ENABLE」とあります。こちらをクリックしてください。
具体的お題：電卓アプリ
作業の流れ
以下の順に行っていきます。
- CursorをSlackのチャンネルに追加する
- メンションで電卓アプリ作成を依頼してみる
- Cursorからの返信を受け取り作業結果を確認してみる
- 計算途中のGUIの挙動の修正を依頼してみる
- Slackからの指示だけで関数電卓に改造してみる
1. CursorをSlackのチャンネルに追加する
まずはCursorをSlackのチャンネルに追加する必要があります。
私の場合は、フライングで「@Cursor」でCursorをメンションしてしまったため・・・
Cursorはこのチャンネルに参加していないよ！追加して！、とSlackbotさんに怒られました（汗
なのでまずはちゃんとCursorを招待してあげましょう。
2. メンションで電卓アプリ作成を依頼してみる
では早速、メンションで電卓アプリ作成を依頼してみましょう。
といっても既にフライングでやってしまいましたが（汗）
「@Cursor」のメンションの後ろに指示メッセージを添えることで、CursorのAgentに対して指示を出すことができます。
3. Cursorからの返信を受け取り作業結果を確認してみる
5分程度待ってみたところ、Cursorさんから返信が来ました！
日本語で依頼したにも関わらず英語で返信してきやがりましたが、、、 色々ちゃんと実装してくれたようです。
リポジトリ側はどうなったのか、GitHubにアクセスして確認してみます。何やら私が最初作成したmainブランチのほかに新たにブランチが作成されてそこに実装してくれたようですね。
Slackのスレッドに戻って末尾を見ると、「Open in Cursor」ボタンが見えます。これをクリックすることでCursorが立ち上がりBackground Agentsが行った作業内容を確認できる画面が立ち上がります。
Cursorエディタが起動し、こんな画面が立ち上がります。
今回の電卓はWebアプリとして実装してもらったので、index.htmlをブラウザで開けば実行できます。そこで、VSCode向けの簡易WebブラウザのExtensionをCursorに追加インストールし、実行してみました。（こういうところがVSCodeをフォークして作ってあるCursorエディタの良いところ！）
その結果がこちらです↓
ちゃんと電卓アプリを作ってくれたみたいですね👍
見た目も（特に指定していないけど…）かっこいいです👍
4. 計算途中のGUIの挙動の修正を依頼してみる
ここまでくれば、もう勝ったも同然（？）です。入力している最中に途中式が画面に表示されなかったので、その修正を依頼してみます。
無事途中式も表示されるようになりました！
ついでにmainブランチとマージしてプッシュするよう依頼してみます。
GitHubにアクセスしてmainブランチにマージされているか確認します。
できていそうですね👍
5. Slackからの指示だけで関数電卓に改造してみる (2025/6/29追記)
スマホにSlackアプリを入れている方は、 スマホからCursorに作業を依頼でき、進捗もスマホから確認できちゃいます。 実際にやってみましょう。
Slackを開いて、@Cursorのメンション付きでメッセージを投げます。
すると即座に「⏳」マークがつき、Background Agentsが自動的に起動したとのメッセージがでました。そして更にしばらく待つと、Cursorからメッセージが返ってきました。（回答が完了すると「⏳」から「✅」にマークが変化するみたいです。）
文末に「View PR」ボタンが表示されていました。指示通りブランチを切って作業をしてくれており、作業結果のプルリクエストをGitHub上で確認することができました。
ここまでできるならお試し実行もスマホ上で行いたいですよね。なのでCursorに聞いてみました。
するとしばらくして回答が来ました。残念ながら上手く行かなかったようです。素直に外部サービスを使ってみることにしました（今回はJSFiddleを使ってみました）。
JSFiddleのサイトをブラウザで開き、GitHubから当該ブランチのコードをzipで落としてきて、HTML/JavaScript/CSSの各タブにコードを貼り付けてRunボタンで実行してみます。
ちゃんと関数電卓になっていますね👍
左上の「F⇔」ボタンで簡易電卓と関数電卓を切り換えられるようになっていました!
おまけTips
PCで Background-Agent not found エラーが出るとき
はじめ、下図のようなエラーが出て、SlackからCursor側のBackground-Agent画面の呼び出しが上手く機能しませんでした。
このような場合は何らかのプロジェクトフォルダをCursorで開いてみてください。そうすると、下図のようなポップアップが左下に表示されます。「Connect Slack」をクリックします。
すると次のような画面がブラウザで開きます。「許可する」をクリックします。
無事Cursor側とSlackがリンクできました。これでSlackからのCursor側のBackground Agents画面の呼び出しが正常に機能するようになったはずです。
PCでのBackground Agentsの画面の開き方
一旦Cursorを閉じるなどして、Background Agentsを閉じてしまった場合の復帰方法です。
あの画面どこいった～ってなった方は参考にしてください。
まずは普通にCursorを起動して当該プロジェクトを開きます。
次にコマンドパネルを呼び出して以下を入力することで開くことができます。
CTRL + SHIFT + P → "show background agents"と入力
あるいはComposer画面右上の雲のアイコンからも開くことができるようです。
おわりに
いかがでしたでしょうか？
多くの方がAIエージェントの進化を感じられたんじゃないかなと思います。
スマホにSlackアプリを入れれば、スマホから簡単にCursorに作業を依頼して、進捗もスマホから確認でき、やろうと思えばお試し実行までできちゃうことが分かりました。凄い時代になりましたね～。
ご存じの方も多いかと思いますが、同様のAIエージェントにDevinがあります。Cursorはこちらをすごく意識していそうですね。活発な競争で今後さらに有用なツールが登場してくることに期待大です。
自分で考えてコードを書くことも楽しいですが、ただただ手を動かすだけの作業になることもしばしばあるかと思います。そんな時はこういったAIエージェントを活用して上手にラクをしつつより創造的な作業に集中したいですね！
ではまた👋