PWA Update Available - Service Workerの更新通知 MOONGIFT
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました PWAを適用することで、WebアプリケーションでネイティブアプリのようなUI/UXを実現できます。その一つとしてService Workerが挙げられます。Service Workerはクライアントサイドにキャッシュされ、アクセス時に差分があると更新される仕組みです。 しかし、更新はされるのですが、その場では適用されません。その場はキャッシュされているものが利用され、次回から新しいものに変わります。そこで使いたいのがアップデートを通知するPWA Update Availableです。 PWA Update Availableの使い方 WebサイトにアクセスするとService Workerの新バージョンがある旨通知されます。 もう一度アクセスすると表示されなくなります。 Servi
PWA Starter Kit - PWAを学ぶためのテンプレート
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました PWA（Progressive Web Apps）というキーワードがトレンドになっています。しかしPWAは特定の技術を指すのではなく、Webでの体験をよりネイティブ並に向上させるという概念でしかありません。そのため何から取り組んだら良いかが分かりづらいです。 そこで勉強のベースに使ってみたいのがPWA Starter Kitです。PWAに関する要素が盛り込まれたテンプレートです。 PWA Starter Kitの使い方 こちらがテンプレートです。 カウンター。これは再読み込みすると消えてしまいます。 ショッピングカート。 マニフェストファイルもきちんと設定されています。 PWA Starter KitではPWAとして必要になる要素（レスポンシブ、SPA、アプリマニフェスト）などの要
Qiita-Trend-PWA - QiitaトレンドをPWA化
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました PWA（Progressive Web App）というキーワードに注目が集まっています。Webアプリケーションのパフォーマンスを向上させたり、スマートフォンアプリで実装されているような機能を実現するための仕組みです。 今回はそんなPWAの例としてQiita-Trend-PWAを紹介します。名前の通り、Qiitaのトレンド記事一覧をPWA化しています。 Qiita-Trend-PWAの使い方 記事一覧です。二回目以降の表示が高速です。 デイリーのグラフ。その他が多いですが、それ以外ではPythonが人気のようです。 ウィークリーではJavaScriptが人気です。 PWAとしてGoogle Chromeでインストールしたり、Androidでアプリとしてインストールできます。 Qiit
PWA（Progressive Web Apps）はどうスゴイのか？基本知識と12のメリットを解説
Web技術は絶えず発展し、近年ではHTML5、CSS3、各種JavaScriptライブラリやフレームワーク、クラウドバックエンドなどに支えられた「モダンWeb」と呼ばれる、新しく、よりリッチな表現力をもつスタイルへと進化してきています。そうしたモダンWebの技術の中から生まれたPWAは、簡潔に言うと、「Webサイト／Webアプリをネイティブアプリのようにアプリとしてインストール可能にする技術」と表現できます。この記事では、この数年話題に上ることの多くなった新しいWebのスタイルと「PWA」（Progressive Web Apps）について解説します。 新しいWebのスタイル「PWA」とは何か 昨今のWeb技術は「HTML5」や「CSS3」、各種JavaScriptライブラリやフレームワーク、クラウドバックエンドなどに支えられて発展してきました。現在では「モダンWeb」と呼ばれる、より新し
Book Management PWA Onsen UI Vue
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 新しい技術を習得したいと思ったら、実際に手を動かして何かを作ってみるのがオススメです。手を動かした経験は誰にも奪われず、自分の知識になります。また、手を動かすことで問題点やハマりどころも理解でき、実際に利用する際に応用できます。 今回はPWA（Progressive Web App）を体感するためのアプリケーション、Book Management PWA Onsen UI Vueを紹介します。その名の通り、技術的にはOnsen UIとVueを用いています。 Book Management PWA Onsen UI Vueの使い方 書籍一覧です。 右上にメニューがあります。 レンタル中の書籍一覧です。 期限切れの書籍です。 レンタルする際の画面です。 こちらは逆にレンタルした書籍の返
フロントエンド開発で必修のPWA、仕組みと使い方
出典：日経 xTECH 2018年 7月 26日 （記事は執筆時の情報に基づいており、現在では異なる場合があります） プログラミング言語の進化や新たな技術の台頭により、Webフロントエンド開発が劇的に進化している。処理が遅い、ネットなしでは利用できない、はもう過去の話。現在のWebフロントは、高速にサクサクと動き、オフラインでも動作するのが当たり前になりつつある。Webフロントエンド開発を支える新技術を解説する。 最新のWebフロントエンド開発を牽引するのがPWA（Progressive Web Apps）だ。ブラウザーの対応が進み、今年はPWA対応のアプリが急増する可能性が高い。PWAとは、特定の技術やフレームワークを指すものではない。Web標準技術を使って、これまでのWebアプリでは実現できなかったユーザー体験を提供するというコンセプトや、それを実現するための技術群を指す。 まず、PW
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
