やまひろのエンジニア航海記

エンジニアである僕がプライベートの学習の中で学んだことなどを気楽に書いていきます。

イベントレポート#1：PWA Night vol.4 ～PWAのミライや活用方法をみんなで考えよう～

イベントレポート PWA

はじめに

今回は PWA Night vol.4 ～PWAのミライや活用方法をみんなで考えよう～ というイベントに行ってきました。写真撮り忘れたので写真ないですが、許してください...。もし記事の内容に誤りがあったら指摘してください。
　このイベントは、登壇者がPWAの活用法や開発話について話すというものです。発表が終わった後には懇親会(会費1000円)もあります(僕は参加しませんでしたが)。 会場は株式会社ウフルさんのオフィスです。いい感じのおしゃれなオフィスでした。 PWA活用の事例や、PWA周りの技術の話、PWAの動向の話などがあり、PWAをこれから触る僕にとって、ますますPWAを触りたくなるような内容でした。早速、チュートリアルやってみます！

受付、イベント開始

connpassの参加票を見せて受付しました。受付時にPWA Nightのステッカーをいただきました。PWAの本の販売もありました。
　イベント開始後、最初はまさかの自己紹介からでした。「聞いてないよっ(　ﾟдﾟ)」って思いましたが、connpassのページを確認すると書いてありました...。一人10秒でしたが、結構緊張しました。内容は大体、名前と職種、参加した目的で、たまに会社名を言う人もいました。 全員の自己紹介が終わると、さて、いよいよ講演です。

こえのブログのPWAについて by Kazunari Hara さん

最初の発表は、「こえのブログのPWAについて」 というタイトルで、amebaのこえのブログの開発話です。 なぜPWAにしたのかという話の後、PWAを開発する中での技術的な話がありました。 実装に利用したAPIの話やコードを見せながらの話もありました。やっぱりコードを見せてくれるのはありがたいですね。 シェアにはWebShareAPI、コピペにはClipboardAPI、バイブレーションにはVibrationAPIといった様に、APIを利用しているようです。バイブレーションは、まさにスマホ特有のものなので「おー」と思いました。
　個人的には、開発をする中で、サービスの特性を考えた上での工夫が感じられる話が印象に残りました。 サービスの内容的にオフラインでのデータの保存が重要なので、記事データが変わるたびにIndexedDBに記事を保存する話、録音中の音声を圧縮するためにWebAssemblyのvmsg というライブラリを使っている話、CDNを使用する上でできるだけコンテンツをキャッシュするようにしたりキャッシュのTTL(TIme To Live)を長くしたりという話です。

やっていこう。PWA by @oliver_diary さん

2つ目の発表は「やっていこう。PWA」というタイトルです。 まずPWAの定義の話がありました。PWA初心者な僕にはありがたかったです。その後に、@oliver_diary さんがPWAを開発する上で気をつけていること、PWAにまつわる技術の話がありました。 どのようにユーザに通知を許可させるかという話は、考えたことがなかった視点だったので勉強になりました。 PWAを端末にインストールしてもらうためには、通知を出さなくてはなりません。 しかし、最初にwebページを開いた時にブラウザの「通知を許可しますか」だと、ほとんどの人が拒否にして、その後許可に変更する可能性は低いとのこと。 そこでアプリケーション独自のモーダルやポップアップを入れることによってこれを回避するという話でした。
　あと、APIの話がとてもわくわくしました。 聴いた中だと、Shape Detection API、カメラへのアクセスや位置情報の追加などが面白そうでした。 僕がAndroidアプリとして開発しようと思っていたものも作れそうでわくわくしました。

業務システムでこそPWA by @goofmint さん

3つ目の発表は、「業務システムでこそ使えるPWA」というタイトルの発表でした。 僕はSIer勤務なので、一番身近な発表だったと思います。また、PWAはBtoCのイメージがあったので、タイトルを見た時に意外性がありました。 主に業務アプリでPWAを導入することのメリットの話でした。 登壇者が経験されたSIerならではの難しい点をPWAなら解決できるという話でした。 よくお客さんがなかなかアプリを更新してくれないということがあるが、PWAだと自動更新なので、そのような心配がないという話や、iOSエンジニアやAndroidエンジニアを集めるのは大変だが、PWAを採用すると、普段webアプリを開発しているメンバーで開発できるので人を集めやすい、といった話がありました。 SIerでPWAを採用することのメリットが分かりました。

LT

次はLTです。

最初のLTは、gatchan0807 さんによる「PWACompatを本番導入してみた話」という発表です。 PWA compatは聞いたことがなかったのですが、PWA compatは、manifest.jsonの情報をもとに対応していないブラウザでタグを追加してくれるというものらしいです。

2つ目のLTは、iret_oyamatsu さんによる「PWA作って満足していませんか」という発表です。 このLTでは、PWAの運用にフォーカスして話をしていました。 PWAを開発して終わりではなく、運用をしていこうという話です。 PWAの本質はUXの向上なので、PWAをリリースした後の効果測定、改善が大事という話でした。

最後は、kindback さんによる「PWAをもっと手軽に」という発表です。 これは、PWAを手軽に作成できるツールを作成したという発表でした。 OneSignalの無料プラン使用している関係上、商用のPWAには利用できないとのことでしたが、社内の人を説得するためのプレゼン用に使えるとのことです。 改修中でイベント時は残念ながらアクセスできませんでしたが、発表を聴く限り凄そうでした。

イベントレポートは以上です。 これからもイベントレポートを書いていこうと思うので良かったら読んでください。