はじめに 動画版もアルヨ～。 Cursorとは Cursor とは一言で言うと、VSCode をベースに作られた AI 搭載のコードエディタのことです。 例えば、ChatGPT、Claude、Gemini などの生成AIを利用してプログラミングするときを思い出してみてください。 このように、エディタにコードを書きながら、ブラウザで開いている AI に質問をする、という作業を繰り返し行います。しかし、エディタとブラウザを行ったり来たりするのは少し面倒ですよね。 そこで登場するのが Cursor です。Cursor は ChatGPT や Claude、Gemini などの AI が内蔵されているエディタで、AIを使ってコードの編集、エラーの解決、ターミナルの操作、タブ補完などができます。 また、VSCode をフォークして作られているので、使い方、操作感も VSCode に非常に似ています。

生成AIによるプログラミング支援のCodeium、VSCodeフォークの「Windsurf」エディタ発表。変数名を1カ所変更して残りの修正を生成AIが行うなど高度な開発支援を提供へ 生成AIによるプログラミング支援ツール「Codeium」を提供しているCodeiumは、Visual Studio code（以下、VSCode）をフォークしCodeiumと統合した新しいコードエディタ「Windsurf」と、Windsurfを基盤とした新機能を発表しました。 Be in the flow state like all of these people. Be on Windsurf: https://t.co/fmB6ILjFW0 — Codeium (@codeiumdev) November 13, 2024 Codeiumはこれまで、生成AIによるコード補完やコード提案などによるプログラミ

もし世界が消滅して Visual Studio Code の設定が失われてしまった時に、この記事を見ればまた VSCode のカスタマイズが復元できる。 ここでは Visual Studio Code の見た目に影響するものについてのみ 取り上げる。 スクリーンショット Editor Terminal Zen Mode 環境 Visual Studio Code バージョン: 1.94.2 (user setup) コミット: 384ff7382de624fb94dbaf6da11977bba1ecd427 日付: 2024-10-09T16:08:44.566Z Electron: 30.5.1 ElectronBuildId: 10262041 Chromium: 124.0.6367.243 Node.js: 20.16.0 V8: 12.4.254.20-electron.0 OS

はじめに 知らない間にGitHub Copilotが結構進化していたので、それらの内容を紹介します。 GitHub Copilot Chatは知っていたのですが、単なるChatGPTみたいな会話機能を追加しただけだと思っていました。 要約 右クリックメニューや#fileのようなコマンドが登場し、それを入力するだけでChatに見てほしいコンテキストを伝えることができるようになった。 ファイル単位だけでなく、選択した行やブロックに限定することもできる。 テストコードや新しいプロジェクトをコマンド一つで生成できるようになっている。 推薦の候補も複数を同時に比較できるようになった。 一度に最大10個くらい出る上、タブで保管できる。 ターミナルや編集中のファイルからコマンド一つでChatを立ち上げることができる。 特別なプロンプトを入力しなくても、開いた場所の文脈を読み取ってくれる。 右クリックメニ

Flutter3.16から3.19へ移行してみようと思ったら、 かなりハマったので、いろいろ調べたときの備忘録(*´ω｀*) Breaking changes | Flutter Deprecated imperative apply of Flutter's Gradle plugins | Flutter 環境はこんな感じ。主にAndroid側の設定でハマる VSCode/Mac M2 FVM: 2系 → 3系 Flutter: 3.16.9 → 3.19.6 AndroidStudio: → 2022.1.1(JDK11) → 2023.3.1(JDK17) Gradle: 7.5 → 8.2 share_plus: 7.2.2 -> 9.0.0 package_info_plus: 4.1.0 -> 8.0.0 purchases_flutter(RevenueCat): 6.27

{ "editor.formatOnSave": false, "editor.formatOnPaste": false, "editor.formatOnType": false, } この記事で紹介している拡張機能のIDは、記事の最後にまとめています。また、設定の方法については設定のやり方に記述しています。 以下は、この記事で紹介する拡張機能のカテゴリ一覧です。 設定ファイル関連(Yaml, Json, Toml) Git関連 Markdown関連 カラー系 API関連 コンテナ その他便利な拡張機能 ネタ系 設定ファイル関連(Yaml, Json, Toml) 特にYamlやJsonはどのプロジェクトでも使用する可能性が高いので、必須の拡張機能となってくるかと思います。 Prettier esbenp.prettier-vscode jsonだけの設定では、VSCodeの設定ファイ

はじめに こんなツイートを見て執筆をしようと思いました。 実際に、VSCodeは機能の追加や拡張機能の開発が活発に行われており、かつUIもユーザーフレンドリーであるため人気のエディターだと思います。VSCodeを使いこなせるのとそうでないのではエンジニアリングの生産性に大きな差が出てしまうと思います。 パンくずの設定 '>' を入力します。 '>' preferences: Open User Settings (JSON)を入力します。 僕のsettings.jsonは以下です。 { "workbench.colorTheme": "GitHub Dark", "terminal.integrated.fontFamily": "MesloLGM Nerd Font", "terminal.integrated.profiles.osx": { "fish": { "path": "/o

作業メモ。モダン Python 速習。 AI 周りのツールを動かしていたら TypeScript だけでやるには無理が出てきたので、久しぶりに Python の環境構築をする。 具体的には TestGen LLM を動かしたい。 Python はたまに触るけど、基本 2.x 時代の知識しかない。 基本的にこの記事を読みながら、細かいアレンジをしている。 追記 rye が ruff と pytest を同梱してるので rye fmt, rye check, rye test で良かった uvicorn を叩くより、 fastapi-cli を使って起動したほうが良さそうので変更 基本方針: Rye に全部任せる 良く出来てると噂に聞いたので、 rye に任せる。 自分が Python が苦手な点は pip を下手に使うと環境が汚れていく点で、基本的に rye で閉じて管理させる。システムの

この記事はPrettierを使用している人を非難したり、脱Prettierを推奨する事を目的としていません。 こういった考え方もあるということをひとつの意見としてご覧いただければ幸いです。 勘違いしている人が多そうなので追記します。 Prettierを使わないというのは私が独断で決めた事ではないです。 チームが発足する際の技術選定で合意は取れていますし、私が関与していない別のチームでも同様にPrettier無しで開発しています。 私達のチームはメンバー同士を互いに信頼していますし、細いスタイルで喧嘩を始めるようなメンバーは居ないので安心してください。 はじめに Prettierはコードフォーマッターとして広く使われているツールです。 コードスタイルに関する議論をなくすことを目的としており、ESLintとは異なりデフォルト設定のままですぐに使えるのが特徴です。 さらに、PrettierはJS

30分でわかるシステム運用アンチパターン / Operations Anti Patterns in 30 minutes

こんにちは、 ast-grepの作者Herringtonです。 正規表現でコードを検索したことがある方なら、複数行のマッチングや入れ子構造の処理、コメントの無視などに苦労したことがあるかもしれません。 そこで、ast-grep VSCodeという新しい拡張を紹介します。これは、構造的検索と置換（SSR）という技術を利用して、より正確で効率的な検索と置換を実現するツールです。 構造検索は？ テキスト検索と置換の限界 例えば、JavaScriptコードをリファクタリングして、lodash の _.filter 関数をネイティブの Array.prototype.filter メソッド に置き換えたいとします。単純なテキスト検索と置換は次のようになります: これは一部のケースではうまくいくかもしれませんが、いくつかの問題があります。 一行の式しかマッチングできません。コードが複数行にまたがってい

この記事について この記事は、スマートフォン時代のWebデザインスクール や Web制作の基礎から学べる「Webコーディングスクール」 の資料制作をお手伝いして頂いているemiさんによる寄稿記事です。 コーディングを始めたい、コーディングにVSCodeというものを使うということはわかってるけど、なぜこれを使うんだろう。VSCodeの何が便利なんだろう。と思っている初心者の方に特に読んでほしいと思い書いています。 VSCodeを使うようになったきっかけ コードエディタ難民だった自分がいくつか試したのちに、Adobeが開発していたコードエディタBracketsに出会いました。拡張機能も追加しやすくてテーマも選べるし、使いやすい。とBracketsで落ち着いていたのですが、ある時「サポート終了になる」ということを知りエディタは何を使おうか…となり、その当時使い始める人が少しずつ増えていたVSCo

背景 担保したいこと 1: ホットキーで一撃で呼び出せる 2: ウィンドウを透過させてターミナルと他のウィンドウを同時に眺められること 調査したこと & 解決方法 ホットキーで呼び出せるか => hammerspoonで割り当てで対応 ターミナルの透過 => 無理そうなので、代替手段で対応 メモ: ターミナル関係のキーバインド tmuxっぽくしたい その他キーバインド 背景 iTermをずいぶん長く使ってきたけど*1、VSCodeのターミナルが急速に進化しているので、乗り換えを検討した。 VSCodeが色々便利になってきた 自分が使っている範囲だと、vimキーバインドも特に問題ない*2 普段のコーディングはVSCode、コマンド操作くらいしかiTermは使っていない 特にCopilot系の進化は目覚ましい、長い物には巻かれろというか長期的にはエコシステムに乗っておきたい エディタだけでなく

参考: 循環的複雑度 ちなみに githubで最もやべー関数を発掘するという記事では、循環的複雑度が高い関数が紹介されています。 ものによってはリンク切れしてしまっていますが、最も複雑度が高いのはnode（JavaScript）のjo関数で5505だそうです。想像もつかない... どのようにすれば循環的複雑度を低く抑えられるのか？ 計算方法から考えると、forやifによる分岐を減らしていくことが必要となります。 そのために、分岐の入るロジックを別関数として切り出し、１つの関数でやる事を絞り、分離することを理想として目指していきます。 とはいえ、いちいち複雑度の計算なんてしていられないですね。 そこで役に立つのが次のVSCode拡張機能です。 Code Metrics （VSCode拡張機能） この拡張機能は、TypeScriptやJavaScriptの関数・メソッドに循環的複雑度を表示して

はじめに 諸般の流れからC言語を使う機会が増えてきたので、あらためてVSCodeでC言語プログラミングができる環境構築を再確認しておきます。諸般の事情でWindows＋MSCです。今回はmakefileを使ってHelloWorldがビルドできる状況を確認します。HelloWorld単体をビルドするのにmakefileを使うことはあまり意味のないことかもしれませんが、シンプルな環境でなにか見えてくるものもあるかもしれないということで。 前提条件 VSCodeはなんらかのバージョンが既にインストールされていることが前提です。 MSCもなんらかのバージョンのVisualStudioのVisualC++がインストールされていることが前提です。 今回は具体的には下記のバージョンを想定してお話が進みます。前回の記事でtasks.jsonとlaunch.jsonを生成して通常の[実行とデバッグ]からデバ

はじめに ファイルの末尾には改行を入れたほうが良いのでしょうか。 「ファイル 末尾 改行 POSIX」等で調べると、規格の観点から改行を入れた方がいいという話が出てくるのですが、今回はgitの仕組みの観点からも改行を入れたほうが良いという話をします。 GitHub上での末尾改行の警告 例えば末尾に改行のないこんなファイルが有るとし、commitしてGitHubにpushすると以下のような表示になります export function hello(name: string) { return `Hello, ${name}!`; }

連載「Visual Studio Code TIPS」 Visual Studio Code（以下、VS Code）では、幾つかの方法で「現在のカーソル位置にある単語と同じ単語をまとめて選択」できる。これを「マルチカーソル選択」と呼ぶ。本稿では、マルチカーソル選択機能の使い方を説明する。

先日アップデートされた、VS Code v1.86で、スティッキースクロールがツリービューでも使用できるようになったので、紹介します。 エディタのスティッキースクロール（紹介記事）ができるようになった時もその便利さに喜びましたが、ツリービューでもできるようになり、深い階層でもすべての親を常に表示しておくことができます。 ツリービューのスティッキースクロールを使用するには、デフォルトではオフになっているので、機能をオンにする必要があります。 ※オンになっている人もいるようですね。

Web版VSCodeがDockerコンテナをWASM環境で起動、Webブラウザ内ローカルマシンとして利用可能に。拡張機能「vscode-container-wasm」登場 WindowsやMacなどのデスクトップPCでVisual Studio Code（以下VSCode）を利用して開発をする場合、同じローカルマシン上でDockerコンテナのLinux環境を起動し、VSCodeのターミナルで接続して操作することは、開発環境としてよくあることだと思います。 これと同じことをWebブラウザ版のVSCodeでも実現する、すなわちWeb版VSCodeが同一Webブラウザ上にWebAssembly化したDockerコンテナを起動し、Web版VSCodeからローカルマシンとして接続し利用できる、実験的実装を実現したVSCodeの拡張機能「vscode-container-wasm」が登場しました。 V