明るく

暗く

AI

Cursorの使い方を初心者向けに解説!導入・日本語化から実践チュートリアルまで

Cursorの使い方を初心者向けに解説!導入・日本語化から実践チュートリアルまで

ChatGPTなどの対話型AIにプログラムは書いてもらえるけど、動くアプリとして完成させるのが大変だと感じていませんか?

 

一般的なチャット型AIは、画面上に答えを提示するだけで、実際のファイル操作は行ってくれません。そのため、提示されたコードをエディタに貼り付けたり、ファイルを管理したりといった作業は、すべてユーザー自身で行う必要があります。

 

そこで活用したいのが、AI搭載エディタのCursor(カーソル)です。Cursorを使えば、AIがあなたのやりたいことを理解し、ファイル操作やコードの修正を直接行ってくれます。

 

この記事では、Cursor(カーソル)の導入方法から使い方、実際にAIに指示を出して動くモノを作る手順までを、初心者向けに解説します。

Cursorとは?AIが統合された次世代のコードエディタ

Cursorは、プログラミング初心者でも、日本語で指示するだけでAIがコード作成をサポートしてくれるAI搭載エディタです。

 

なぜ今Cursorが注目されているのか、Cursorを使うメリット、およびChatGPTとの違いを解説します。

Cursorの概要:なぜ今注目されているのか

Cursorは、世界中のエンジニアが愛用する VS Code(Visual Studio Code)をベースに、AI機能を直接組み込んだ進化型のエディタ(コードを書くためのソフト)です。

 

このCursorが注目されている大きな理由は、プログラミングの「調べる・書く・直す」というサイクルを一つの画面で完結できる点です。

 

従来のチャット型AI(ChatGPTなど)を使う場合、コードを書いてはAIに質問し、回答をコピー&ペーストして修正するといった、画面の往復が必要でした。

 

一方、Cursorはチャット上のボタン一つで、直接修正を反映できるため、画面を往復して思考を止める必要がありません。

 

プロと同じ開発環境で、AIが常に隣でサポートしてくれる。この使い勝手の良さが、効率を求めるプロから挫折したくない初心者まで、多くの人々を惹きつけている理由です。

Cursorを使うメリット:日本語で伝えるだけでコードが書ける

Cursorを使う最大のメリットは、プログラミングの熟練者でなくてもやりたいことを日本語で伝えるだけで、コードが書ける点です。

 

これまでは、コードを1行書くために複雑な文法を暗記し、エラーが出たら何時間もかけて調べる必要がありました。

 

しかしCursorを使えば、書き方を覚えていなくても大丈夫です。何を作りたいかを日本語で指示するだけで、AIがあなたの代わりに適切なコードを提案・作成してくれます。

 

Cursorを活用することで、具体的に次のようなメリットがあります。

 

  • エラーの解決が早い:エラー内容をAIが自動で読み取り、修正案を出してくれる
  • アイデアをすぐに形にできる:作りたい機能を言葉にするだけで実装できる
  • 学習スピードが上がる:わからないコードの意味をその場でAIに質問できる

ChatGPTとの違い:ファイルを直接編集できる

「コードを書くならChatGPTでもいいのでは?」と思うかもしれません。しかし、Cursorには決定的な違いがあります。それは、AIが作業フォルダの中身を自動で読み込み、ファイルを直接編集できるという点です。

 

  • ChatGPTの場合
    コードの文脈を伝えるために、手動でファイルを添付したり、コードをコピペしたりする手間がかかる上、出力されたAIの修正案を自分で貼り付け直す必要があります。
  • Cursorの場合
    開いているフォルダを丸ごとAIが把握しているため、ファイルを読み込ませる作業が不要な上、指示するだけでAIが直接ファイルを書き換えてくれます。また、フォルダを把握していることから「このプロジェクト全体のフォーマットに合わせて修正して」といった指示も可能です。

【図解】Cursorの初期設定:インストールから日本語化まで

Cursorにはブラウザ版とデスクトップ版があります。コードを直接編集しながらAIを使えるのは、デスクトップ版の方です。

 

ここではデスクトップ版Cursorのインストールから日本語化まで、迷わず初期設定ができるように、図解付きで詳しく解説します。

 

※本記事ではmacOS版の画面を使って解説しますが、どのOSでも基本的な操作手順は同じです。

(1)公式サイトからのダウンロード・インストール

まずは公式サイトからインストーラーをダウンロードします。

  1. Cursor公式サイトのダウンロードページにアクセスします。
  2. 基本的には、画面上部に表示されるダウンロードボタンをクリックすればOKです。

    Cursorダウンロード画面

  3. もしボタンが表示されない場合や、別のOS用ファイルをダウンロードしたい場合は、画面下のリストからご自身の環境に合ったものを選択してください。
  4. ダウンロードしたファイルを開き、画面の指示に従ってインストールを進めます。

(2)アカウント作成と初期設定

インストールが完了してアプリを起動すると、初期設定が始まります。次の手順で進めてください。

1.アカウント作成とログイン

まず最初にログイン画面が表示されるので、次の手順でログインを実施します。

 

  1. 「Sign Up」ボタンをクリックします。
  2. 自動的にブラウザが立ち上がり、認証画面が表示されます。
  3. 登録したいアカウントでログイン、あるいはメールアドレスで登録してください。
    ※本記事ではGoogleアカウントでログインして進めます。

    Cursorのサインイン画面

  4. 次のような確認画面が表示されたら、画面中央に表示されているアドレスを確認し、「Yes, Log In」というボタンをクリックしてください。

    アドレスでのログイン確認

    ※もしこの後「Cursorを開きますか?」というポップアップが出たら、許可(Cursorを開く)をクリックすればアプリに戻ります。

2.初期設定

ログインに成功すると、設定画面(Preferences)が表示されます。次の3箇所を確認して進めましょう。

  1. Keybindings(キー操作の設定)
    ショートカットキーのルールを決める設定です。特に変更せず「VS Code」のままでOKです。
  2. Chat Language(AIの言語)
    AIとの対話に使う言語設定です。プルダウンから「Japanese」を探して選択します。(※メニューの日本語化は後述します)
  3. Open Cursor from Terminal(コマンド起動)
    コマンド画面からCursorを起動する機能です。初心者は使わないため、このままでOKです。

    最後に「Continue」をクリックします。

    プリファレンス画面

(3)日本語化の設定手順

初期設定ではメニューやコマンドの表示が英語になっています。次の手順で日本語に切り替えましょう。

※もし英語に戻したければ、同様の手順で「English (en)」とすれば、英語に戻すこともできます。

  1. 画面上のメニューバーから「View→Command Palette」を選択します。
    ショートカットキー:Ctrl + Shift + P (Macは Cmd + Shift + P)

    コマンドパレットを表示

  2. 入力欄が出てくるので、「display」と入力し、候補に出てきた「Configure Display Language」をクリックします。

    表示言語の設定を選択する

  3. 言語リストから「日本語 (ja)」を選択します。

    日本語を選択する
    以下の画像が表示される場合は、「Trust Publisher & Install」をクリックします。

    Trust Publisher & Installをクリックする

  4. 「再起動しますか?」というボタン(Restart)が表示されるので、クリックして再起動します。

 

この手順を実行することで、メニューバーやコマンドが日本語で表示されます。

メニューバーとコマンドが日本語表示

初心者はこれだけ覚えればOK!CursorのAI機能の基本操作

CursorのAI操作に、難しいコマンドを覚える必要はありません。専用のチャット画面を呼び出し、「モード」と「モデル」を選択するだけで、誰でもすぐに使うことができます。

ここでは、初心者が最短でCursorを使いこなすために必要な基本要素を解説します。

AIチャット(AIパネル)の呼び出し

CursorでのAI操作は簡単で、AIチャット画面で行います。メニューの「ファイル → フォルダーを開く」でデータの保存先フォルダを選択するか、次のショートカットキーで呼び出しましょう。

  • Windows:Ctrl + L
  • Mac:Cmd + L

ここに日本語で指示を入力し、AIに処理を依頼することができます。

 

AIパネルが表示される

※お使いの環境設定によって、AIチャットが右側ではなく左側に表示される場合もあります。

モードの使い分け

モードとは、AIにどのような役割で作業してほしいかを指定する機能のことです。Cursorでは、AIチャットの左下にあるメニューを選択するとモードを切り替えられます。

 

モードを選択する

 

それぞれのモードの使い方は次のとおりです。

 

  • Agent(エージェント)★基本はこれでOK!
    コードの生成から修正、質問まで何でもこなす万能なモードです。
  • Plan(プラン)
    コードを書き始める前に、どのような手順や構成で作るべきか設計図を相談するときに使うモードです。
  • Debug(デバッグ)
    エラーの解決に特化したモードで、Agentでは直せなかった難しい不具合があるときに使います。
  • Ask(アスク)
    「このコードはどう動いているの?」といった、対話や学習に特化したモードです。Agentと違いファイルの書き換えが発生しないので、安心して対話ができます。

 

基本的にはデフォルト設定されているAgentを利用すればOKです。もしAgentでうまくいかない場合には、他のモードに切り替えてみてください。

モデルの変更方法

Cursorでは、ChatGPTやClaude、Geminiで使われているAIモデルを切り替えて利用することができます。

AIチャットの下部に、現在使用しているAIモデルの設定が表示されています。

 

AIモデルの設定
デフォルトはAutoとなっていますが、基本的にはこのままでOKです。この状態なら、Cursorが最適なモデルを自動で選んでくれます。

 

無料プランで高機能なモデルを使いすぎると、回数制限がかかることがあります。その場合は、次の手順で軽量モデルに切り替えましょう。

 

  1. チャット欄の左下にあるモデル名(デフォルトだとAuto)をクリックします。

    モデルのAutoを選択

  2. リストにある「Auto」のスイッチをOFFにします。

    モデルのAutoをオフにする

  3. リストの中から、名前に「Flash」や「Mini」とついているモデルを選択します。(例:「Gemini … Flash」や「GPT … Mini」など)これらは軽量なため回数制限に引っかかりづらく、簡単なコード生成なら十分な性能を持っています。

    使うAIモデルを選択する

【実践チュートリアル】AIに指示して簡単なWebページを作ってみよう

実際の使い方の一例として、CursorのAI機能を使って簡単なWebページを作成してみましょう。フォルダ作成からWebページ完成まで、順番に解説していきます。

Step1:フォルダを作成してCursorで開く

まずは、次の手順で作成するファイルの置き場所を作ります。

  1. デスクトップなどに新しいフォルダを作成し、名前をつけます。
    ※本記事ではフォルダ名を「my-website」として進めます。
  2. Cursorを起動し、メニューの「ファイル→フォルダーを開く」を選択します。

    ファイルからフォルダーを開くを選択

  3. 先ほど作成したフォルダを選択して開きます。

    作成したフォルダーを開く

 

この手順で、画面の上中央や端(サイドバー)にフォルダ名(MY-WEBSITE)が表示されていれば準備完了です。ここで選択したフォルダ(ここではMY-WEBSITE)に、Webサイトのコードがデータとして保存されていきます。

Cursorでmy-websiteが表示される

 

もしフォルダを開いてもサイドバーに何も表示されない場合は、メニューの「表示→エクスプローラー」をクリックするか、次のショートカットキーを押すと表示されます。

  • Windows:Ctrl + Shift + E
  • Mac:Cmd + Shift + E

Step2:Agentモードでコードを書かせる

次の手順で、AIにコードを送信します。

  1. AIチャットが表示されていない場合は、Ctrl + L(Macは Cmd + L)で開きます。
  2. モードをAgentにします。
  3. 次のプロンプト(指示文)をコピーして、チャット欄に貼り付けて送信(Enter)してください。

    おしゃれなカフェのようなWebページを作ってください。

    ・ページを開いたときの最初に目に入る画面には「Welcome to AI Cafe」というタイトルを入れる

    ・メインカラーは落ち着いたブラウン系

    ・ボタンをクリックすると背景色がダークモードに切り替わる 

 

送信すると、AIがすぐにファイルの作成を開始します。

AIがファイルを作成中

 

自動でコードの作成が進んでいくので、完成するまで待ちます。

Step3:ブラウザで表示確認&修正する

コードの作成が終わったら、実際に動くか確認し、AIに追加の修正を頼んでみましょう。

1. ブラウザで表示を確認する

データ保存先としてStep1で選択した my-website フォルダを開き、中にあるhtmlファイルをダブルクリックしてください。普段お使いのブラウザ(Google Chromeなど)が立ち上がり、Webページが表示されます。

 

✅ 動作チェック
ボタンをクリックして、背景色がダークモードに切り替わるか確認します。画面に表示されたボタン(Dark Modeなど)を押してみてください。背景色が変わり、ダークモードに切り替われば成功です!

AICafeでDarkModeを選択する

 

AICafeがダークモードに切り替わる

 

思ったような動きにならなかったり、デザインが崩れていたりしたら、その部分のスクショをAIチャットに貼り付け、「動かないので直して」「デザインが崩れているので直して」と送ってみましょう。

 

無事に動くことが確認できたらCursorの画面に戻り、「Keep All」をクリックして作成したコードを確定させます。

Keep Allをクリックしてコードを確定

 

コラム:Cursorの提案を操作する3つのボタン(Keep All・Undo All・Review)

Cursorのコード生成後に表示されるこれらのボタンは、作成した内容をどうするかを決めるための機能です。

 

▼Keep All(すべて保持)

 

  • 役割:変更の確定(承認)です。
  • 動作:緑や赤のハイライト(未確定)が消え、コードが正式に確定されます。
  • 補足:押さなくてもコードは動きますが、指示や修正が多くなると、どこが正しいコードかわかりづらくなります。動作確認後はこまめに確定し、画面を整理しましょう。

 

▼Undo All(すべて元に戻す)

  • 役割:変更の取り消し(却下)です。
  • 動作:そのチャットで行った変更(コード生成や修正)がすべて破棄され、指示を出す前の状態に戻ります。
  • 注意点:「Keep All」で確定させた後でも、このボタンを押すと新規作成されたファイルは削除され、変更されたファイルは元に戻ってしまいます。もし誤って押してしまった場合は、元に戻すように指示を出して復元しましょう。

▼Review(レビュー)

  • 役割:変更の確認です。
  • 動作:AIがこのチャットでどこを直したのか、色別で詳しくチェックできます。
    • 緑のハイライト:AIが新しく追加・変更した部分
    • 赤のハイライト:削除された元の部分

2. AIに修正を依頼する(予約ページを作ってリンクさせる)

次に、このページを修正してみましょう。予約ボタンを押すと、予約フォームのページに移動するように追加の指示を出します。

Cursorのチャット欄(Agentモード)に、次のプロンプトを入力して送信します。

「予約する」ボタンを追加し、クリックすると予約ページに移動するようにしてください。

・予約ページの内容:お名前、日時、人数の入力フォームと送信ボタン
・予約ページのデザイン:今のページと同じ雰囲気で、おしゃれに統一する
・「トップに戻る」ボタンもつける

3. ブラウザで動きを確認する

1.でブラウザに表示させたページを再読み込み(リロード)します。

 

✅ 動作チェック
新しく追加された「予約する」ボタンを押してみてください。画面が切り替わり、「予約フォーム」が表示されたら成功です。

AICafeの予約ボタンをクリック

 

AICafe予約ページが表示される

 

修正した内容が正しく動くことを確認したら、Cursorの「Keep All」を押してコードを確定させましょう。

 

このように、ページを増やしてリンクさせるという複雑な作業も、Cursorを使うとあっという間にできます。

コラム:なぜこのコードなの?と聞いてみよう

コードの意味を知りたいときには、AIチャットのモードをAskに切り替えて聞いてみましょう。

例:script.jsのコードがどう動いているのか、初心者向けに解説して

このように投げかけると、JavaScriptの仕組みを丁寧に教えてくれます。Cursorは単なる自動作成ツールとしてだけでなく、独学を支える学習パートナーとしても活用できます。

Cursor初心者に関するよくある質問

ここでは、初心者が疑問に持ちやすい点について回答します。

Q. 無料プランでも十分使えますか?

はい、最初は無料版で十分使えます。

無料プラン(Hobby)でも、一定回数までは高性能なAIモデルを利用できます。また、軽量モデルは無制限で使えるため、学習や小規模な開発で困ることはほとんどありません。

 

ただし、利用できる回数やモデルの内容は変更されることがあるため、最新の条件は公式サイトの案内もあわせて確認することをおすすめします。

Q. プログラミング知識がゼロでも大丈夫ですか?

 問題ありません。何を作りたいかを言葉にできれば、AIがコードを書いてくれます。

 

ただし、生成されたものが正しいか判断したり、細かく調整したりするためには、プログラミングの知識が必要になります。AskモードでAIに解説してもらいながら、少しずつ知識をつけていくのがおすすめです。

Q. AIが書いた.htmlファイルをクリックしたのにWebサイトが表示されません。

 まずは以下の4点を確認してみましょう。

  • Cursorのコード作成が完了しているか
  • 保存先に指定したフォルダを間違えていないか
  • 保存先フォルダに生成された.htmlファイルをダブルクリックしているか
  • ファイルをブラウザで開いているか

 

ファイルをテキストエディタで開いている場合は、.htmlファイルを右クリックして「プログラムから開く」でブラウザ(Google Chromeなど)を選んでください。チャットをAskモードにして、解決法を質問してみてもよいでしょう。

まとめ:Cursorがあれば誰でもアイデアを形にできる

プログラミングの深い知識がなくても、何を作りたいかというアイデアさえあれば、AIが形にしてくれるようになりました。

 

その中でも、Cursorが初心者にとっておすすめの理由は次の3点です。

  1. 導入が簡単: インストールしてクリックするだけで、日本語環境ですぐに使い始められる
  2. 面倒な実作業をAIが代行: 指示を出すだけで、AIが複数のファイルにまたがるコード作成や修正を、あなたの代わりに直接行ってくれる
  3. 「わからない」をその場で解決: エラーが出てたり設定に迷ったりしても、Askモードで質問しながら解決できる

 

Cursorは、エンジニアだけのツールではありません。業務を効率化したい社会人や、新しいサービスに挑戦したい学生にとっても、自分の可能性を広げる強力な武器になります。

 

ぜひCursorをインストールして、あなたの頭の中にあるアイデアを実現してみてください。