vscodeに関するuchiuchiyamaのブックマーク (43)
-
uchiuchiyama 2025/01/23
-
人間によるコーディング禁止の CLINE 縛りでゲームを作らせてみた感想
現時点の AI コーディングの実力を測るために、自分はプロンプトのみ、直接コードを書くのは禁止で Roo Code による VS Code によるエディタ操作のみでコードを書かせた。その感想 (急いで書いたのでいろいろと雑です) tl;dr 良し悪しはともかく、人類は確実にAIによる自動操縦型のプログラミング体験に依存するという確信を持った。 ただ、その基盤である CLINE(系)自体のツールとしての完成度はいまいち。 CLINE以外の、各モデルのコーディング性能も、現時点では物足りない。 CLINE とは何か(知らない人向け) いろいろと機能はあるが、コア機能としてはヘッドフルな vscode runner で、AI にコードを書かせるために必要な情報を受け渡しするインターフェースを持っている。ファイルの読み書きや、コマンドを実行結果をプロンプトにしてAIに渡す。puppeteer によ
-
-
VSCodeにChatGPTを！ 導入方法や使い方を理解して次世代の開発環境を整えよう
はじめに Microsoftの提供するVisual Studio Code（VSCode）は、2015年の最初のリリースから、今では開発用エディタの定番の座を占めるまでになりました。これには、無償で使えることも大きいですが、何よりエディタとしての使いやすさ、そしてさまざまな拡張機能によっていくらでも使い勝手を向上させ、利用の領域を拡げられることも大きいでしょう。本連載では、このVSCodeにフォーカスし、基本的な使い方から拡張機能の活用、そして本格的な開発現場での利用を想定した高度な機能までを紹介していくことで、読者がVSCodeマスターになるお手伝いをします。 対象読者 テキストエディタメインで開発してきた方 Visual Studioより軽い環境が欲しいと考えている方 Visual Sudio Codeをもっと使いこなしたい方 必要な環境 本記事の内容は、以下の環境で動作を確認していま
-
君はVS Codeのデバッグの知られざる機能について知っているか - Qiita
はじめに こんにちは、kenです。 GWに「暇だな～～、こんな日はVS Codeの公式ドキュメントを読むか！w」と思って何気なく読んでたらデバッグに関して知らない機能がいくつかあったので、今回はそれをご紹介したいと思います。 おそらく今から紹介する機能はあまり知られてないと思います。もし全部知ってたらVS Code完全理解者なので誇ってください。（！？） 以下に記載する内容はVS Codeの公式ドキュメントのDebuggingという章を参考にしています。 注意 デバッグで使える便利な機能 ログポイント機能 行を指定しログポイントを追加すると、その行を訪れたタイミングでログを出力できます。 もちろんログ内には{式}という書式を使えば式も含めることもできます。 既存のコードに修正を加えることなく、ログを出力できるのは嬉しいですね！！ これで 「プリントデバッグしたprint行を消し忘れてPRあ
-
GitHub Codespaces 雑感
GitHub Codespacesをちょっと試した。 初期導入時にハマりどころも多いけど、真面目に設定しておけば、普通にCodespacesの環境だけで開発することは十分できそうだなと感じた。リポジトリ単位で環境を用意するのが基本で、多くのリポジトリに対して毎日のようにレビューをしたりPull Requestを出したり、みたいな開発フローには綺麗にはまらないと思うけど、普通に仕事で単一のリポジトリに対してだけ作業する用途であれば上手くはまると思う。Zoomで会議しながら重い処理を実行していても影響が無いのは良かった。Zoomで会議しながら重い処理を回すべきではないという意見もある。 Codespacesの利用の流れ Codepsacesを利用するときの流れについて。まず、予め .devcontainer/devcontainer.json を配置したリポジトリを用意しておく。Codespa
-
-
-
VS Codeと内蔵端末をいい感じに使うための設定
開発にVS Codeとターミナルを使っています。 以前は、VS Code内蔵のターミナルとは別にWindows Terminalなどを立ち上げて、ターミナルでの作業はVS Codeの外でやっていました。 しかし、最近Windows Terminalを立ち上げる機会が減ってきたので、そのための設定やコマンドについて書きます。 ざっくり以下のような設定をしています。 { { // ターミナルパネルをトグル(oem_3は@を意味する) "key": "ctrl+oem_3", "command": "workbench.action.terminal.toggleTerminal" }, { // 新しいターミナルを作成する "key": "ctrl+shift+oem_3", "command": "workbench.action.terminal.new" }, { // ターミナルパネル
-
［速報］GitHub Codespacesが全ユーザーに無料提供へ、毎月60時間分。JetBrainsとJupyterLabもIDEとして選択可能に
［速報］GitHub Codespacesが全ユーザーに無料提供へ、毎月60時間分。JetBrainsとJupyterLabもIDEとして選択可能に GitHubは年次イベント「GitHub Universe 2022」の基調講演で、これまで有料プランのGitHub TeamとGitHub Enterpriseのユーザーに対して提供していた「GitHub Codespaces」を、無料プランの個人ユーザーにも毎月60時間まで無料で提供することを発表しました。 We’re here to help you push what’s possible: Starting today, we’re rolling out GitHub Codespaces for all, with access to 60 hours of GitHub Codespaces free(!) every mon
-
Next.js (TypeScript) に ESLint と Prettier を導入し、コードを綺麗に保とう | fwywd（フュード）powered by キカガク
どーも、入田 / ぐるたか @guru_taka です！ 本記事では Next.js (TypeScript) を環境構築し、ESLint（読み方：イーエスリント）と Prettier（読み方：プリティア）を導入する方法を紹介します。Next.js のバージョン 11 に対応しており、デフォルトで搭載されている ESLint の設定ファイルをベースとしています。 ESLint と Prettier を駆使することで、コードが綺麗になるため、導入することを強くオススメしたいです。本記事では、VS Code 上で、ESLint で構文解析しながら、ファイル保存時に ESLint + Prettier によるコード整形する方法をハンズオン形式でまとめています。
-
tasks.jsonの使い方の基礎【VS Code使い方②】 - Qiita
使い道 この記事は順番に実行したいタスクがあるときに役立ちます。 例えば、以下のような場面です。 開発環境にSFTPで接続してWordpressの子テーマを開発 区切りがいいところでZip化して「Zip削除→Zip圧縮→本番Wordpressにアップロード」のループが面倒 npm run build して、firebase deployする２段コマンドが面倒 AWS Lambda function にソースをアップロードしたい serverless frameworkを使えばserverless deployで終わりだが、使うほどのコード量でもない zip圧縮が面倒だが、連番圧縮しても容量の無駄なので、過去バージョンは自動で消したい やること tasks.jsonの基本 tasks.jsonで順次実行 7zと連携してみる npmとか連携してみる tasks.jsonの基本 初めての人はメニ
-
Docker や VSCode + Remote-Container のパーミッション問題に立ち向かう
概要 Docker や VSCode の Remote-Container でファイルシステムをマウントする際にパーミッションの問題に出会ったことはありませんか？Docker はパーミッションの扱いに面倒くささがあり、VSCode + Remote-Container はそれを黒魔術（＝力技）で解決しているのでよく分からずに使っていると想定しない結果になることがあります。 そこで Docker や VSCode + Remote-Container におけるパーミッションの扱いと対応方法をまとめてみます。 Docker とパーミッション まずは Docker がファイルシステムのマウント時にパーミッションをどう扱うかを解説します。 結論として Docker がホスト側のディレクトリをコンテナ内にマウントする際のスタンスは 「何もしない」 です。 しかしそれだけでは説明になっていないので、と
-
VSCode May 2022で紹介されていたDev Container in CIについて調べてみた
VSCode May 2022 (version 1.68)にDevelopment Container Specification関連の発表があった。 その中に、Dev Container in CIという項目があり、それについて調べてみた。 Dev Container in CI GitHub ActionとAzure DevOpsでdevcontainer.jsonで定義されたDevelopment Containerを使えるようになったようだ。 Development Containerについては、以下の記事を参照のこと。 以降、本記事ではGitHub ActionでのDevelopment Containerの利用について記載する。 GitHub ActionでDevelopment Container使用に関するドキュメントは以下で確認できる。 上記を見ると、devcontai
-
【日々更新】Visual Studio Codeの便利なプラグインまとめ（コーダー・マークアップ・フロントエンドエンジニア視点）
Visual Studio Code（VsCode）本体のインストール まだインストールされていない方は、以下からVsCode本体をダウンロードしてください。 VsCodeのおすすめプラグイン（コーダー・マークアップ・フロントエンドエンジニア視点） 私が導入しているVsCodeのプラグインを紹介します。 フロントエンドエンジニアとして働いている自分の普段の業務ではHTML CSS Sass(Scss) EJS Pug JavaScript TypeScript React Next.js PHP WordPress Markdownファイル等を触ることが多いので、それらに関連したプラグインが多くなっています。 共通 プラグイン名 機能
-
VS Codeの新機能「スティッキー スクロール」がさらに便利に！ 追従行数の変更、関数やクラスをリスト化できます
先日アップデートされた、VS Code v1.71で「スティッキー スクロール」がさらに便利になったので紹介します。 「スティッキー スクロール」はv1.70で実験的な機能として実装されましたが、v1.71で正式に実装され、さらに追従行数を設定できるようになり、スティッキースクロールで関数やクラスをリスト化して移動もできるようになりました。
-
React開発を快適にするChrome拡張を公開したので見てください！
React Inspector というChrome拡張機能を作りました。 Chrome上でインスペクタを起動し、クリックしたReactコンポーネントのソースコードをピンポイントでエディターで開きます。(現在はVSCodeのみ対応) 追記: ↑2022/09/12 オプションページから "Open in Editor URL" を設定できるようにし任意のエディターのURLスキーマで開くことができるようになりました...! Chrome web store: https://chrome.google.com/webstore/detail/react-inspector/gkkcgbepkkhfnnjolcaggogkjodmlpkh GitHub: https://github.com/hand-dot/react-inspector Reactのソースコードに直接ジャンプできるのでUIか
-
Docker Compose な開発環境にちょい足し3分で作るVSCode devcontainer
こんにちは、devcontainer職人です🧑🍳 今回紹介するのはDocker Composeを既に利用している開発環境にかんたんにdevcontainerを構築する方法を紹介します。 VSCodeのdevcontainerはとても良くできた開発環境構築方法なのですが、ちょっと難しそうと思われていたり、VSCode以外のエディタを使う人の開発体験が悪くなるのでは、などの懸念がありまだあまり使われていないような印象があります。今回はそんなdevcontainerを3分で作れるtipsを紹介します。 準備するもの Docker Composeで構築した開発環境 VS Code Docker Desktop for Windows/Mac Remote - Containers extension Docker Composeで構築した開発環境のサンプル 今回用意するのはサンプルとしてRu
-
language server protocolについて (前編) - Qiita
以下、それぞれのリクエストについて、少しずつ補足します。（各種機能の具体例としてスクリーンショットをいくつか挙げますが、このlanguage server protocolを実装したものには限定しません。） コーディング支援 自動補完は、典型的には . （dot）などをタイプした時に、その左辺オブジェクトのメンバーの一覧を表示する機能です。textDocument/completionが補完候補を表示するために送信するリクエスト、completionItem/resolveが補完候補を（カーソルキーなどでリストなどから）選択している時に送信するリクエストです。 テキストエディタは、ユーザー入力の1文字1文字について、completionリクエストを送信したりすることはありません（completionの処理はそれほど軽いものではなく、必要が無い場面で呼ぶべきものではありません）。comple
-
みんながきっと１万回は聞いている、VS Code Remoteでコンテナ開発をやる方法
こんにちは皆さん。 いやね、皆さんこう言いますよ。 「それもう何番煎じやねん！前も聞いたわ！」 ってね。 でも、こうも思うじゃないですか。 「たくさん記事があるってことは、ひょっとしてめっちゃくちゃ大事なことなのでは？」 とね。 とういうわけで、毎回まるで前提のごとく使っていたVS Code Remote Containerによるコンテナ開発について、自分が使っているやり方について簡潔に書いてみます。 マニュアルなぞっても面白くないですしね。 VS Code Remote VSCではリモート環境に入ってエディタを起動することができます。 イメージ的にはこんな感じで、リモート環境上で立ち上げたエディタを、外部から遠隔操作するようなイメージですね。 VS Code Remote自体は随分前からあったのですが、WindowsのDocker開発の環境が整うまでに結構かかったのですよね。 私のプライ
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Copyright © 2005-2025 Hatena. All Rights Reserved.
設定を変更しました