Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? みなさんプログラムは書いていますでしょうか。この一年でChatGPTができ、CopilotにCopilot Chatなど色々なAIツールが出ていますが今回お勧めするのはPhindというAIアシスタントです。 Phindとは Phind(Phind.com)とは端的にいえばGPT-4を超えるコーディング能力に特化した言語AIです 参考リンク：大規模言語モデル「Phind」がコーディングにおいてGPT-4を上回る リンク内で言われているように、WebからChatGPTやGoogleのように簡単に使うことができますが、Phindの真髄はここで

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

初めにCursorというAIファーストのすごいテキストエディタのご紹介です。もちろんChatGPT内蔵です。このエディタは、Visual Studio Code をフォークして作られているため、VSCode からのスムーズな移行ができます。そのため、Github Copilot も併用できます。 できること、基本的な機能や特長AI編集機能Command KはAIと一緒にコードを編集、生成する機能です。コードの一部を選択して「Command K」を押すか、「Edit」とクリックすると、そのコードをどのように変更すべきかをAIに説明することができます。 使い方

はじめに Microsoftの提供するVisual Studio Code（VSCode）は、2015年の最初のリリースから、今では開発用エディタの定番の座を占めるまでになりました。これには、無償で使えることも大きいですが、何よりエディタとしての使いやすさ、そしてさまざまな拡張機能によっていくらでも使い勝手を向上させ、利用の領域を拡げられることも大きいでしょう。本連載では、このVSCodeにフォーカスし、基本的な使い方から拡張機能の活用、そして本格的な開発現場での利用を想定した高度な機能までを紹介していくことで、読者がVSCodeマスターになるお手伝いをします。 対象読者 テキストエディタメインで開発してきた方 Visual Studioより軽い環境が欲しいと考えている方 Visual Sudio Codeをもっと使いこなしたい方 必要な環境 本記事の内容は、以下の環境で動作を確認していま

錦です。 VSCodeって便利ですよね。最近のアップデートではリモート開発の機能が拡充され続けています。今回はVSCode Serverの使い方をご紹介します。 VSCode Server 最低限必要なもの 環境を整える。 VSCode Serverを起動する 起動する アクセスする VSCode Server VSCode Serverは、自分のPCをVSCodeのサーバーとして、ブラウザのVSCode.devから遠隔でワークスペースにアクセスできるというものです。そのまんまのVSCodeのGUIなので、ターミナルを含めてほぼ全ての機能を利用することができます。 サーバー側に必要なのはVSCodeあるいはVSCode CLIのみで、クライアント側はVSCode.devにアクセスできるブラウザとインターネットだけでいいのです。つまり、WindowsやMac、Linux搭載のPCさえあればi

この記事はNuco Advent Calendar 2022の14日目の記事です。 VSCodeに必須の機能20個を紹介していきます。 インストール数と星の数は記事作成時点(2022年11月時点)のものです。 Japanese Language Pack for Visual Studio Code vscode-icons Code Spell Checker zenkaku Path Autocomplete Prettier - Code formatter indent-rainbow GitLens Git History HTML CSS Support Output Colorizer TODO Highlight vscode-random Atom One Dark Theme Trailing Spaces REST Client Live Server Jupyter

Visual Studio Code では内容が似ている 2 つのファイルを比較して、違っている部分を強調表示する Compare コマンドが用意されています。ここでは Visual Studio Code を使って 2 つのファイルの内容を比較して差分を表示する方法について解説します。 2つのファイルの差分を表示する まず比較する二つのファイルを開き、いずれか一つをアクティブにしてください。 コマンドパレットを開きます。「表示」メニューの中にある「コマンドパレット」をクリックしてください。 コマンドパレットが表示されたら「比較」または「Compare」と入力してください。表示されたコマンドの中から「ファイル：アクティファイルを比較しています」をクリックしてください。(英語の場合は File:Compare Active File With... をクリックしてください)。 アクティブにな

はじめに 皆さんVisual Studio Code(以下VSCode)使ってますか？ 私はメインで使っているのですが、自分なりにしっくりくる設定や拡張機能がある程度揃ってきたので公開しちゃいます。 おすすめ設定だけではなく、おすすめの機能もできる限り紹介したいと思いますので、最後までぜひお付き合いください。 ※プログラミング言語固有の設定の解説は軽めですのでご了承ください。 GIF画像が小さい場合は、クリックして頂けると拡大して表示が可能です デフォルト機能編 Local History機能 Gitは非常に便利なので、皆さん使われていると思います。 Gitはコミット単位で履歴が管理できますが、保存単位で履歴が見れると嬉しいな、保存単位で復元できると嬉しいな、と思うことはないでしょうか。 私はVSCodeは自動保存をオフにして、手動で保存するので、保存単位で履歴が見れると嬉しいなと思うこと

目次の作成 拡張機能Markdown All in Oneの目玉機能といってもいいのが、この目次の作成です。 すでに存在している文書の見出しを自動で抽出して、目次を作成することができます。すごいです。 まず、Windowsなら Ctrl + Shift + P または F1 、Macなら ⇧⌘P または F1 でコマンドパレットを開きます。 表示された入力欄に「markdown all」などと入力されると、コマンドの候補がしぼられてきますので、中から「Markdown All in One: Create Table of Contents」を選択します。 すると、以下のように、見出しを自動的に抽出して、目次が自動で作成されます。 便利ですね～ 特定の見出しを目次に入れない 「はじめに」などは、目次の前にありますから、見出しにはしたいけれども目次には入れたくない…ということがあるかも知れま

はじめに 前回に引き続き、第二弾のVSCodeのMarkdown環境を整えていきたいと思います。 今回は使用頻度も高い画像貼り付けについて説明していきたいと思います。 目次 はじめに 目次 環境 改善したい項目一覧 やりたいこと 拡張機能：Paste Image インストール 使い方 設定 pasteImage.defaultName pasteImage.path おわりに 環境 VSCode 1.48.2 Paste Image v1.0.4 改善したい項目一覧 改善したい点は以下になります。 アウトライン機能　←　済？ 画像ファイルの貼り付け　←　今回はここが対象 リアルタイムプレビュー ショートカット機能 Lint機能（Typoraにはない機能） CSS拡張 やりたいこと Typoraと同様にクリップボードにコピーした画像をマークダウンに貼り付けたい。そして、画像自体も任意の場所に

初めまして，buchioです。 Zenn初投稿なのですが，Markdownでサクサク書けるのは最高ですね． 画像もスクショでクリップボードにある画像がそのままペーストできるのが素晴らしいです． ただ，README.mdだったり論文をまとめるときはVS Codeで編集をします．VScodeで画像を挿入する場合 と書きますが，わざわざディレクトリを用意して画像を入れて，pathを書いて，と結構面倒です． スクショ画像をそのままペーストできないかなと思い，方法を探してみるとちょうどよい拡張機能があったので，その使い方とおすすめの設定を紹介します． Paste Image 使い方はいたって単純で， 使いたい画像をスクショ(Windows:Win+shift+s, Mac: Cmd+Shift+5) 張りたい場所にCtrl+Alt+V (MacならCmd+alt+V) 設定したフォルダに画像が保存さ

テキストエディタのAtomだと「atom」というコマンドがターミナルで使えて、ターミナルからAtomでファイルを開くけたました。 Visual Studio Codeでも使いたいと思い、調べてみると機能としてはデフォルトでありますが、設定が必要だったので設定方法について書いておきます。 設定方法Visual Studio Codeの場合は「code」コマンドなのですが、まずはcodeコマンドをインストールする必要があります。 普通にVisual Studio Codeを起動して、command + shift + Pでコマンドパレットを開き、「shell command install」で検索します。 「シェルコマンド: PATH内に ‘code’ コマンドをインストールします」と表示されるので選択します。 右下に「シェルコマンド ‘code’ がPATHに正常にインストールされました。」

「Visual Studio Code」（VSCode）はMicrosoftが開発している高機能コードエディターです。今回は、プログラミング以外の作業や業務も助けてくれる拡張機能を紹介します（表5）。VSCodeはコードエディターですが、できることは幅広いので、開発以外の業務にも活用してみてはいかがでしょうか。

このブラウザ バージョンのサポートは終了しました。サポートされているブラウザにアップグレードしてください。

できるだけ以下のSPA版を御覧ください、SlidevのツールバーやYouTubeやGIFアニメーションを見ていただけます。 https://loftkun-slidev-vscode-conference-japan-2021.netlify.app/ 2021/10/20 VS Code Co…

ubuntu20.04にVScodeのインストール手順です。ここでは、「.deb」ファイルをダウンロードして、インストールしてます。snapだと日本語が入力できないようです。 環境 ・OS ubuntu 20.04 VScodeインストール こちらのサイトから「.deb」をインストールします。 自分がダウンロードしたバージョンは「code_1.50.1-1602600906_amd64.deb」でしたが、これをaptコマンドでインストールします。

追記：VS Codeの入門書をZennでリリースしました ブログで扱ったVS Code関連の記事をまとめて、無料の電子書籍としてZennというプラットフォームでリリースしました。本記事の内容も含めてまとめてあります。よろしければ、こちらも参考にしてみてください。 VS CodeのRemote Development拡張 VS Codeでラズパイ上のファイルやクラウド（GCP等）上のファイルを編集したくなるケースが増えてきました。 今まではリモートのファイルにアクセスするときVS CodeのSSH FSという拡張を使ってラズパイ上のファイルをSSH経由で編集していましたが、最近は、Remote Developmentが公式推奨でイケてるらしいので、乗り換えることにしました。 Remote Developmentの概要は以下です。 VS Code Remote Developmentより引用

DA事業本部の横山です。 Visual Studio Codeの拡張機能で、AWS上でのアプリケーションの作成、デバッグ、デプロイを支援してくれるAWS Toolkit for Visual Studio Codeがあります。 存在は知っていましたが実際に利用したことがなかったため、どんなことができるのか確認しまとめたいと思います。 はじめに AWS Toolkit for Visual Studio Codeを利用するには、AWSアカウントの作成、Visual Studio Codeのインストール、AWS Toolkit for Visual Studio Codeのインストールが必要となります。手順については公式ドキュメントのリンクを記載しますので本記事では割愛させていただきます。 AWS Toolkit for Visual Studio Codeのインストール ちなみに、AWSアカ