コード進行パターン表がアプリっぽく(PWA対応)使えるようになりました!
公開日:
:
BLOG
![](https://past-orange.com/po_sp/wp-content/uploads/2019/12/pwa1.png)
コード進行パターン表がアプリみたいに使えるようになりました!
どうも、GANO(@Past_Orange)です。
コード進行をキーごとに表示切り替えができるサイト『コード進行パターン表』がアプリっぽく使えるようになりました!
アプリっぽくってなんだよって話なんですが、スマホで見る際にブラウザからではなく、単体アプリのように起動し表示することが可能になったんです。
PWA対応したってことなんですが、そこらへんのIT関係なお話は後半で。
スポンサーリンク
使い方
アプリとして使うための準備をご紹介しますね。
iPhoneしか持っていないのでandroidのできていないのですが、おそらく『コード進行パターン表』をブラウザ表示するとホーム画面に追加するよう促されるかと思います。
以下はiOSでの設定。といってもとっても簡単でして。
サイトを表示して「ホーム画面に追加」を押すだけ。
これでホーム画面にアイコンが設置され、アイコンをタップするとアプリのように起動できます。
ホーム画面追加のメリット
アプリのように起動するメリットは3つ。
1.アドレスバーがひょこひょこしない
ブラウザ表示だと上にスクロールするたびアドレスバーがひょこひょこ出てきて邪魔だったんですが、そこが解消されています。
2.ブラウザと別で起動できる
ブラウザとは別タスクとして起動できるので、管理がしやすくなるかと思います。
3.オフライン起動
一度オンライン上で読み込んでしまえば、後はオフラインでも表示可能です。ブログに飛んだりYouTubeをみたりはできないんですが、コード進行だけならOKです。
注意点
これはiOS限定っぽいんですが、TwitterやFacebookへのシェアボタンを押すと、シェアはできるんですけど、アプリ側が真っ白になってしまいます。
原因は不明でして、iOSがまだそこまで対応していないんじゃないか疑惑があります。
もしシェアボタン押しちゃった場合は、ホーム画面からアイコンを削除。再度ブラウザで表示して、ホーム画面にアイコン追加をお願いします。
iOSのPWAに関して
ここからはちょっとだけプログラムのお話。
シェアボタンはJSでwindow.openしてるんですけど、standaloneからブラウザに移動しているためか、アプリ側に戻ると画面真っ白に。
現在のiOSでは対応していないんじゃないかと思います。
standalone起動後にブラウザを経由して戻ってくる方法もあるみたいなんですが、どうやっているんでしょうか。
別件でPWAでカメラアプリ作れるかなとチャレンジしてみたんですけど、iOSが未対応っぽくてですね。
standaloneでなくbrowserじゃないとカメラにアクセスできないんだとか。それってただのショートカットなんですよね。
しかもsafariじゃないとカメラにアクセスできなくて、もしchromeをメインで使っているiPhoneユーザーがいたら使ってもらえません。
プッシュ通知もできないですし、まだまだiOSはPWA対応してくれない感じです。PWAはandroid用って感じでしょうか。
PWAというもの自体、一般的には全然知られていないようにも感じますし、「ホーム画面に追加」を好んで使っている人も少ない気がします。
まだまだこれからって感じですね!
最後に
とはいえ、今後を考えSSL化、PWA対応して良かったです。
アプリ開発はOSを意識すると大変なので、PWAで簡単に作れるようになると嬉しいですね!
GANO
![仕事依頼](https://past-orange.com/po_sp/wp-content/uploads/2015/08/-e1438677108862.png)
![thumbnail](https://past-orange.com/po_sp/wp-content/uploads/2016/02/thumbnail1-e1456577383157.jpg)
関連記事
-
-
音楽の専門学校には入らない方がプロになるには近道かもしれない
音楽の専門学校には入らない方が近道 どうも、GANO(@Past_Orange)です。 プロ
-
-
ビルボードライブ東京のDXシートは最高だよ! Benny Sings with Special Guest 安藤裕子
ビルボードライブ東京のDXシートは最高だよ どうもこんにちは、GANO(@Past_Orange)
-
-
お金ってどうやったらもらえるの?真剣にお金の稼ぎ方を考えてみました
真剣にお金の稼ぎ方を考えてみました どうも、GANO(@Past_Orange)です。 お金
-
-
初めて買うコンデンサーマイクはMXL V67Gがオススメ。1万円ちょっとで買えます。
SM58から卒業しよう! どうも、GANO(@Past_Orange)です。 宅録人口も増え
-
-
ANALYZEが50曲突破!コピーしたコード進行パターンを公開します。
コード進行パターンを公開します どうも、GANO(@Past_Orange)です。 2016
-
-
2016年12月報告。ブログ10.6万PV、収入17.4万円。2016年の収入バランスや出来事もまとめます。
2016年12月報告。ブログ10.6万PV、収入17.4万円 どうも、GANO(@Past_Ora
-
-
ブログ運営での第一関門『続ける』をクリアできた理由
ブログ運営での第一関門『続ける』 どうも、GANO(@Past_Orange)です。 Wor
-
-
VTuber「シクラりわ」に楽曲『DISCOVERY』を提供しました。
VTuber「シクラりわ」に楽曲『DISCOVERY』を提供しました どうも、GANO(@Past
-
-
畑尾大翔(ハタオヒロト)という男
畑尾大翔(ハタオヒロト)という男 男子サッカー日本代表監督にアギーレ監督が就任して1ヶ月。 代表
-
-
クリスマスBGM・ジングル作成
クリスマスBGM・ジングル作成 ロイヤリティフリーのBGMやジングルをダウンロードできるサイト