1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Windows11でのCursor開始手順

Posted at

サマリ

Windows11でのCursor開始手順(インストール方法)についてまとめました。

背景

もうAIに関するニュースを見ない日がないほど日々AIの進展・活用が進んでいる今日この頃。
さすがにAIエディターにも触れておかないとと思い、
インストールしてみました。

ゴール

Windows11へのCursorのインストール

対象読者

  • Cursorを使ってみたい方
  • 自分(備忘)

環境

  • ホストOS:Window11 Home 24H2

そもそも

Cursor(カーソル)とは、AI機能を搭載したエディターで、
VS Code(Visual Studio Code)をベースにして開発されているので、
VS Codeを使っている人は同様の使用感で使うことが出来ます。

AI機能搭載エディタはほかにもGithubCopilot等もありますが、
VS CodeになじみがあるのでCursorを試してみることにしました。

インストール手順

それではやっていきます。

インストーラのダウンロード

下記の公式サイトにアクセスします。

image.png

ダウンロードをクリックすると、インストーラがダウンロードされました。

image.png

インストーラの実行

ダブルクリックして実行します。
使用許諾に同意しないと次に進めないので同意します。

image.png

インストール先を選択します。
今回はデフォルトの保存先にします。

タイトルなし.png

スタートメニューにショートカットを作成するか選択します。
今回は選択しました。

image.png

追加タスクの選択では、
デフォルトでは下二つにチェックが入っています。

image.png

各項目と今回した選択についてです。

  • デスクトップ上にアイコンを作成する
    →文字の通りですね、デスクトップから起動することはないのでチェックしません
  • エクスプローラーのファイルコンテキストメニューに[Cursorで開く]アクションを追加する
    →エクスプローラーでファイルを右クリックしたら[Cursorで開く]という選択が出るようになります。
     まだお試しで使うだけなのでチェックしません。今後がっつり使うなら変えるかもしれません。
  • エクスプローラーのディレクトリコンテキストメニューに[Cursorで開く]アクションを追加する
    →上と同じですね、ディレクトリについてです。こちらも一旦チェックしません。
  • サポートされているファイルの種類のエディターとして、Cursorを登録する
    →.txtや.py等のファイルをデフォルトで開くアプリとしてCursorを登録するかの選択です。
     まだがっつり使い込むか決めていないのでチェックを外します。
  • PATHへの追加(再起動後に使用可能)
    →PowerShellなどのコマンドラインからcursorコマンドの実行ができるようになります。
     がっつり使うか決めていないですが、特に追加しておいて不便はないと思ったのでチェックしておきます。

というわけで、下の画像の形で次へを選択します。
image.png

インストールの準備が完了ということで、
設定した内容の再確認です。(親切…!)

タイトルなし.png

インストールが始まります。

image.png

セットアップできました(おぉ~

image.png

起動・ログイン

Cursorが起動されました。
アカウント持っていないので、SignUpを選択します。
image.png

ブラウザでアカウント作成画面が出ます。

image.png

今回はメールアドレスでサインアップします。
名前とアドレスを打ち込むと認証コードがメールで届くので打ち込みます。
パスワードを打ち込んで完了です。

すると、CursorDesktop(先ほどインストールしたアプリ)にログインするか聞かれます。
そのままログインしたいので、Yes,Log inをクリックします。

タイトルなし.png

初期設定

ログインしたら、初期設定として
VSCodeから設定をインポートするか聞かれます。
インポートします。

image.png

拡張機能やほかのプロファイル設定もインポートするか聞かれます。
特に問題ないかと思うので、インポートをクリック。

image.png

テーマを選択できます。
何かかっこいいのでMidNightDarkにしました。

image.png

クイックスタートということで、
キーバインド(キーボードの割り当て)の設定についてです。
VS Code、Vim、Emacs、Sublime Textとあるので、
自分が普段使い慣れているエディタを選択したら問題ないかと思います。
VS Codeにします。

image.png

次は、データ共有についてです。
デフォルトでは、Cursorはコードから学習する(最初1日はオフで、それ以降学習する)ということですが、
設定でオフにできるとのことなので、とりあえずチェックして前に進みます。

image.png

設定の確認ということで、
AIからのレスポンス言語の選択と、ターミナルでCursorを開けるようコマンドのインストールです。
(これインストーラ起動時にPATH追加したような…あまり気にせず進めます(おい))

image.png

無事、開けました。

image.png

お試し

適当にHTMLを作成してもらいました。
ctrl+lで自由にAIに質問したりできます。
ctrl+kでエディタの任意の行でAIにコード追記・修正させたりできます。

勝手にコード作成してくれます。
(お試しなので内部スタイルシートになっていますがご愛嬌で・・)
image.png

おぉ~
image.png

エディタ画面の下にRejectとAcceptがあるので、
問題なければAcceptします。

image.png

追加でCSSの追加や見栄えの良さをお願いしたらすぐにこんな形になりました。
マウスホバーエフェクトもあっという間に…!

image.png

AIチャットにコピペして改善して…というのは今までやったりしていましたが、
エディター上でコードをみながらその場で自動修正もできるの便利すぎますね…!

タブ補完もあり、
こんな感じで次のリストを書こうとしたら、上で書いているコードから予測して提案してくれます。

image.png

参考

以下の記事を参考にさせていただきました。
(簡単な操作方法についても載っています)
ありがとうございます。

結果・まとめ

無事Cursorのインストールができ、ほんの少しだけ触ってみることが出来ました。
機能を使いこなすにはまずはいろいろ触ってみないといけませんが、ちょっと触れただけでも便利なのがわかります。
いやしかしすごいですね~
こんなに実用的に使えると、働き方もガラッと変わりますね…!
全部のキャッチアップは難しくとも、少しでもおいて行かれないように気になったものは触れていきたいと思います。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?