Here are some super secret VS Code hacks to boost your productivity
By Dylan Tientcheu Coding as a hobbyist, professional or even a once-in-a-month developer, you must know that having smart and sharp tools is vital to anyone willing to put in maximum productive hours while working. I’ve curated a little collection of tips, tricks and extensions, and filtered them to keep only both the most rare and most useful ones to a modern web developer. As we know the JavaSc
Visual Studio Live Shareで始める快適なエンジニア間コミュニケーション - Qiita
Visual Studio Live Shareは、Googleドキュメントのファイル上で共同で執筆するかのようにVSCodeで複数人でコードの編集・デバッグが行える拡張機能です。こんなことができます。 複数人で同時にファイルを編集できる。ファイルの移動、プロジェクト内検索も可能 ホストマシンのローカルサーバーをシェアし、ゲストマシンからブラウザでアクセスすることができる ホストマシンのターミナルをシェアし、ゲストがコマンドを実行することができる VSLiveShareはペアプロをしたい相手に招待リンクを送るだけでサクッと始められる点も素晴らしく、弊社ではペアプロだけでなく様々な用途で使用しています。 今回は、明日からすぐ始められるVSLiveShareの導入方法、弊社での活用方法を紹介しようと思います！ VSLiveShareの導入方法 早速導入していきましょう！VSLiveShareは
開発が捗る Visual Studio Code 拡張機能 - Qiita
拡張機能はできるだけ最小限にしておきたい派です。そんな自分がインストールして使い勝手がよかった拡張機能をいくつか紹介します。 Auto Close Tag https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag その名の通りClose Tagを自動で入力してくれます。単純にタイピングが減るので肉体的・心理的負担の軽減にもなります。 Auto Rename Tag https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag タグを修正した際にClose Tagも合わせて修正してくれます。これも手間が減って便利です。 Bracket Pair Colorizer 2 https://ma
VSCodeのオススメ拡張機能 24選 (とTipsを少し)
1. vscode-icons アイコンがついて見やすくなる。 2. GitLens とにかく強い。 「コミット単位でのファイル比較」や「最新のコミット内容とそのコミッター表示」など色々してくれる。 git blameする手間なくなる。 3. Prettier コードのフォーマットは自動でやりましょう！ 複数人のこだわりをうんたらするよりも、Prettierに委ねるのが楽。 関連のTipsはここ 4. Git History Git logが見やすい 5. Bracket Pair Colorizer カッコの対応を色付きで表示してくれる。 ものすごく読みやすくなって最高&最高！！ なおBeta版ですが、後継となるBracket Pair Colorizer 2も出ています。 6. Settings Sync どこでも同じ設定で使いたい人には便利。 ⇧ + ⌥ + U/D で設定をアップロ
VS Code：Sassファイルを保存と同時にコンパイルしてくれる拡張機能「Easy Sass」 | NxWorld
Sassファイル（SASS/SCSS）をVS Codeでコンパイルできる拡張機能「Easy Sass」を紹介します。 Sassの保存後に自動で指定した場所にCSSファイルが出力させることができ、出力時のフォーマットやコンパイルさせないファイルの指定などもできます。 インストール 拡張機能は「Easy Sass - Visual Studio Marketplace」の「Install」ボタン、またはエディタのメニューにある「拡張機能」からインストールでき、エディタ上でインストールする場合は easy sass と検索すれば該当の拡張機能が出てくると思います。 その後、エディタを再起動させればインストール完了になります。 使い方 使い方といっても特にこれといった手順などはなく、拡張機能の有効化後にSASSまたはSCSSファイルを更新してみると、同じディレクトリ内に圧縮・非圧縮それぞれのCSS
VS Code：WordPress構築時に便利な拡張機能まとめ - NxWorld
絶対に入れておくべきとまではいきませんが、入力補完やドキュメント参照が容易にできるなど慣れると手放せなくなるようなものもいくつかあるので、VS Codeを利用していて普段からWordPressを触る機会が多い人は試してみてください。 WordPress Toolbox WordPressの関数・クラス・定数を入力補完してくれる拡張機能で、現時点の最新版であるVer 4.9.8にも対応しています。 展開時には引数付きで出力してくれる機能もあり、展開したコード内にある引数の選択部分をtabまたはshift + tabで移動させることもできます。 例）add_filter()を引数表示有りで展開 add_filter( $tag:string, $function_to_add:callable, $priority:integer, $accepted_args:integer )
文章作成・メール作成に役立つ！ VS Codeの拡張機能「テキスト校正くん」を公開 - ICS MEDIA
文章の校正チェックを自動で行うVisual Studio Codeの拡張機能「テキスト校正くん」を弊社からリリースしました。無料で利用できます。 テキスト校正くん – Visual Studio Marketplace 短い文章であれば目視でもチェックできますが、長文になるとチェックに時間がかかり見落としも多くなってしまいます。また、いくら内容のいい文章を書いても誤字や脱字が多く体裁が整っていないと、印象が悪く読みづらい文章になってしまいます。 そんなとき、「テキスト校正くん」を利用することで、文章チェックの手間を軽減でき、文章の品質を高めることができます。 ▲VS Codeの拡張機能「テキスト校正くん」 「テキスト校正くん」でできること この拡張機能は、VS CodeでテキストファイルやMarkdownファイル等の日本語の文章をチェックします。編集時に自動で校正のチェックを行い、エディタ
AtomユーザもSublimeユーザも、死角が無いエディタ「VS CODE」に乗り換えよう | WEBA
This domain may be for sale!
VS Codeを使いこなせ! フロントエンジニア必須の拡張機能7選 - ICS MEDIA
「Visual Studio Code（略称：VS Code）」はMicrosoftが提供している無償で高機能なエディターです。標準でも十分な機能は備わっていますが、拡張機能をインストールすることで、より使いやすく自分にあったエディターへとカスタマイズできます。 本記事では、HTMLコーダーやフロントエンドエンジニアに役立つ拡張機能を紹介します。 1. IntelliCode IntelliCodeはMicrosoft謹製の公式プラグイン。AI支援による次世代のコード補完がJavaScriptやTypeScriptで利用できるようになります。APIの一覧がアルファベット順に提示されるのではなく、利用する可能性の高いAPIがAIによって予測されます。 コード補完の様子を次のスクリーションショットでご覧ください。入力候補の「★」マークが付いているところが、補完候補になっているところです。人工知
VS Code で Prettier と Stylelint を連携して CSS/SCSS ファイル保存時にオートフォーマットをかける - Qiita
VS Code で Prettier と Stylelint を連携して CSS/SCSS ファイル保存時にオートフォーマットをかけるCSSscssVSCodestylelintprettier 2018/05/31(Thu) 時点の情報に基づいています 2019/09/10(Wed) 更新しました Prettier と Stylelint を使って npm-scripts や gulp で、任意のコマンド実行時に css/scss ファイルをオートフォーマットするやり方はいろいろと見つけることができたのですが、やっぱりファイル保存時にやりたい！ということで方法を調べてみました。 1. VS Code の設定 まずは VS Code の設定を行います。この設定は一度だけ行えば後はする必要はありません。 1-1. prettier-vscode Extension のインストール VS Co
Riot.js の開発環境を Windows10 で簡単に構築する３つのおすすめツールを紹介
どうも、会社員Shiraです。 最近 Riot.js（ライアット）という、モダンなWeb画面を開発する javascript（ジャバスクリプト） の UIライブラリを勉強しています。 Webのフロント側は、HTML、CSS、Javascriptで作られるものですが、開発の生産性やメンテナンス性を上げるために様々なフレームワークやライブラリが用意されています。 これらフロント側のトレンドは流行、廃りのサイクルがとても速い印象です。折角覚えたフレームワークやライブラリが時代遅れになって無駄に消耗してしまうのではないか？と心配が耐えません。 私はバックエンド側のエンジニア（2年前まではWEB開発も未経験）であるため、フロント側の開発にとても苦手意識があります。 しかし、個人でWEBサービスを作りたいならフロントエンド側の開発は避けて通れません。 学習コストが低く、お手軽でリッチなUIが開発できる
Theme Color
Version 1.90 is now available! Read about the new features and fixes from May. You can customize your active Visual Studio Code color theme with the workbench.colorCustomizations user setting. { "workbench.colorCustomizations": { "activityBar.background": "#00AA00" } } Note: If you want to use an existing color theme, see Color Themes where you'll learn how to set the active color theme through th
設定 | 非公式 - Visual Studio Code Docs
さまざまな設定をによって Visual Studio Code を構成することは簡単です。VS Code のエディター、ユーザー インターフェイス、機能の動作のほぼすべてに、変更可能なオプションが用意されています。 VS Code は設定用に 2 つのスコープを提供します: User - この設定は VS Code に登録され、開いたすべての場所でグローバルに適応されます。Workspace - この設定はワークスペース内に保存され、そのワークスペースを開いたときのみに適応されます。この設定はユーザー設定よりも優先されます。ユーザー、ワークスペースの設定を作成ユーザー、ワークスペースの設定を開くには、次のメニュー コマンドを使用します: Windows/Linux - File > Preferences > SettingsmacOS - Code > Preferences > Set
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Simple Cloud Infrastructure for Developers | DigitalOcean
VS Code Themes
[React Native]VSCodeでPrettierを入れる - Qiita![[React Native]VSCodeでPrettierを入れる - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/cbbeb0e0038f67acef9f7a202ec8df8a89d8707d/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCUmVhY3QlMjBOYXRpdmUlNURWU0NvZGUlRTMlODElQTdQcmV0dGllciVFMyU4MiU5MiVFNSU4NSVBNSVFMyU4MiU4QyVFMyU4MiU4QiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9ZWU0MWYxYjg2ODg4ZjIxZTU5OWNhMmNjYTI4YmRiZTc%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBvemFraTI1JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0zNDE4MzQwMjQ5YWFkZGY3NmVkOTU4NmUxYWYzOTNhYg%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D336a6c56b8b19c4b5dbc51c4f2f616a1)
Visual Studio Code: \n in regex file search not supported?
There is no search history · Issue #5508 · microsoft/vscode
Color theme for VS Code integrated terminal
City Lights — A suite of beautiful matte dark themed goodies
