VSCode(VisualStudioCode)の定番機能を一挙解説 - Qiita
はじめに コードエディタ界の王様VisualStudioCode。開発の際に使っている方も多いのではないでしょうか。 本記事では、VSCode(VisualStudioCode)の定番機能を紹介していきます。 この記事を読んで、VSCodeマスターになりましょう！ 弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。 そもそもVSCodeって？ VSCode（VisualStudioCode)はMicrosoft社が提供する無償のコードエディタです。2015年リリースですが、着々とユーザーを増やしており、2023年現在、世界で最もポピュラーなコードエディタの1つとなっています。 コードエディタって？ 字や記号などのテキストで構
Vimmer、Visual Studio Codeを使う - 詩と創作・思索のひろば
まだ汚れを知らない若者だったころに「プログラムはね、これを使って書くんだよ」と言われて以来Vimは友達だと思ってずっと（15年くらい）使ってきたが、最近は、とくに新しく何かを書くときにはVSCodeを使うようになってきた。コードを書く間隔が広がってきたせいか、新しい技術や言語に対応することができておらず、なんか最初からいい感じになってるエディタを重宝する。歳を取ってきたからなんだろうな、と素直に思うけれど、自分向けになにかをカスタマイズすることにあまり熱を感じなくなっていて、すでにあるよいと分かっているものに自分を調整していくことを選ぶようになってきた。 とはいえ身体はVimに慣れきってるのでVSCodeを使い始めたときはVSCodeVimを使っている……いた、というのが今回の話。よくできてるとは思うが、とにかくu（アンドゥ）の挙動が本家と違うのがどうも身体に合わない。逆にストレスが高まっ
VSCode の新機能「built-in port forwarding」を使いローカルサーバーにインターネット側からアクセス - Qiita
VSCode の新機能「built-in port forwarding」を使いローカルサーバーにインターネット側からアクセスHTMLJavaScriptNode.jsVSCode はじめに この記事は、以下の公式ポストや、VSCode のアップデート後のリリースノートにも出ていた「built-in port forwarding」を試してみた話です。 この機能を使うと、ローカルにあるサーバにインターネットからアクセスできるようになります。 同様のことを実現するものには、有名どころの 1つに「ngrok（エングロック）」があったり、その他にもたくさんの類似サービスがあります。 実際に VSCode の built-in port forwarding を試してみる それでは、VSCode の built-in port forwarding を試してみます。 自分が試す際に参考にした情報は
VSCodeにFigmaを組み込む「Figma for VS Code」登場 コードの自動補完にも対応
この記事は新野淳一氏のブログ「Publickey」に掲載された「VSCodeにFigmaを組み込む「Figma for VS Code」登場。コードの自動補完にも対応」（2023年6月26日掲載）を、ITmedia NEWS編集部で一部編集し、転載したものです。 2022年、米Adobeによる買収が発表され話題となったWebデザインツールを提供する米Figmaは6月23日と24日の2日間、イベント「Config 2023」をサンフランシスコで開催しました。 その基調講演で、VSCodeのコードエディタ画面にFigmaの機能を組み込む「Figma for VS Code」が発表されました。 Figma for VS CodeはVSCodeのプラグインとして提供されます。 基調講演のデモでは、下図のようにVSCodeのコードエディタ画面と並んで右側にFigmaのキャンバス画面が表示されました。
チーム開発でVSCodeの拡張機能やフォーマット設定などを統一したい時に便利な設定ファイルについて | DevelopersIO
ただし、settings.jsonとかkeybindings.jsonをいじり始めると平気で1日溶けます。私はよく現実逃避で始めたキーボード設定で時間を溶かします。 こんにちは。AWS事業本部コンサルティング部に所属している今泉（@bun76235104）です。 みなさんはエディターは何を利用していますか？（火種） 私はnvimやVSCodeを使い分けています。チームで開発する時やペアプロをする時はVSCodeに便利な仕組みが揃っているからです。 今日はチーム開発の際にさっと導入できるわりに、不要な手間を省いてくれる.vscode/settings.jsonと.vscode/extensions.jsonについてお話しします。 何がうれしいのか .vscode/settings.jsonでは以下のようにファイル保存時のフォーマッタ適用や適用するフォーマッタの指定が可能です。 .vscode
自分的Visual Studio Code(VS Code)の必須設定4選 - Qiita
1. 区切り文字の設定変更 CSSクラス名や変数名をダブルクリックした際、ハイフン等がデフォルト設定では区切り文字として判定されます。それらの判定を変更する設定です。 設定前 設定後 設定手順 Code → 基本設定(Preferences) → 設定(Settings) 「設定の検索(Search settings)」欄に、editor.wordSeparators と入力 区切りとして扱ってほしくない文字を消す 初期値 2. HTMLブロックの一括選択設定 HTMLブロックの選択を楽にする為の設定です。 Emmet公式の説明ページ 選択したいHTMLタグにカーソルを合わせ、設定したキーを押すと、 ↓ 設定手順 Code → 基本設定(Preferences) → キーボードショートカット(Keyboard Shortcuts) 「入力してキーバインドを検索(Type to search
VSCode for Web、WebAssembly版言語ランタイムやシェルを拡張機能として実験的に実装。Webブラウザローカルでコードやシェルを実行可能に
VSCode for Web、WebAssembly版言語ランタイムやシェルを拡張機能として実験的に実装。Webブラウザローカルでコードやシェルを実行可能に Visual Studio Code（VSCode）をWebブラウザで利用可能にしたVSCode for Webは、ローカルマシンにVSCodeをインストールすることなく、WebブラウザさえあればGitHub上のソースコードなどを編集可能にする便利なサービスです。 ただし、VSCode for WebはWebブラウザ上で実行されているため、コードを実行するにはサーバなど、言語のランタイムがインストールされている別のマシンが必要となります。 この点は、ローカルマシン上のランタイムを用いてコードを実行できる、デスクトップアプリケーションとしてのVSCodeと比べた場合の、VSCode for Webの欠点といえます。 そこでこの欠点を補う
【早い！安い！うまい！】VSCode+WSL+Dockerで簡単に開発環境構築 - Qiita
三種の神器 今やWSL,Docker,VSCodeは使えて当たり前という雰囲気になってきたので、初心者のためにすごく適当簡単に導入手順をまとめたよ 卍最強の環境卍を構築するため以下の4ステップで解説するよ WSL2の導入 Dockerの導入 VSCodeの設定 使ってみる 1. WSL2の導入 そもそもWSLって何？という方もいらっしゃると思いますが、Windows内でLinux環境を使うことができるぜということだけ覚えておけばOKです 導入についてはPowerShellで以下コマンドを実行するだけ！ インストールしたらPCのスタートメニューからUbuntuを開き、ユーザ名とパスワードを設定しよう (Ubuntuを開くだけでユーザ名とパスワードを作成するための入力が求められます) WSLを真面目に知りたい方はこちら↓ https://learn.microsoft.com/ja-jp/wi
AWS上で開発環境一式、コードリポジトリからテンプレートコード、IDE、CI/CDパイプラインまでを丸ごと提供する「Amazon CodeCatalyst」が正式サービスに
AWS上で開発環境一式、コードリポジトリからテンプレートコード、IDE、CI/CDパイプラインまでを丸ごと提供する「Amazon CodeCatalyst」が正式サービスに Amazon Web Services（AWS）は、クラウド上でアプリケーションの初期コード、インフラ設定、ソースコードのリポジトリ、コードエディタ、ビルド／テスト／デプロイを実行するCI/CDパイプライなど、アプリケーションの初期設定から開発、デプロイ、そしてチームコラボレーション機能の一式をまとめて提供するサービス「Amazon CodeCatalyst」の正式サービス化を発表しました。 参考：［速報］AWS上で開発環境一式、フレームワーク、初期コード、IDE、ビルド環境、CI/CDなど提供する「Amazon CodeCatalyst」発表。AWS re:Invent 2022 複雑で手間がかかるクラウド開発環境を
AWS版GitHub Copilotとなる「Amazon CodeWhisperer」が正式版に。個人ユーザーは無料、VSCodeに対応
Amazon Web Services（AWS）は、コメントやコードの一部からAIがコードを自動生成してくれるサービス「Amazon CodeWhisperer」が正式版になったことを発表しました。 Amazon CodeWhispererは昨年（2022年）6月に行われたAWSの機械学習にフォーカスしたイベント「Amazon re:MARS 2022」で発表され、プレビュー公開されていました。 参考：AWSも、プログラミングを機械学習で支援する「Amazon CodeWhisperer」プレビュー公開。コメントを書くとコードを提案 コメントや書きかけのコードからコードを自動生成 Amazon CodeWhispererは、オープンソースリポジトリ、Amazon内部リポジトリ、APIドキュメント、フォーラムなどから収集した数十億行のコードを基にした機械学習から、プログラマが書き始めたコード
AWS版「GitHub Copilot」な「Amazon CodeWhisperer」が正式版に 個人ユーザーは無料、VSCodeに対応
参考：AWSも、プログラミングを機械学習で支援する「Amazon CodeWhisperer」プレビュー公開。コメントを書くとコードを提案 コメントや書きかけのコードからコードを自動生成 Amazon CodeWhispererは、オープンソースリポジトリ、Amazon内部リポジトリ、APIドキュメント、フォーラムなどから収集した数十億行のコードを基にした機械学習から、プログラマが書き始めたコードの続きや、コメントの内容からコードを提案してくれるサービスです。 コードを生成してくれる代表的なAIサービスであるGitHub Copilotの、AWS版と言ってよいでしょう。 下記は、1行目と2行目に自然言語で書かれたコメントから、3行目以降のコードが自動生成された様子です。 特にAmazon内部のリポジトリを基に学習されているため、AWSのサービスを活用するコードの生成は得意とされています。例
VSCode超入門／ロバストPython／エンジニアのためのマネジメント入門など、ITエンジニア向け新刊案内（2023年4月）
VSCode超入門／ロバストPython／エンジニアのためのマネジメント入門など、ITエンジニア向け新刊案内（2023年4月） 毎月登場する大量の新刊の中から、ITエンジニアが興味を持ちそうな書籍を選んで紹介する「ITエンジニア向け新刊案内」を毎月、月初に公開しています（2023年3月から開始し、現在試験的に継続中です）。 多くのITエンジニアにとって、書籍を通じた情報の入手は現在でも重要視されています。書籍選びにぜひお役立てください。 ここで紹介するのは、2023年3月1日から3月31日までのあいだに発刊された新刊書籍です。これらを「技術書」「ビジネス書」「資格試験対策／教本」「その他」に分類しています。各書籍はAmazon.co.jpへのリンクが貼られています（アフィリエイトではありません）。 この新刊案内がどのように作成されたかについては記事の最後にまとめましたので、興味のある方はそ
【すばやさ特化】Visual Studio Codeでスライド作成・発表まで行う - Qiita
年に1~2回は社内でLTを行ってきていて、今年もプレゼンテーションを行う機会が訪れました。LTの発表は数分で終わりますが、時間がかかるのは準備の方です。LTの準備には、まず発表テーマと内容を決めて、構成を検討します。資料を探したり、読み込んだり、自分の考え意見などを整理します。そして、PowerPointで資料を作成します。 地味の時間がかかるのが、「資料作成」です。何回かLTをやってきて、今後もLTをする機会がありそうなので、今回は、準備が時短するにはどうすればいいのか検討しました。 検討結果の1つが「PowerPoint」ではなく、「Visual Studio Code」でスライドを作成し、そのまま発表してしまうことです。デザインを細かく指定するのは、PowerPointの方に分がありますが、資料作成の手軽さ・早さでは「Visual Studio Code」に分がありそうです。 今回の
VSCodeにChatGPTの拡張機能を入れてコードレビューやバグを発見してもらう - Qiita
ChatGPTとは？ OpenAIが開発するGPT-3という言語モデルをベースとした(執筆当時)チャットアプリです。 こちらの質問に対して、AIが色々な質問に答えてくれて、一般的な内容だけではなく、コードレビューやバグなども発見してくれるめっちゃ凄いやつです。 細かい内容は以下の記事がとても参考となります。 筆者の関連記事 VSCodeと連携して、ブラウザを開かなくてもChatGPTを使用できるようにする 通常はブラウザを開いて使用するのですが、コーディング中にサクッとレビューしてもらったり、バグを見つけてもらえるような拡張機能があったので、そちらの設定方法について記述してみます。 今回インストールする拡張機能 使用までの手順 環境 PC: MacBook Pro (Apple M2) OS: macOS Ventura 13.1 VSCode: v1.74.3 OpenAIの価格について
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ポート転送機能を内蔵した「Visual Studio Code」2023年8月更新（v1.82.0）が公開／「コマンド センター」と新しい差分エディターは既定で有効化、
便利な“部分プロファイル”を作成できる「Visual Studio Code」2023年7月更新（v1.81）／差分（Diff）ビューワーにも大規模な改善
Microsoft、「Visual Studio Code for Education」のパブリックプレビューを発表／「MakeCode」のような初心者向け学習プラットフォームからのステップアップを支援
ターミナルで画像表示が可能に ～「Visual Studio Code」2023年6月更新（v1.80）／アクセシビリティ改善に引き続き注力、Windows 8/8.1対応は打ち切り
Microsoft、「TypeScript」高速化のために開発した「Deopt Explorer」を一般提供／「V8」の内部構造を理解している上級ユーザー向けの「Visual Studio Code」拡張機能
「Visual Studio Code」にプロファイル機能、職場・自宅で設定を切り替え可能／ほかにもさまざまな改善を施した2023年1月アップデート（v1.75）がリリース
