Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

はじめまして、こんにちは、水音ぴねといいます。高知で大学生してます。 今回は、私が TypeScript を使って Google Chrome 拡張機能を作る上で見つけたことを書いていきたいと思います。 少々長くなりすぎた感があります。必要なところを、つまみ食いしてください。 前置き Google Chrome 拡張機能とは ? Google Chrome の機能を拡張するソフトウェアで、Web の技術 (JavaScript / HTML / CSS) 使って作ります。そして、一般的に Chrome 拡張機能と呼ばれるものには、大きく分けて以下の二種類があります。 拡張機能 アプリ (chrome://apps/ に表示されるもの) 「拡張機能」は、ブラウザの UI を拡張したり、ウェブページの内容を書き換えたりするものを指します。「アプリ」は、Chrome の API を使ったアプリケ
先日、動画に突然「熱盛」を表示するとかいうクソChrome拡張を作って公開しました。 動画を再生しているとたまに熱盛と表示されてしまうchrome extension作ったから見てhttps://t.co/KGdPKFvjuP pic.twitter.com/ocyqJWSBBe— まざっち (@mazamachi) 2017年8月29日 めっちゃバズって結構インストールしていただけました。うれしい。 やっぱりこういうのは鮮度が大事で、思いついてから公開までを数日にとどめたいところですね。 とはいえ、Chrome拡張機能をシュッと作るためには Chrome拡張の作法に則った設定ファイルの作成 (manifest.jsonなど) ES6/TypeScript や Less/Scss などのトランスパイル自動化 開発版とリリース版の分離 などなど、設定事項が多くてかなり面倒です。 この記事は、
4年近く前の2012年に僕が考えたChrome拡張機能を作るときのデザインパターンというエントリを書きました。最近参加したイベントで「よういちろうさんの拡張機能の記事見て作ってみました〜」と声をかけてくれた人がいて嬉しかったのですが、2012年のそのエントリは、すでに内容が古くなってしまっています。最近の状況を踏まえて、内容を新しくした「2016年度版」を書いてみようと思います。 変更しようと思った点は、以下です。 prototype.jsは使わず、ECMAScript 2015で書く。 Background Page(常駐型)ではなく、Event Page(非常駐型)にする。 そもそも最初のコードセットは自分で書かない。 本文やコード的には、2012年度版をコピペしています。 (この投稿の内容は、自分のブログエントリと同じです。) 前にいくつかのChrome拡張機能を作っていて、すでに数
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く