Windows での Web 開発

Microsoft では、Web 開発者向けにさまざまなリソースを提供しています。これには、Windows を使用した Web 開発をサポートする新しいツールと機能が含まれます。 このガイドでは、Windows を Web 用の理想的な開発環境にするために使用可能なツールの多くについて説明します。 API の一覧については、Web 開発用の API に関する記事を参照してください。

Windows で開発環境を設定する

WebView、DevTools、PWA

WebView 2
Microsoft Edge WebView2 を使用して、ネイティブ アプリケーションに Web コンテンツ (HTML、CSS、および JavaScript) を埋め込みます。 WebView 2 のダウンロード

Microsoft Edge DevTools
Microsoft Edge 開発者ツールは、Microsoft Edge ブラウザーに直接組み込まれている検査ツールとデバッグ ツールのセットです。 DevTools を開くには、Microsoft Edge を使用して次のようにします。

• 右クリックして検査
• F12 キーを選択
• Ctrl + Shift + i

Windows のプログレッシブ Web アプリ
プログレッシブ Web アプリ (PWA) を使用すると、ユーザーに自分のデバイス用にカスタマイズされたネイティブなアプリのようなエクスペリエンスを提供できます。 これは、サポート プラットフォームでネイティブ アプリのように機能するよう徐々に拡張される Web サイトです。
PWA の概要

Microsoft Edge ブラウザー

開発者向け Microsoft Edge
新しい Microsoft Edge は Chromium に基づいています。これにより、Web 互換性が向上し、基になる Web プラットフォームの断片化が少なくなります。 2020 年 1 月 15 日にリリースされ、Windows、macOS、iOS、および Android でサポートされます。
新しい Microsoft Edge をインストールする

ビジネス向け Microsoft Edge
Microsoft Edge は Chromium に基づいており、エンタープライズ サポートを提供しています。 使用可能な複数のチャネルを構成して展開する方法の手順について説明します。
Microsoft Edge チャネルをダウンロードする

Microsoft Edge Insider
Microsoft Edge では日々新しいものが構築されています。 最新の進行状況と、その使用方法をご覧ください。 Microsoft Edge ベータ版をダウンロードする

Microsoft Edge のサポート
ブラウザーのカスタマイズ、拡張機能の追加、追跡防止、トラブルシューティングなどのためのヘルプが用意されています。 Microsoft Edge に関するヘルプを表示する

デバッグ、テスト、アクセシビリティ

VS Code 用 Microsoft Edge ツール
Visual Studio Code を離れることなく、Microsoft Edge DevTools を使用してインスタンスへの接続、ランタイム HTML 構造の表示、レイアウト、スタイル (CSS) の変更、コンソール メッセージの読み取り、ネットワーク要求の表示を行います。
VS Code 用 Microsoft Edge ツールをインストールする

アクセシビリティのための WebHint
ベスト プラクティスと一般的なエラーについてコードをチェックすることで、サイトのアクセシビリティ、速度、クロスブラウザーの互換性などの向上に役立つカスタマイズ可能なツール。
VS Code 拡張機能をインストールする
ブラウザー拡張機能をインストールする
CLI のインストール

WebDriver
Microsoft WebDriver を使用して Microsoft Edge で web サイトのテストを自動化することにより、開発者サイクルのループを閉じます。
WebDriver をインストールする

Visual Studio コード エディター

VS Code
JavaScript、TypeScript、Node.js、拡張機能のリッチなエコシステム (C++、C#、Java、Python、PHP、Go)、ランタイム (.NET や Unity など) のサポートが組み込まれている軽量のソース コード エディター。
VS Code をインストールする

Visual Studio (IDE)
コンパイラ、IntelliSense コード補完、その他多くの機能が含まれ、コードの編集、デバッグ、ビルドと、アプリの発行を行うことができる統合開発環境。
Visual Studio をインストールする

拡張機能の VS Code Marketplace
Visual Studio Code エディターをカスタマイズするために使用できるさまざまな拡張機能について説明します。
拡張機能をインストールする

拡張機能の Visual Studio Marketplace
Visual Studio 統合開発環境をカスタマイズするために使用できるさまざまな拡張機能について説明します。
拡張機能をインストールする

WSL、ターミナル、パッケージ マネージャー、Docker Desktop

Linux 用 Windows サブシステム
Windows と完全に統合された好みの Linux ディストリビューションを使用します (デュアルブートの必要はもうありません)。
WSL をインストールする

Windows ターミナル
複数のコマンド ライン シェルで動作するようにターミナル環境をカスタマイズします。
ターミナルをインストールする

Windows パッケージ マネージャー
winget.exe クライアントをコマンド ラインで使用して、Windows にアプリをインストールするか、Windows パッケージ マネージャーに独自のパッケージを送信します。
Windows パッケージ マネージャー winget クライアントをインストールする

Docker Desktop for Windows
Visual Studio、VS Code、.NET、Linux 用 Windows サブシステムや様々な Azure サービスのサポートを活用して、リモート開発用コンテナーを作成します。
Docker Desktop for Windows をインストールする

ASP.NET、Typescript、Xamarin

ASP.NET
Web アプリとサービス、モノのインターネット (IoT) アプリ、または .NET と C# を使用したモバイル バックエンドを構築するためのクロスプラットフォーム フレームワーク。 Blazor を使用して、リッチな対話型 Web UI を構築します。 Windows、macOS、Linux でお気に入りの開発ツールをご利用いただけます。 クラウドまたはオンプレミスに展開する。 .NET で実行します。
ASP.NET をインストールする

TypeScript
TypeScript は、言語に型を追加することによって JavaScript を拡張します。 たとえば、JavaScript には、文字列、数値、オブジェクトなどの言語プリミティブが用意されていますが、それらを一貫して割り当てているかどうかはチェックされません。 TypeScript では、これが行われます。
ブラウザーで試すローカルにインストールする

Xamarin
Xamarin を使用すると、.NET のコードとプラットフォームに固有のユーザー インターフェイスを使用して、Android、iOS、および macOS 用のネイティブ アプリを構築できます。 Xamarin.Forms を使用すると、C# または XAML で記述された共有 UI コードを使用してネイティブ アプリを構築できます。
Xamarin をインストールする

オープン ソースのコントリビューション

Microsoft のオープン ソース
数千もの Microsoft エンジニアが、オープン ソースを毎日使用、貢献、リリースしています。 人気のあるプロジェクトには、Visual Studio Code、TypeScript、.NET、ChakraCore などがあります。
参加する

Windows 開発者パフォーマンスの問題のリポジトリ
Windows 用か Windows 上のどちらで開発しているかや、クロスプラットフォームの開発用コンピューターとして使用しているかどうかにかかわらず、問題の原因となっているパフォーマンス上の問題について話します。
パフォーマンスの問題を提出する

ドキュメントに投稿する
Microsoft のドキュメント セットは、オープン ソースで GitHub 上でホストされているものがほとんどです。 問題をファイリングしたり、プル要求を作成したりして投稿します。
方法

Azure を使用したクラウド開発

Azure
既存のアプリをホストし、新しい開発を効率化するための完全なクラウド プラットフォーム。 Azure サービスには、アプリの開発、テスト、デプロイ、管理に必要なすべてのものが統合されています。
Azure アカウントを設定する

Azure Cognitive Services
コグニティブなインテリジェンスを手軽にアプリケーションに組み込むことができる REST API とクライアント ライブラリ SDK が備わったクラウドベースのサービスです。
コグニティブ サービスを試す

Azure について学習
既存のアプリをホストし、新しい開発を効率化するための完全なクラウド プラットフォーム。 Azure サービスには、アプリの開発、テスト、デプロイ、管理に必要なすべてのものが統合されています。
Azure アカウントを設定する

その他のリソース

Windows で開発環境を設定する
Python、NodeJS、C#、C、および C++ の使用、Android アプリのビルド、Windows デスクトップ アプリのビルド、Docker コンテナーのビルド、PowerShell スクリプトの実行などを行うための開発環境のセットアップに関するヘルプを確認できます。
作業開始

Windows 用 React Native + macOS
Windows SDK および macOS 10.13 SDK に対して React Native サポートを有効にします。 JavaScript を使用して、PC、タブレット、2 in 1、Xbox、Mixed Reality デバイスなど、Windows でサポートされているすべてのデバイス用のネイティブ Windows アプリと、macOS デスクトップおよびラップトップ エコシステムをビルドします。
Windows 用 React Native をインストールする
macOS 用 React Native をインストールする

Web 開発に関連する Microsoft Learn コース
Microsoft Learn には、各種の新しいスキルを学ぶことができる無料のオンライン コースが用意されており、ステップバイステップのガイダンスを使用して Microsoft の製品やサービスを見つけることができます。
学習を開始する

Mac と Windows の間での移行

Mac と Windows(または Linux 用 Windows サブシステム)の開発環境間の移行ガイドを参照してください。

• キーボード ショートカット
• トラックパッドのショートカット
• ターミナルとシェルのツール
• アプリとユーティリティ