00:07
今日はブラウザ拡張機能の学習を始めたお話をしたいと思います。 ブラウザ拡張機能とは、ブラウザに新しい機能を追加する仕組みのことです。
例えばウェブサイトの見た目を変更したり、定型作業を自動化したりと、アイデア次第で様々なことができます。
私は現在Vivaldiブラウザを使って学習を進めていますが、 基本的にはGoogle ChromeなどのChromium系ブラウザでも同じように動きます。
今回作ったのはとてもシンプルな拡張機能です。 ブラウザのアイコンをクリックすると、「こんにちは」というメッセージが表示されるだけのものです。
使ったファイルはたった2つ。 1つ目がManifest.json。これは拡張機能の設定ファイルです。
ブラウザに対してこの拡張機能は何をするものなのかを伝える役割があります。 2つ目がPopup.html。
こちらは実際に表示する画面です。 アイコンをクリックしたときに表示する内容をhtmlで作成します。
今回は、「こんにちは」と、「Popupが開きました」という文字を表示するだけの簡単な内容にしました。
作成したファイルをフォルダにまとめてブラウザの拡張機能管理画面から読み込むと、すぐに動作確認ができます。
アイコンをクリックするとPopupが表示され、もう一度クリックすると閉じる。
たったそれだけですが、自分で作ったものが実際にブラウザ上で動くと結構嬉しいものです。
プログラミング学習では、いきなり大きなものを作るということを挫折しがちです。
まずは小さくても動くものを作る。そして少しずつ機能を追加していく。
この積み重ねが大切だと改めて感じました。
ここはこの拡張機能にJavaScriptを追加して、データ保存や自動処理などより実用的な機能にも挑戦していきたいと思います。
ブラウザ拡張機能に興味がある方は、まずはPopupを表示するだけの簡単なものから試してみると面白いかもしれません。
今日はブラウザの拡張機能のことはじめについてお話ししました。
最後までお聞きいただきありがとうございました。
本日の内容は以上となります。
最後までお聞きいただきありがとうございました。
最後にAmazon Kindleで発売中の電子書籍のお知らせです。
キレイごとゼロの別居介護をリアルに環状ではなくシステムとExcelで立ち向かった瞬間、
手取り23万円のエンジニアがExcel1枚で実家の破綻を防いだ話、
そして実家の保守運用をこなすための時間を圧倒的にひねり出す技術を書いた会社公認爆速仕事術PC魔改造、
この2冊が現在Amazon Kindleにて絶賛発売中です。
どちらもKindle Unlimited読み放題の対象となっていますので、
会員の方は追加料金なしですぐにお読みいただけます。
音声を聞いた後にスマホの画面の下にある概要欄のリンクから是非チェックしてみてください。
03:04
それではまた次回の配信でお会いしましょう。