魔法のようなAIコードエディタ(Cursor、GitHub Copilot、Cline)は、一見すると謎めいたツールですが、その正体はElectronを基盤に、TypeScriptとReactを用いて構築されたWebフロントエンドです。
本セッションでは、AIコードエディタの内部動作を技術的に詳しく解説します。ユーザーが入力したプロンプトがどのようにLLMのAPIに送信されるのか、その際に必要な文脈や情報がどのように収集されるのか、レスポンスをどのように解析してUIに反映するのかを順序立てて説明します。
また、LLMからのツールコール(edit_file)を解析し、具体的なコード差分をVS Code APIを介してどのようにファイルへ反映するかについても触れます。実際のソースコードや具体的な動作フローの図解を交えて、「魔法」の中身を分解・理解できるようになることを目指します。
激動の2025年、クラウドで簡単に高性能なAIを呼び出せる時代となりました。
しかし、クラウドAIには以下の注意点があります。
・通信の遅延や切断
・プライバシーに関する懸念
・継続的な金銭コスト
LLMをクラウド経由ではなくローカルPC内で動作させることで、これらのリスクを回避できます。
2024年11月、Chromeブラウザ内部にGemini Nanoをダウンロードして利用できるBuilt-in AI APIのOrigin Trialがスタートしました。
本セッションでは、これらのAPIの概要から活用例までを、実際にAPIを利用して開発したChrome拡張機能のデモを交えて解説します。
※ AIのモデルとエコシステムの発展速度が非常に早いため、発表時(9月)の状況に応じて内容を調整する可能性があります。
フロントエンド開発で「なんでこの型設計がこんなに難しくなるんだろう?」と感じたことはありませんか?実は私も同じ悩みを抱えていました。
開発を進める中で気づいたのは、TypeScriptの型には「ユーザー視点の型」と「システム視点の型」という2つの異なる性質があるということ。
ユーザー視点の型は「検索フォームの状態」や「ページ遷移履歴」のようなUIと直結し、頻繁に更新される情報です。
一方、システム視点の型は「ユーザー情報」や「注文データ」のようなビジネスロジックやAPIに関わる構造で、整合性が重視されます。
この2つを混ぜると、UI変更がバックエンドまで影響することも。実プロジェクトから学んだ「型の境界線」の見つけ方を具体例とともにお話しします。