そもそもVimのプラグインとはどういったものなのでしょうか。まずはプラグインの意味やプラグインの導入方法について説明しますので、これからプラグイン導入を検討している方は参考にしてください。

*Vimはテキストエディタの1つであり、特にITエンジニアが多く活用しています。*Vimはメモ帳など一般的なエディタとは異なる点があります。それは、マウスではなくコマンドによってエディタ操作を行うことです。

Windowsにはコマンドプロンプト、Macにはターミナルというコマンド入力ツールがインストールされています。これらのツールを使ってVimを操作します。

コマンドを使い慣れていない人にとっては、Vimは不便に感じるかもしれません。しかしコマンドの使い方を覚えてしまえば、マウスではなくキーボードのみで素早く操作ができるため、作業効率を高めることが可能です。

VimがITエンジニアの方に多く活用されているのはこのためでしょう。

【参考】：[welcome home : vim online](https://www.vim.org/)

テキストエディターとは？エンジニア初心者におすすめのエディタも紹介！

**プラグインとは、ソフトウェアに標準装備されていない機能を後から追加できるもののことです。**プラグインを導入することで、よりそのソフトを使いやすくかつ自分好みにすることができます。

Vimは利用者が多いため、有志の方によって多くのプラグインが作られています。VimプラグインはVim scriptというスクリプト言語によって作成され、外部に公開されます。Vimプラグインをインストールして導入することで、Vimをさらに便利に活用できるようになります。

Vimプラグインの多くはGitHubで公開されています。*各GitHubのページにあるREADME.mdなどに、プラグインのインストール方法および使い方が書かれていることが多いです。*

また、多くの人が利用するプラグインの場合、プラグイン名で検索すれば解説サイトが表示されることもあるので、それらも参考に利用すると良いでしょう。

GitHubとは？メリットや使い方、Gitとの違いも徹底解説！

続いて、導入したいVimプラグインを5つ解説します。各プラグインを導入するメリットや、使いどころについてまとめました。Vimを使い始めたばかりの人は、これらのプラグインを導入することでよりVimの利便性が分かるようになるでしょう。

*dein.vimはプラグインを管理するためのプラグインです。*プラグインが増えると管理に手間がかかるため、まずはdein.vimを導入しましょう。dein.vimはtomlファイルを使って管理する仕組みになっており、ファイルを編集することでプラグインのインストール・アンインストールを行うことが可能です。

【参考】：[dein.vim](https://github.com/Shougo/dein.vim)

nerdtreeはサイドバーにディレクトリツリーできるプラグインです。**プログラム作成中に他ファイルを参照したい場合があるでしょう。**その際にディレクトリツリーが表示されていれば、開きたいファイルを選択して簡単に中身を確認することが可能です。

【参考】：[nerdtree](https://github.com/preservim/nerdtree)

unite.vimは、Vim用の統合ユーザインターフェースです。*unite.vimを導入することで、各データを1つのインターフェースで操作でき作業効率を高めることが可能です。*利用頻度も高く、おすすめのプラグインです。

【参考】：[unite.vim](https://github.com/Shougo/unite.vim)

Vimでは:colorschemeコマンドを使うことで、現在設定できるカラースキームを確認することができます。標準でも多くのカラースキームが用意されていますが、プラグインを導入することで他のカラースキームも利用することが可能です。

molokaiは自作カラースキームの中でも人気が高くおすすめです。**ソースコードを綺麗に色分けしてくれるため、バグも見つかりやすくなり開発効率に繋がると言えるでしょう。**

【参考】：[molokai](https://github.com/tomasr/molokai)

Gitは有名なソースコード管理ツールであり多くの企業で使われています。*vim-fugitiveはVimからGit操作を行えるプラグインです。*Vimでソースコードの修正を行いつつGit操作ができるため、前回コミットした分との差分などを確認に確認できます。

案件でGitを利用しているなら使いたいプラグインです。

【参考】：[vim-fugitive](https://github.com/tpope/vim-fugitive)

## 作業効率を高められるプラグイン7選

続いて、作業効率を高められるおすすめのプラグインを7つ紹介します。これらのプラグインを導入することで、プログラミング作業をさらに効率化させることが可能です。生産性を高めるうえでテキストエディタをカスタマイズすることは重要なので、エンジニアの方はぜひ参考にしてください。

インデントを整えることは、ソースコードの可読性を高めるうえで大切です。インデントを正しく整えないとPythonなどの言語ではエラーが発生します。また、初心者のうちは気をつけないとネストが深いコードを書いてしまいがちです。

vim-indent-guidesはインデントを可視化しやすくなるプラグインです。**ソースのどこからどこまでがネストに含まれるのかを把握しやすくなり、インデントも整えやすくなります。**

【参考】：[vim-indent-guides](https://github.com/nathanaelkane/vim-indent-guides)

*fzf.vimはファイルのあいまい検索を行えるプラグインです。*あいまい検索とは「キーワードに完全一致するわけではないものの関連性が高い」ものも対象に加える検索方式のことです。

多くの検索用プラグインの中でもfzf.vimは動作が軽量でおすすめです。

【参考】：[fzf.vim](https://github.com/junegunn/fzf.vim)

previmは、Markdown形式のプレビューを確認できるプラグインです。ブラウザに表示した際に表示が崩れていないかすぐに確認できるため、作業効率を高めることができます。

**さらにprevimは、ファイルを保存するたびに画面を自動更新してくれます。**Markdown形式をよく使う方は導入したいプラグインの1つです。

【参考】：[previm](https://github.com/previm/previm)

*文字列の検索を行う際、正規表現はさまざまなパターンの文字列を一括検索できるため便利です。*しかし正規表現は初心者のうちは扱いが難しいことも多いです。

traces.vimは正規表現の置換結果を確認できるプラグインです。問題なく置換されているか事前に確認できるため、安心して正規表現を使うことができます。

【参考】：[traces.vim](https://github.com/markonm/traces.vim)

**translate.vimはVim上でGoogle翻訳を使えるプラグインです。**Google翻訳は最近精度が良くなったため、英語の資料を読む際に活用している方は多いでしょう。

translate.vimを使えば、翻訳する度にブラウザに画面を移さなくて良くなります。Vim上で翻訳したい範囲を指定し、コマンドを入力するだけで翻訳が可能です。

【参考】：[translate.vim](https://github.com/markonm/traces.vim)

coc.nvimはVimをVisual Studio Codeとして使えるプラグインです。Visual Studio Codeを今まで使っていて、今後Vimの機能やプラグインも活用したい方におすすめです。

【参考】：[coc.nvim](https://github.com/neoclide/coc.nvim)
【参考】：[Visual Studio Code - Code Editing. Redefined](https://code.visualstudio.com/)

Visual Studio 2022の新機能がIDEで歴代最高な理由

Vimで検索を行うと検索に該当した文字列がハイライトされます。しかし、もう1度検索を行うと前の検索結果のハイライトが解除されてしまいます。

*MultipleSearchは前の検索結果のハイライトをそのまま表示してくれるプラグインです。*1度に複数の検索結果を別の色で表示してくれます。

【参考】：[MultipleSearch](https://www.vim.org/scripts/script.php?script_id=479)

## プラグインを導入してVimでの作業を効率化させよう

本記事では、Vimのプラグインについて解説しました。どういったプラグインを導入すべきかお分かりいただけたかと思います。Vimはプラグインの数が多く、特に初心者はどれからインストールすれば良いのか迷う場合が多いです。初心者の方は、冒頭で解説した5つのプラグインをひとまず使うことをおすすめします。

エンジニアにとって作業効率を高め生産性をアップさせることは重要です。**Vimを自分が使いやすいようにカスタマイズして、ソースコードを記述しやすくしたりバグを発見しやすくしたりしましょう。**

コードレビューを初めて行う人必見！やり方を1から解説！

主要なコードレビューツールを紹介！ツールがなぜ必要かについても解説

Vimのプラグインを導入したいものの、数が多くてどれを導入すれば良いのか分からない初心者の方は多いのではないでしょうか。本記事では、Vimプラグインの中でもおすすめのものを12個にまとめました。各プラグインの特徴やメリットについて解説しています。

Vimのプラグインを導入することで、作業効率を高めることができる

Vim初心者の方は、dein.vimやnerdtreeなどのプラグインを導入するのがおすすめ

vim-indent-guidesや fzf.vimなどのプラグインを導入することで、さらに作業スピードを高められる

作業効率が大幅アップ！おすすめVimプラグイン12選！各特徴も解説

**Notionは、仕事で使うドキュメントやタスクの管理、プロジェクトの管理機能を備えたアプリケーションのことです。**このNotionは様々なツールを一元的に扱っているので、Notionを使用していれば他のアプリケーションを使わなくても仕事を効率的に進めることができます。

このように便利な機能をもつNotionですが、その機能の1つとして、グラフを作成する機能も用意されています。Notionでグラフを作成するためには、NotionとNotionChartsという2つのアプリケーションにユーザー登録し、連携させる必要があります。

本記事では、NotionとNostionChartsの連携方法から、グラフの作成方法までを図を使い丁寧に説明していきます。すでにNotionを仕事で使用している人や、グラフの作成ツールをどれにしようか迷っている人は、ぜひ本記事を参考にしてみてください。

Notionとは？基本的な使い方やEvernoteとの違いを解説

## Notionのデータをグラフ化できるのがNotion Charts

Notionのグラフ作成機能は、Notion Chartsと呼ばれています。**Notion Chartsでは9種類のチャートを作成することができます。**

ここからは、そんなNotion Chartsで作成できるグラフの種類や、グラフの作成方法、便利な機能などもあわせて紹介します。

Notionでできること５選！概要や基本操作も分かりやすく解説！

## Notion Chartsの作成できるグラフの種類

先ほどもご紹介した通り、Notion Chartsでは9種類のグラフを作成できます。**ただし、無料で作成できるグラフはNotion Chartsを登録後、5つのみです。**

無制限で使用したい場合には、月額3.99ドルを支払う必要がありますので注意してください。試しに登録して好きなチャートを作成し、使用感などが気に入れば、有料のプランにアップグレードすることをおすすめします。

【参考】：[NotionCharts 公式](https://notioncharts.io/)

*Notion Chartsは基本的なグラフは一通り作ることができます。具体的に作成できるグラフは以下の通りです。*例として、それぞれのグラフを図で記載していますので、参考にして下さい。

~~【図】：レーダーグラフの図~~

~~【図】：ドーナツグラフの図~~

~~【図】：ツリーマップグラフの図~~

【参考】：[Notion Charts 公式](https://notioncharts.io/)

グラフの種類について理解したところで、次に具体的なNotion Chartsの使い方を説明します。**Notion Chartsを使うためには、まずNotionのアカウントと連携する必要があります。**そのため、まだNotionに登録していない人は、まずNotionのユーザー登録をしましょう。

*Notionは公式サイトからユーザー登録ができます。*登録に必要な情報は、メールアドレスや名前です。その他にも簡単なアンケートがありますが、こちらはスキップが可能です。Notionの登録にはそれほど時間がかかりませんので、ぜひこの機会に登録をしてみましょう。

【参考】：[Notion 公式](https://www.notion.so/ja-jp)

*Notionの登録ができたら、次にNotion Chartsの公式サイトへアクセスしましょう。*公式サイトへアクセスすると、「Get started for free」というボタンがありますので、こちらをクリックします。

こちらもメールアドレスで登録ができますので、まずはNotion Chartsの登録をしましょう。次に、画面が切り替わるので、「Connect Notion」を選択し、作成したいチャートのデータを選択します。

~~【図】：NotionとNotion Chartsの連携画面1~~

~~【図】：NotionとNotion Chartsの連携画面2~~

ちなみにこの時、Notionのアプリケーション内に1つもデータが入っていない場合は、それを知らせるポップアップが表示されます。しかし、NotionとNotion Chartsを連携した後でもデータの追加はできますので、心配ありません。

データを登録していない場合は、Notionのページからデータを追加してみましょう。その後、Notion Charts側の画面でデータベースをリフレッシュすると、追加したデータベースを選択できるようになります。

### Notion Chartsでグラフを作成する

*Notion Chartsの登録まで完了したら、早速グラフを作成してみましょう。*手順通りに作業を進めている場合、Notion Chartsの画面が開いていると思います。

ダッシュボード画面、またはユーザー登録直後の画面に「Create Chart」というボタンがあるので、そちらのボタンを押してください。

画面が切り替わり、右側に「Notion Table」が表示されます。Notionに登録したデータの中から、テーブルを選択します。今回は例として、課題ごとの点数をグラフ化していますが、任意のデータを使用して構いません。

データとなるテーブルを選択したら、今度はチャートのタイプを選択します。画面左側に「Chart Type」がありますので、好きなものを選択してください。本記事では縦棒グラフを使用します。

縦軸と横軸の値も、データのテーブルを選択するとプルダウン形式で選ぶことができます。さらに、画面右側でグループ化やソートもできますので、必要に応じて活用してみましょう。

グラフを作成したら、最後にタイトルを付けてみましょう。画面左上に「Chart Title」というエリアがありますので、ここで任意のタイトルを入力することができます。

~~【図】：Notion Chartsのグラフ作成画面~~

### Notion Chartsで完成したグラフを埋め込む

*グラフが完成したら、このグラフをNotionのページに埋め込んだり、URLを他の人と共有したりすることができます。*今回は試しに、Notionにグラフを埋め込んでみましょう。

まず、作成したグラフの左上にある「Copy Embed Url」をクリックします。そうするとグラフのURLをコピーできますので、そのままNotionのページに移動します。

次に新規ページや任意のページに移動し、グラフを張り付けていきます。今回は新規ページにURLをペーストしました。すると、貼り付ける方法が選べますので好きな方法を選択しましょう。ちなみに直接埋め込むと下図の赤枠のように、作成したグラフをそのまま貼り付けることができます。

~~【図】：Notion Chartsで作成したグラフをNotionに埋め込む~~

ここまでの記事を通して、Notion Chartsのグラフの作成方法は、それほど難しくないと理解していただけたかと思います。

**ここからは、Notion Chartsの便利機能や、特徴をいくつかご紹介します。**Notion Chartsを使おうか検討している方は、ぜひ参考にして下さい。

### Notion Chartsのデータは保存されない

*Notionのデータは、グラフをレンダリングする時のみ使用されますが、その後データは保存されません。*そのため、データのプライバシーを心配されている方も、比較的安心して使えるでしょう。

### Notion Chartsはデータを更新するとグラフも更新する

*Notion Chartsの利点として、テーブルデータを更新すると、チャートも更新されるというメリットがあります。*そのため、データが書き換わる度にチャートを作成し直す必要はありません。

仕事でチャートを作成することが多い方は、業務の効率化も目指せます。

### Notion Chartsのグラフはダークモードも選択可能

*Notion Chartsのグラフは、明るい色のテーマと暗い色のテーマの2種類が用意されています。*そのため、グラフを貼り付ける先のページや、好みに合わせてグラフの色を変えることができます。

ちなみにデフォルトでは明るい色のテーマが適用されています。暗い色のテーマを適用してグラフを作成したい場合は、グラフ作成画面の上部に「ダークモード」の表示がありますのでそちらをクリックして下さい。

~~【図】：明るい色から暗い色のテーマへの変更例~~

Notionは、プロジェクト管理を始めとしたツールが用意されたアプリケーションです。このNotionでグラフを作成するには、Notion Chartsが必要です。本記事では、NotionとNotion Chartsの連携方法や、グラフの作成方法を紹介します。

Notionでグラフを作るにはNotion Chartsとの連携が必要です

Notion Chartsでは9種類のグラフを作ることができます

Notion Chartsにはデータを更新すると、グラフも更新されるといった便利な機能があります

Notionでグラフを作成！「Notion charts」を使って無料で作る方法

生成AIが脚光を浴びており、自然言語処理が多方面で活用されています。**言語処理はプログラミングにも活用できるため、AIによるコーディング支援機能がいくつか発表されています。**ここでは、ソフトウェア開発環境を提供するメジャーなAIコーディング支援機能のリリース状況を整理し、解説していきます。

自然言語処理とは？注目される理由やできることをわかりやすく解説

### AIによるコーディング支援のメリット

従来からコーディングの自動化の取り組みが行われています。AIによるコーディング支援は、その取り組みを一気に加速させるものです。具体的には、開発工数の低減、開発期間の短縮、開発品質の向上に効果があります。また、自身が知らないプログラミング言語にも対応できるメリットもあります。

*分かりやすく言うとAIコーディング支援は、大変な開発の労力を減らして俊敏なビジネス利用を手助けする、アシスタントのような役割を担ってくれると考えると良いでしょう。*

### AIによるコーディング支援のデメリット

AIによるコーディング支援のデメリットは、ないわけではありません。具体的には、生成AIの種類によっては想定した動作を行わない架空のコードを生成する恐れもあります。同様に多くのコードから学習したコードでは、場合によってはコードライセンスに抵触するリスクもあります。

その他、作成したコードが要件定義に合致しているかはやはり人手での確認が求められます。場合によっては、コードデザイナーやプログラマーの評価に影響を及ぼす場合もありますので、デバッグやコード品質も厳密に行う必要も出てきます。

*このようなリスクを低減するためには、コードのチェックなどのスキルを持つエンジニアが行い、AIに丸投げせずに補助的に活用することも方法の1つです。*

## 代表的なAIコーディング支援ツール

プログラム開発環境は多くありますが、ここではAIコーディング支援機能を搭載する開発ツールやサイトを紹介していきます。*特にソフトウェアデベロッパーが良く活用する開発環境を中心に紹介し、動向を交えて解説していきます。*

*GitHub Copilotは、コード生成のモデルであるOpenAIのCodexをベースに開発された開発支援ツールです。*2021年には、GPT-3ベースのコード生成に対応しており、統合開発環境（IDE）でのコード補完機能の提供を開始しています。

2023年3月には、「GitHub Copilot X」を発表し、GPT-4をプログラミング用に採用することを公表しています。チャット形式でプログラムコードを生成することができます。「GitHub Copilot X」は、テクニカルプレビューとして提供が開始され、料金体系についてはまだ発表されていません。

【参考】：[GitHub ブログ GitHub Copilot X：AIを搭載した開発者体験](https://github.blog/jp/2023-03-23-github-copilot-x-the-ai-powered-developer-experience/)
【参考】：[GitHub Copilot](https://github.com/features/copilot)
【参考】：[GitHub Copilot X](https://github.com/features/preview/copilot-x)

AIペアプログラマー「GitHub Copilot」の使い方や導入メリットを徹底解説！

*Visual Studio IntelliCodeは、Visual StudioとVisual Studio Code（VSCode）で利用できるAIコード入力補完機能です。*補完する仕組みは、実装されているIntelliSenseを用います。「GitHub」の公開リポジトリを機械学習でトレーニングし、リコメンデーションは質の高いコード作成を支援します。

Visual Studioは統合開発環境（IDE）、VSCodeはコードエディタとして非常に人気があります。その環境でAIコーディング支援が実装されるため、試してみる機会が増えるでしょう。

【参考】：[Visual Studio IntelliCode](https://visualstudio.microsoft.com/ja/services/intellicode/)
【参考】：[Visual Studio IntelliCode の概要](https://learn.microsoft.com/ja-jp/visualstudio/intellicode/overview)
【参考】：[Visual Studio での IntelliSense](https://learn.microsoft.com/ja-jp/visualstudio/ide/using-intellisense?view=vs-2022)

IDEとは？詳細やメリット、おすすめのIDEを紹介します！

*Amazon CodeWhispererは、この4月から一般提供を開始したサービスで「AIコーディングコンパニオン」と呼ばれています。*従来はプレビュー版として限定公開していましたが、生成AIの進歩と活用方法を検討し、AWS利用者に一般提供を開始しました。

PythonやJava・JavaScript・TypeScript・C#など、15の言語に対応します。

VS CodeやIntelliJ IDEA・AWS Cloud9などから利用できるほか、AWS Toolkit IDE extensionsから多くのIDEに対応することができます。Lambdaコンソールからも利用可能です。同社は、Amazonのコードについても十分に学習しているため、Amazon EC2やAWS Lambda・Amazon S3などのコード生成が最も正確だとしています。

【参考】：[Amazon CodeWhisperer](https://aws.amazon.com/jp/codewhisperer/)
【参考】：[AWS Machine Learning Blog: Announcing New Tools for Building with Generative AI on AWS](https://aws.amazon.com/jp/blogs/machine-learning/announcing-new-tools-for-building-with-generative-ai-on-aws/)

Pythonのよく使うライブラリ一覧！一段上の開発を目指そう

JavaScriptとJavaの違いは？質問されたときの説明方法

TypeScript入門編として利用する際に覚えておくポイント

*2023年5月17日、Google Colaboratory（Google Colab）にAIコーディング支援機能の搭載が発表されました。*先日開催された「Google I/O 2023」で発表された、PaLM2をベースとするCodeyが用いられます。

CodeyはGoogle Colab向けにチューニングされており、得意とするPythonのコード補完やコード生成に役立てられます。AIコーディング支援機能は統合されており、チャットボットに相談しながら進めることも可能です。Pythonと機械学習は相性が良く、Google Colabはインターネットから誰でも無償で利用することができます。

機能のロールアウトは、今後数ヶ月の間に徐々に展開され米国から他の地域へ拡大を予定しています。

【参考】：[Colaboratory へようこそ](https://colab.research.google.com/?hl=ja)
【参考】：[Google DEVELOPERS: AI-powered coding, free of charge with Colab](https://blog.google/technology/developers/google-colab-ai-coding-features/)


## AIチャットシステムからコードを生成する

*生成AIをベースとするAIチャットシステムにおいても、コード生成の機能が備わっています。*ここでは、AIチャットシステムやAIベースの検索エンジンを活用して、コーディング支援機能を解説していきます。

*Microsoftの「新しいBing」は、Open AIのGPT-4を検索エンジンに採用したAIベースの検索システムです。*チャット エクスペリエンスが追加された検索が可能です。質問カテゴリーに掲載されている通り、コーディング支援にも対応します。

【参考】：[新しいBing](https://www.bing.com/new?scdexwlcs=1&setlang=ja)
【参考】：[新しいBing よくあるご質問](https://www.bing.com/new#faq)

新しいBingのリリース！AIを活用した検索サービスの登場

OpenAIのChatGPTは、2023年に入りAIチャットシステムとしてニュースや話題になっています。*特に2023年3月にGPT-4が発表されると、その自然な言語応対や認識・生成能力に注目が集まっています。*従来のGPT-3.5はどなたでも無料で利用できます。

GPT-4はChatGPT Plusという有料のサブスクリプションに登録するか、Microsoftの新しいBingを使用するなどで利用することができます。

【参考】：[OpenAI ChatGPT](https://openai.com/blog/chatgpt)
【参考】：[OpenAI Introducing ChatGPT Plus](https://openai.com/blog/chatgpt-plus)

OpenAIのGPT-4とは？ChatGPTの進化版について解説！

*GoogleのBardは、2023年3月に試験運用を開始した会話型AIシステムです。*5月には大規模言語モデルを従来のLaMDA・PaLMからPaLM2へと更新し、機能と性能向上により5月からは日本語に対応しています。

BardのFAQを見ると、コーディング支援に活用できることが明らかにされています。試験運用中のため、ある程度自己責任が求められます。コードを引用している場合やライセンス条項については、Bardから提供されることがあります。

【参考】：[Google Bard](https://bard.google.com/)
【参考】：[Google Bard に関するよくある質問](https://bard.google.com/faq)
【参考】：[Google Japan Blog: PaLM 2 のご紹介](https://japan.googleblog.com/2023/05/palm-2.html)

## AIコーディング支援は初心者にも役立ちます

AIコーディング支援では、開発の工数削減や期間短縮、品質向上に役立てられるために、評価段階から実際の利用段階に移りつつあると考えられます。コードの自動生成は簡単なものから複雑なものまで様々な用途で活用できます。

**初心者においても、学習用コードの生成やコードレビューを依頼することも可能ですので、学習ツールの活用の幅も広がるでしょう。**

コーディング規約とは？メリットやデメリット定めるべき内容を紹介

生成AIの登場は、急速に利用範囲を拡大しています。ソフトウェア開発においてもコーディング支援機能がAIによってもたらされています。ここでは、AIによるコーディング支援の概要からメリット・デメリット、そして実際の開発ツールまで解説していきます。

生成AIの自然言語処理はプログラミングにも活用でき、開発ツールに続々と実装されています

メリットは開発労力を低減し、ビジネスの創出や活用を手助けすることです

デメリットもありますが、成果物のヒューマンチェックなどでリスク低減することもできます

AIによるコーディング支援とは？概要とともに実際の開発ツールを紹介

## 「Microsoft Playwright Testing」を発表

*マイクロソフト社は2023年8月22日、新サービス「Microsoft Playwright Testing」を発表しました。*本サービスは、Microsoft Azureから「Playwright」を用いて、ウェブアプリケーションのエンドツーエンドのテストと自動化を可能にします。

異なるオペレーティングシステムとブラウザの組み合わせに対しても、クラウドリソースの活用により高い並列度でテストを進めることができます。

【参考】：[Microsoft Apps on Azure Blog: Introducing Microsoft Playwright Testing service private preview](https://techcommunity.microsoft.com/t5/apps-on-azure-blog/introducing-microsoft-playwright-testing-service-private-preview/ba-p/3905705)
【参考】：[Microsoft Aure](https://azure.microsoft.com/ja-jp)

*Microsoft Azureとは、マイクロソフト社が提供するクラウドコンピューティングサービスを指します。*コンピューティングやコンテナサービス、AIなどをハイブリッドクラウドやマルチクラウド環境で実現します。

同社はソフトウェア開発環境の整備にも力をいれており、今回の「Microsoft Playwright Testing」は、ウェブアプリのテスト自動化と高品質化、デリバリーの迅速化が期待できます。

【参考】：[Microsoft Azure](https://azure.microsoft.com/ja-jp)

Azure入門｜学習前に知っておきたい！無料枠のフル活用メソッド

### 「Microsoft Playwright Testing」を利用するには

「Microsoft Playwright Testing」は、Microsoft Azureが「Playwright」を用いたテスト環境をマネージドサービスとして提供するものです。*本サービスは、プライベートプレビュー版として提供され、利用するにはウェイティングリストへの登録が必要です。*

【参考】：[Join the waitlist for Microsoft Playwright Testing private preview](https://aka.ms/mpt/signup)

## 「Microsoft Playwright Testing」の発表内容と特徴

*今回の発表は、同社が中心となって開発したテストフレームワークである「Playwright」を、クラウドコンピューティングサービスのMicrosoft Aureからマネージドサービスとして提供するというものです。*

ここからは、「Microsoft Playwright Testing」の具体的な特徴を解説していきます。

【参考】：[Microsoft Apps on Azure Blog: Introducing Microsoft Playwright Testing service private preview](https://techcommunity.microsoft.com/t5/apps-on-azure-blog/introducing-microsoft-playwright-testing-service-private-preview/ba-p/3905705)

### テストスイートの実行時間を短縮

本サービスでは、ウェブアプリのエンドツーエンドのテストを自動化することができます。さまざまなオペレーティングシステムとブラウザが、期待通りに動作するか確認できます。

*アプリが複雑化するとテスト工程に時間を要しますが、「Microsoft Playwright Testing」では、テストを多数の並列ブラウザに分散させ、テストスイート完了までの時間を短縮します。 *

### 複数のオペレーティングシステムとブラウザの組み合わせをサポート

複雑なアプリに加えて、さまざまなブラウザ、オペレーティングシステム、デバイスの組み合わせを簡単にテストすることが可能です。これらの組み合わせを個別に調査するには、ITインフラの準備やテスト期間の長期化が予想されます。

*本サービスでは、クラウドのサービス選択やスケールの柔軟性を活用し、PCブラウザやモバイルブラウザのエミュレーションにより、テストを並行実行し、膨大なテスト範囲を短期間でカバーすることができます。*

### テストコードの変更が不要 

*本サービスでは、「Playwright」テストスイートとシームレスに統合されており、「Playwright」のテストコードを変更する必要はありません。*数ステップの操作で、「Playwright」と「Microsoft Playwright Testing」が接続され、連携して並列テストを実行します。

複数のバージョンの「Playwright」をサポートしており、新しいバージョンがリリースされるたびに更新されます。これまでのように、テスト用インフラの管理の複雑さを気にせずに、アプリケーションテストに集中することができます。

ここでは、「Microsoft Playwright Testing」に用いられるPlaywright自体について、解説していきます。

Playwrightは、マイクロソフトを中心に開発したウェブアプリのテストと自動化のフレームワークです。単一のAPIで、ChromiumやFirefox、WebKitのテストが可能です。*Playwrightは、クロスブラウザウェブの自動化を可能にするために設計されており、機能と信頼性を高め、高速に実行します。*

【参考】：[Playwright](https://playwright.dev/)
【参考】：[GitHub: Microsoft Playwright](https://github.com/microsoft/playwright)

WebKitとは？HTMLレンダリングエンジンの役割や特徴を解説！

Playwrightは、ウェブアプリのテストの項目を網羅し、自動化を推進するフレームワークです。*豊富な機能を持ち、クロスブラウザ、クロスプラットフォームのテスト環境を実現します。*代表的な特徴は、次の通りです。

・*抜け漏れのないテストを実現*
アクション実行において、要素がアクション可能になるのを待ったりイベントを活用したりする仕組みを提供します。ウェブの動的な動作をテストするためには、アサーションを利用できます。実行時には、トレース、ビデオ、スクリーンショットなどで抜け漏れを防止します。

実現のために、Codegen、Playwright inspector、Trace Viewerなど、豊富なツールを提供します。パワフルなツールにより、非同期で高速なテスト処理をもたらします。

・*トレードオフや制限からの開放*
ブラウザは、さまざまなOrigin（オリジン）のウェブコンテンツを異なるプロセスで実行します。Playwrightは、最新のブラウザのアーキテクチャに対応し、テストをプロセス制限を受けずに実行することができます。

具体的には、フレームのテストあるいはシャドウ DOMの動作などのテストや、複数のタブやオリジン、ユーザにまたがるシナリオを、ユーザごとに異なるコンテキストでシナリオを作成し、実行することができます。

*Playwrightでは、ChromiumをベースとするGoogle Chromeや、Edge・Opera、WebKitを用いるSafariやiOS向けブラウザ、Firefox など、最新のレンダリングエンジンをすべてサポートしています。*

プラットフォームは、Windows、Linux、macOS、GUIを持たないヘッドレスや組込みシステムなどで動作し、アクセスAPIは、TypeScriptやJavaScript、Python・.NET・Javaから利用することができます。

Google Chrome for AndroidとMobile Safariのネイティブなモバイルエミュレーションに対応し、クラウド環境でもサポートされます。

【参考】：[Playwright Getting Started](https://playwright.dev/docs/intro)
【参考】：[GitHub: Microsoft Playwright](https://github.com/microsoft/playwright)

ツールの記事（7ページ目）