成果物
super-simple-video-speed-controller
プロジェクト概要
動画の再生速度を簡単に調整できるChrome拡張を作ってみました！名前は「Video Pace Master Lite」。YouTubeやAmazon Prime Videoで動作するシンプルな拡張機能です。開発にはGitHub Copilotをフル活用して、効率的かつ楽しく進めました。
Copilotを活用した開発の流れ
開発の初期段階では、Copilotに頼りっぱなしでした（笑）。例えば、D キーと S キーで動画の再生速度を調整するロジックは、Copilotが提案してくれたものをそのまま使いました。トースト通知のデザインや位置調整も、Copilotのサポートでサクッと実現。
動画速度調整機能の実装
動画の再生速度を調整するために、content.js にキーボードイベントリスナーを追加しました。この部分のコードはCopilotが提案してくれたもので、ほぼそのまま採用。さらに、現在の速度をトースト通知で表示する機能も、Copilotの提案を基に実装しました。
Amazon Prime Video対応
Amazon Prime Videoのような動的に生成される動画要素に対応するため、MutationObserver を導入しました。このアイデアもCopilotが提案してくれたもので、シャドウDOM内の動画要素を検出するロジックを簡単に実装できました。
トースト通知の改善
トースト通知の位置変更やタイムアウト設定の調整も、Copilotの提案を活用しました。特に、スクリーンショット撮影時に通知が消えないようにする一時的な変更は、Copilotが迅速に対応してくれました。
Chromeウェブストア対応
Chromeウェブストアのポリシーに準拠するため、manifest.json の権限を最適化しました。Copilotは、<all_urls> を削除して host_permissions を使用する提案をしてくれたため、スムーズに修正を進めることができました。
リリース準備
リリースに向けて、アイコンやスクリーンショットの生成、ZIPファイルの作成手順を整備しました。Copilotは、sips コマンドを使った画像リサイズのスクリプトを提案してくれたため、効率的に作業を進めることができました。
Copilotと開発する楽しさ
今回のプロジェクトを通じて、Copilotと一緒に開発する楽しさを実感しました。コードの提案だけでなく、修正や最適化のアドバイスも的確で、まるでペアプログラミングをしているような感覚でした。特に、反復的な作業や複雑なロジックの実装で大いに助けられました。
まとめ
シンプルで軽量なChrome拡張を作るのは、思った以上に楽しい体験でした！Copilotのおかげで、開発のスピードも上がり、学びも多かったです。これからもCopilotを活用して、いろんなプロジェクトに挑戦していきたいと思います。
この記事はAI（GitHub Copilot）を活用して作成されました。内容の正確性には注意を払っていますが、必要に応じてご自身で確認をお願いします。