暇だったのでパッとメモを取れるChromeの拡張機能を作ってみた。
前回病院に行ったのが3月で、その時90日分のバセドウ病の薬を処方してもらったんです。
で、来週あたりまた病院に行くんですけど
このままだと２０錠余るんですよね。
え、そんなに飲み忘れることあると思いますか？
流石の僕もそこまで忘れっぽくないので、多く処方されていたんだと思うんですよ。
でもですよ、仮に僕が飲み忘れたことがあったとしても多くて１０数回だと思うんですよ。
そうすると１０錠くらい多く処方されていたことになるんですけど
そんなことあると思います？
自分の記憶が怖くなってきました。
どうもえこです。
今日はchromeの拡張機能を作ったので宣伝しにきました。
それではどうぞ。
- メモ帳を作りました。
- 機能紹介
- localStorageとは
- 作ろうと思った経緯
- chromeウェブストアに公開するには$5かかる
- ストアに公開するには審査が必要
- JavaScriptは楽しい
- まとめ
メモ帳を作りました。
作ったものはこちらからダウンロードできます。
機能紹介
昨日は単純にメモを取ることしかできません。
動画にもあるように、テキストエリアに文字を入力し、saveボタンを押します。
するとlocalStorageに保存されるわけです。
localStorageはF12を押してDeveloper Toolsを開き→Applicationタブ→Local Storageの順でクリックしていくと保存された値を見ることができます。
拡張機能の場合だとlocalStorageは確認できないので気になる方はDeveloper ToolsのconsoleタブでlocalStorageを使ってみてください。
例えば
localStorage.setItem('data', 'localStorage test'); localStorage.getItem('data'); >> localStorage test
localStorage.setItemでデータを保存します。
第一引数でkeyを、第二引数にvalueを宣言します。
例で言うとdataと言う名前のkeyを作り、そこにlocalStorage testと言うvalueを紐付けました。
辞書や連想配列と同じです。
localStorage.getItemでデータを呼び出します。
呼び出すときはkeyを引数に与えます。
setItemした段階でDeveloper Tools→Applicatonタブ→Local Storageに先ほどsetした値が表示されているはずです。
localStorageとは
ローカルストレージ はブラウザにデータを保存できる機能で、
特徴としてはcookieよりも保存容量が大きく、保存期間がほぼ永久、実装が簡単。
と言う利点を持っています。
cookieが4KBの保存容量に対してlocalStorageは5MBまで保存できるため、ちょっとした記録にちょうどいいです。
引用
ストレージの大きさ
クッキーは4 KBに制限される。ウェブストレージの容量はそれよりもはるかに大きい。
Mozilla Firefoxはオリジンごとに5 MBの容量がある[5]。
Google Chromeはオリジンごとに10 MB の容量がある[6]。
Internet Explorerはストレージエリアごとに 10 MB の容量がある[7]。
ウェブストレージ - Wikipedia作ろうと思った経緯
メモ帳の拡張機能は探せばたくさんあります。
僕が作ったメモ帳よりも便利な機能が付いているものだってあります。
それでも僕がメモ帳を作ったのは、、、
JavaScriptの勉強をしていて何かを作りたかったのと、localStorageを使ってみたかったからです！
あとせっかくポートフォリオも作ったので作品を載せたかったってのもあります。
chromeウェブストアに公開するには$5かかる
chromeウェブストアではアプリを有料で公開することができなくなったようです。
でも登録手数料は取られるんです。
マネタイズできるならいいんですけど、まあ仕方ないですね。
ストアに公開するには審査が必要
決められた項目を記入し、審査してもらう必要があります。
実は僕、今回のメモ帳の他にもう一つの拡張機能を申請中でして。
全てのページのCSSに追記してあるものを動かす拡張機能を作りました。
全てのページに被せて表示させるため審査が厳しめになるそうです。
メモ帳は数時間で審査が通りその後すぐに公開されたんですが、もう一つの拡張機能は数日経ってもまだ審査中のままです。
拡張機能はJavaScriptで書くので、悪いことできるスクリプトじゃないかしっかり目に確認しているんですね。
JavaScriptは楽しい
Developer toolsのconsole画面でパパッと書くことができるJavaScriptはプログラミング初学者にもってこいなんじゃないでしょうか。
forやifや四則演算や配列、変数など基本もできますし
なんならスクレイピングも出来ちゃいます。
しかも読み込み済みのDOMを操作するのでサーバに負荷がかかりません。
Googleアカウントがあればブラウザ上でpythonを実行することができるGoogle Colaboratoryもありますが、スクレイピングするにはrequestsする必要があったり、BeautifulSoupをインストールする必要があったりとJavaScriptと比べると手間がかかります。
まあサーバサイドとクライアントサイドで全く違うので比べるのが間違いだとは思いますが。
まとめ
拡張機能の書き方は後で記事にしようかと思います。
今回はこんなの作ったよって報告と、ブログの更新が全くされていなかったので何か書きたかっただけです。
最近暑くてなかなか執筆や勉強が進まないのですが
ゆっくりと増やしていきたいと思います。
あと、プログラマーやSEあたりに転職したいです。
そのために個人開発を頑張ります！
