レスポンシブなWebサイトを開発する際には、様々なデバイスでの表示を一気に確認できると便利です。デバイス毎に画面幅が数多くあるので、それらをまとめて表示確認して調整していくという作業が不可欠です。 今回紹介するResponsively Appはそうした表示をまとめて行えるアプリになります。スクロールやイベントの追従もできます。

Responsively Appの使い方

立ち上げました。iOS系とノートPCでの表示をテストしています。

Webサイトを変えると、全体に反映されます。

表示を横に並べる形にしました。

表示するデバイスを選択します。カスタムサイズも可能です。

表示するデバイスを絞り込めます。

横向きに変更しました。

デバイスを指定して開発者ツールを開けます。

Responsively Appはクリックイベントをすべての表示に対して適用したり、ホットリロードにも対応しています。サイト全体のスクリーンショットも撮影でき、開発を効率化してくれることでしょう。

Responsively AppはElectron/JavaScript製のオープンソース・ソフトウェア（GNU Affero General Public License）です。

Responsively App manojVivek/responsively-app: A modified browser that helps in responsive web development.