GitHub Copilot: The agent awakens
When we introduced GitHub Copilot back in 2021, we had a clear goal: to make developers’ lives easier with an AI pair programmer that helps them write better code. The name reflects our belief that artificial intelligence (AI) isn’t replacing the developer. Instead, it’s always on their side. And like any good first officer, Copilot can also fly by itself: for example, when providing pull request
novel-writer
軽快な執筆 novel-writerは小説やエッセイなど、まとまった量の文章をストレスなく扱うために開発した機能拡張です。一行あたりの文字数を設定できる原稿プレビューは原稿用紙のようにも使えますし、新聞のような低い段組の字切りを意識しながら執筆できます。 最新のソフトウエア開発技術を執筆に novel-writerのプラットフォームは、Microsoftのソフトウェア開発環境Visual Studio Code（VS Code）。正規表現複数ファイルの検索置換やGitのバージョン管理などの機能もそのまま使えます。Textlintなどの強力なプラグインと併用することで、文字の用法統一をきめ細やかに行えるようにもなります。 版下のPDF出力 novel-writerは分割したテキストファイルを結合してCSS組版システムのVivliostyleで縦書きのPDFを出力できます。 出力したPDFは同
最強神器「Cursor」の本当に使い方を徹底解説【知らないとヤバいレベルです】
筆者自信、個人開発を長い間やってきた＆toB含め多くの開発に携わってきました。もともと開発速度に自信があり力でねじ伏せるタイプでしたが、それでもこのCursorを使い始めて世界が変わりました。具体的には、よくあるAI驚き屋の「3分でLPが作れた」「24時間AIが自動で」とかではなく、実践的な開発で6~10倍程度のスピードが出せるようになりました。序盤は10倍どころかとんでもない速度で仕上がっていきます。 筆者はAI駆動開発にハマり、1500時間くらいCursorを使い込んできたので、その経験を踏まえて現状をしっかり解説します。 この記事を読むとわかるCursorの持つ可能性 「コードを書く」から「AIがコードを書き、開発者が補助する」すべての機能 基本はProプラン$20で何でもできる 0→1開発から複雑な大規模プロジェクトまで、Composer Agent がマジでやばい ここ数年でGi
VS CodeとAIチャットの往復いらず！ 話題の拡張機能Clineで爆速開発してみよう - Qiita
最近、AIにアンテナの高いエンジニア界隈でClineというツールが話題です。 これは元々Claude Devと呼ばれていた、VS Codeの拡張機能です。 サイドバーで生成AIとチャットしながら開発補助をしてもらえて、自分のリポジトリから必要なファイルを読み込んで理解してくれたり、ターミナルでコマンドを実行して出力を確認してくれたり、さらには必要なコードを書いたりしてくれます。 似たようなツールでCursor（カーソル）も結構前から人気ですが、Clineのいいところは いつものVS Codeに拡張入れるだけでそのまま使える どこまで手動/自動で補助してもらうか、好きな具合にカスタマイズできる 結果、コーディングしながらChatGPTやClaude.aiとエディタを往復する手間が省ける ことが大きなメリットです。私も秒でトリコになりました。 実際に試してみよう！ VS Codeに拡張機能「C
【作業効率3倍UP】VSCodeチートシートの永久保存版 - Qiita
この記事はNuco Advent Calendar 2024の6日目の記事です。 はじめに 皆さんはPCで作業する際に下記のようなダサい操作をしていませんか？ 矢印キーを連打or長押し デスクトップ上をマウスで右往左往 同じテキストを繰り返し入力、削除 etc ... このような働き方は無駄な作業時間が増えるだけでなく側から見てもカッコ悪いですし、仕事ができない人間だと周りから思われてしまいます。 というわけで今回はMac用とWindows用でそれぞれVSCodeのショートカットをまとめました。 本記事のショートカットを全て使いこなして作業効率を3倍に上げましょう！ 実際にショートカットを使用した実践動画がありますのでご参考になればと思います。 弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは
SafariやChrome、Firefox、Xcode、VSCode、Finder、ターミナルなどアプリのタブをリスト表示＆横断検索できるMacアプリ「TabTab」がリリース。
SafariやChrome、Firefox、Xcode、VSCode、Finder、ターミナルなどアプリのタブを表示/横断検索できるMacアプリ「TabTab」がリリースされています。詳細は以下から。 SafariやChrome、Firefoxなどのブラウザはもちろん、現在ではFinderやXcode、ターミナルなど多くのアプリがタブ機能をサポートしており、表示したいタブの管理が難しくなっていますが、その様な際にタブを横断検索できるMacアプリ「TabTab」が新たにリリースされています。 TabTab helps you stay productive by making it easy to manage windows and tabs across all your Mac apps. It’s fast, intuitive, and runs entirely on your
これは便利なVS Codeの機能拡張！ CSSのclamp()関数を使ったレスポンシブ対応のフォントサイズが簡単にできる -Clamp It!
CSSの実装に便利なVS Code用の機能拡張がリリースされました！ レスポンシブ対応のフォントサイズをCSSで定義するときに、面倒なclamp()関数の定義を簡単にできるClamp It!を紹介します。 Clamp It! -GitHub Clamp It! -Visual Studio Marketplace レスポンシブ対応のフォントサイズをCSSのclamp()関数で定義 Clamp It!の使い方 Clamp It!のインストール レスポンシブ対応のフォントサイズをCSSのclamp()関数で定義 レスポンシブ用のフォントサイズを設定するには、CSSのclamp()関数が便利です。たとえば、ルート要素が16pxで、スクリーンのサイズごとにフォントサイズを変えるとします。 480pxのスクリーン: 1.rem 16.8px 800pxのスクリーン: 1.25rem 20px 100
AI-powered chat conversations with GitHub Copilot
Using Copilot Chat in VS Code With the GitHub Copilot Chat extension in Visual Studio Code, you can have AI-powered chat conversations to generate code, increase your code understanding, and even configure your editor. Instead of searching for answers in documentation or online forums, you can ask Copilot Chat directly in VS Code, and get code suggestions while you're in the flow of coding. Copilo
VSCodeのGitHub Copilotが色々便利になっていた件
はじめに 知らない間にGitHub Copilotが結構進化していたので、それらの内容を紹介します。 GitHub Copilot Chatは知っていたのですが、単なるChatGPTみたいな会話機能を追加しただけだと思っていました。 要約 右クリックメニューや#fileのようなコマンドが登場し、それを入力するだけでChatに見てほしいコンテキストを伝えることができるようになった。 ファイル単位だけでなく、選択した行やブロックに限定することもできる。 テストコードや新しいプロジェクトをコマンド一つで生成できるようになっている。 推薦の候補も複数を同時に比較できるようになった。 一度に最大10個くらい出る上、タブで保管できる。 ターミナルや編集中のファイルからコマンド一つでChatを立ち上げることができる。 特別なプロンプトを入力しなくても、開いた場所の文脈を読み取ってくれる。 右クリックメニ
VisualStudioCodeで絶対にしておくべき設定ベスト20
Visual Studio Codeで絶対にしておくべき設定ベスト20 はじめに Visual Studio Code（VSCode）は、開発者にとって非常に人気のあるエディタであり、その柔軟性と拡張性から多くのプログラミング言語やフレームワークに対応しています。VSCodeを最大限に活用するためには、適切な設定を行うことが重要です。本記事では、VSCodeで絶対にしておくべき設定ベスト20を紹介し、それぞれの設定がどのように開発体験を向上させるかを詳しく解説します。 1. テーマの選択 1.1 ダークテーマとライトテーマ VSCodeでは、ダークテーマとライトテーマの両方が利用可能です。開発環境の明るさや好みに応じてテーマを選択することで、目の疲れを軽減し、作業効率を向上させることができます。特に、長時間のコーディング作業を行う場合、適切なテーマ設定は重要です。 1.2 テーマの変更方法
【index.ts】そのVSCodeタブ名、わかりづらくない？【page.tsx】
はじめに VSCodeで、index.tsやpage.tsxなど、同名のファイルを複数同時に開いてしまい、わからなくなってしまったことはありませんか？ 実はよく見ると同一名称のファイルを開いているときには右側にディレクトリ名も表示されているのですが、薄い文字かつ、目線移動が必要で分かりづらいです。 この記事では、VSCodeの設定を変更することで、タブ表示名にディレクトリ名を含めて表示する方法を紹介します。 設定方法 VSCodeの設定ファイルsettings.jsonに以下の設定を追加します。 "workbench.editor.customLabels.patterns": { "**/index.*": "${dirname} .../${dirname(1)}", "**/{page,layout,template,route,actions,hooks,components,ut
Web制作者はダウンロードしておきたい！ CSS関連の最新版チートシートのまとめ
CSS GridやFlexboxで配置するプロパティ値は？ 先頭の3つだけを指定するセレクタは？ という「あれは何だっけ？」に役立つのが、チートシートです。 CSS GridやFlexboxの各プロパティ・値でどのように配置されるのか、セレクタやnth-child()やdisplayやposition、VS CodeやGitのコマンドがまとめられたチートシートを紹介します。 チートシートは高解像度版が用意されており、ダウンロードしておくと便利です。 CheatSheets -GitHub チートシートはすべて、「ご自由にダウンロードしてご利用してください」とのことです。チートシートは高解像度版を無料でダウンロードでき、モニターの壁紙や印刷して机の脇に貼っておいても便利です。 では、どんなチートシートがあるのか紹介します。 まずは、CSS Flexboxのチートシート。Flexboxの各プロ
VS Codeでマークダウンを快適に書きたい！ オススメの拡張機能と設定6選 - ICS MEDIA
ブログの文章やドキュメント作成など、さまざまなシーンで使われる記法に「マークダウン記法」があります。文字修飾の簡単さや読みやすさから使うタイミングは多々あると思いますが、みなさんは快適にマークダウンを書けていますか？ 筆者はVS Codeでドキュメントをマークダウンで書くことが多く、表の作成・編集やプレビュー表示など、めんどくさい・見づらい・使いづらいと思うことがあります。どうにか快適に書けないかと思いさまざまな拡張機能や設定を試しながら業務を行ってきました。 この記事では、筆者が試した拡張機能やVS Codeの設定の中で便利だったものを紹介します。①から⑥まではすべて無料で利用できるので気軽に試してみてください！ ①マークダウンの表をエクセルからコピペできる拡張機能 VS Codeでの表の作成に重宝しているのが「Excel to Markdown table」という拡張機能です。エクセル
Prettierを使わない理由
この記事はPrettierを使用している人を非難したり、脱Prettierを推奨する事を目的としていません。 こういった考え方もあるということをひとつの意見としてご覧いただければ幸いです。 勘違いしている人が多そうなので追記します。 Prettierを使わないというのは私が独断で決めた事ではないです。 チームが発足する際の技術選定で合意は取れていますし、私が関与していない別のチームでも同様にPrettier無しで開発しています。 私達のチームはメンバー同士を互いに信頼していますし、細いスタイルで喧嘩を始めるようなメンバーは居ないので安心してください。 はじめに Prettierはコードフォーマッターとして広く使われているツールです。 コードスタイルに関する議論をなくすことを目的としており、ESLintとは異なりデフォルト設定のままですぐに使えるのが特徴です。 さらに、PrettierはJS
なぜコーディングにVSCodeを使うのか。 私がVSCodeを選んだ理由
この記事について この記事は、スマートフォン時代のWebデザインスクール や Web制作の基礎から学べる「Webコーディングスクール」 の資料制作をお手伝いして頂いているemiさんによる寄稿記事です。 コーディングを始めたい、コーディングにVSCodeというものを使うということはわかってるけど、なぜこれを使うんだろう。VSCodeの何が便利なんだろう。と思っている初心者の方に特に読んでほしいと思い書いています。 VSCodeを使うようになったきっかけ コードエディタ難民だった自分がいくつか試したのちに、Adobeが開発していたコードエディタBracketsに出会いました。拡張機能も追加しやすくてテーマも選べるし、使いやすい。とBracketsで落ち着いていたのですが、ある時「サポート終了になる」ということを知りエディタは何を使おうか…となり、その当時使い始める人が少しずつ増えていたVSCo
VS Codeの新機能がすごく便利！ ツリービューのスティッキースクロール機能をオンにすると格段に使いやすくなります
先日アップデートされた、VS Code v1.86で、スティッキースクロールがツリービューでも使用できるようになったので、紹介します。 エディタのスティッキースクロール（紹介記事）ができるようになった時もその便利さに喜びましたが、ツリービューでもできるようになり、深い階層でもすべての親を常に表示しておくことができます。 ツリービューのスティッキースクロールを使用するには、デフォルトではオフになっているので、機能をオンにする必要があります。 ※オンになっている人もいるようですね。
Visual Studio Codeに入れるべき拡張機能【2023年最新版】 - Qiita
拡張機能 VSCodeは世界中で支持されているコードエディタですが、最大の魅力が「拡張機能」です。 機能を追加して、より自分が使いやすいコードエディタにすることができます。 拡張機能のインストール 拡張機能のインストールのやり方を説明します。 アクティビティバーの拡張機能マークをクリックする（四角が4つあるマークです） インストールしたい拡張機能を検索する 拡張機能を選ぶ インストールをクリックする この4ステップで簡単に拡張機能をインストールできます。 オススメ拡張機能 ここからは、オススメの拡張機能をカテゴリごとに紹介します。 これは絶対入れるべき！基本機能 Japanese Language Pack for Visual Studio Code インストール数：約425万 評価：☆4.5 VSCodeの言語を日本語にしてくれる拡張機能です。VSCodeをインストールした後すぐに入れ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
コーディング支援AI「GitHub Copilot Chat」が無償ユーザーにも開放、新しいホームも／「Visual Studio」や「Visual Studio Code」も対応済み
そこまでやる？ 170万DLの人気「Visual Studio Code」拡張機能に巧緻なマルウェア／「Ethereum」のスマートコントラクト言語「Solidity」の開発が楽になるとの触れ込み【やじうまの杜】
Haystack
