【PWA】YouTubeをみんなでワイワイ見るためのサービス、DJ7をローンチしました！ - Qiita
みなさんこんにちは！ 今回はYouTubeの動画を複数人で同時視聴できるサービスを作りましたので紹介したいと思います。 ブラウザを開くだけで、友達や恋人と同じ動画を見ることができます！ 複数人で同じ動画を見て、あーでもないこーでもないと意見を交わすのはめちゃめちゃ楽しいです。 これはぜひ皆さんにも体験してもらいたいです！ YouTube同時再生サービス DJ7 https://dj7.io 初回のアクセスは音がならないように設定してありますのでご安心ください。 できること 同期再生 サービスの要です。複数のデバイス間で再生の状態が同期され、離れている場所でも同じタイミングで同じ動画を視聴できます。 右下をクリックすると動画を画面に大きく表示します。これによって複数人で同じ動画を見ることができます😋 シークバー共有 DJ7ではシークバーの状態もユーザ間で共有されます。これはYouTube
Kanban Board PWA - PWAのカンバンシステム
カンバンはタスクだけに限らず、情報をステータスに沿って管理するのに役立ちます。多くの場合、そのデータをサーバサイドに保存しますが、ちょっとしたものであればクライアントでも問題ないでしょう。 今回紹介するKanban Board PWAはカンバンシステムをPWAにした、そんなソフトウェアです。 Kanban Board PWAの使い方 PWAとしてデスクトップにインストール済みです。 そしてカンバンに戻ります。各タスクはマウスで移動させられます。 Kanban Board PWAはWebブラウザからのアクセスはもちろん、デスクトップとしてインストールもできます。アプリケーションになれば、Webブラウザとプロセスが切り離されるので常駐させておくこともできます。さくさく動くので便利なソフトウェアです。 Kanban Board PWAはJavaScript製のオープンソース・ソフトウェア（MIT
PWABuilder - PWAを開発する際のお供に
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました PWA（Progressive Web Apps）に注目が集まっています。ネイティブアプリにしかできないことはたくさんありますが、Webアプリケーションでも十分という領域はどんどん増えています。そんな中、iOSも対応範囲を増やしており、実用レベルになってきています。 PWAを作っている方はPWABuilderを使ってどれくらい対応しているかチェック、改善しましょう。 PWABuilderの使い方 まずURLを入力します。 自動的にチェックが行われます。 アプリマニフェストファイルのチェックです。閲覧だけでなく、編集もできます。 画像をアップロードして、各種サイズを一気に生成する機能もあります。 Service Workerのキャッシュ戦略に合わせてコードが生成されます。 PWABu
3分でわかる PWA
PWAは、Webブラウザー向けのWebアプリケーションをあたかもネイティブアプリのように利用するための枠組みだ。PWAのWebアプリは、オフラインでの動作やプッシュ通知も可能だ。
どのように「PWA対応」すればいいのか？ 効果を最大化するポイント
PWAへの対応を検討する際に最も重要なのが、「PWA対応することによって実現したいこと」の明確化です。実現したい目的がネイティブアプリでしか実現できない可能性もあります。すぐに実装に飛びつかず、必ず目的を明確にしておきましょう。 たとえばユーザーに対してプッシュ通知を行いたい場合は、ネイティブアプリという選択肢だけではなく、PWAのWebプッシュ通知でも要件を満たせるかもしれません。プッシュ件数の上限などはありますが、無料でWebプッシュ通知配信をするSaaSもいくつか用意されているため、ネイティブアプリを作らなくていいケースもあります。 そしてPWAに対応することが決まったら、既存のWebサイトがレスポンシブデザインに対応をしているか確認をしてください。 既存のWebサイトをレスポンシブデザイン化せよ レスポンシブデザインとは、ユーザーのデバイスに依存せず、画面サイズに最適な状態でコンテ
Scrapbox、Android版PWAに対応。Android端末から超高速でScrapboxを利用できるように。
Scrapbox、Android版PWAに対応。Android端末から超高速でScrapboxを利用できるように。 ScrapboxのAndroid版のPWA(Progressive Web App)をリリースしました。これにより、Android端末においてScrapboxが高速で起動し、さくさく利用できるようになりました。 使い方 ブラウザから https://scrapbox.io にアクセスし、メニューから「ホーム画面に追加」を選んでください。これでインストールは完了です。 すでにAndroid端末でScrapboxをホーム画面に追加している方は一度削除してください。 Scrapbox PWA化のメリット ネイティブアプリのようにさくさく動く 起動～記事閲覧まで、ネイティブアプリのようにさくさく高速に動きます。オフラインでの記事閲覧も可能です。オフラインの書き込みについては、今後対応
TWAの挙動をPWAに寄せていく（起動編） - Qiita
差分 起動時のスプラッシュページがない 起動時の画面でActionBarが表示されている（QRとだけ表示されているヘッダー） Webページがフェードインじゃなくスライドインで表示される Webページ表示中のステータスバーが白くて浮いている GitHubのcommitログと共に変更箇所を説明します。 ActionBarを消す アプリのテーマをDarkActionBarからNoActionBarに変更することで、ActivityのActionBarを消しています。 TWAのステータスバーにテーマカラーを反映 元はTWAサポートライブラリで提供されているLauncherActivityをそのまま使用していましたが、LauncherActivityを継承した自前のActivityを使用するよう変更し、ChromeCustomTabのIntentを生成しているメソッドをオーバーライドします。 htt
PWA（Progressive Web Apps）はどうスゴイのか？基本知識と12のメリットを解説
NPO日本Androidの会 理事／フリーエンジニア。Web技術を中心にさまざまなシステム開発を扱う。2018年、日本Androidの会Web Working Group PWA集中勉強会「PWAに備える3ヶ月」の主催等PWAに関するセミナーを多数開催。WordPressサイトをPWA化するプラグイン「PWA for WordPress」を開発、WordPress公式サイトで公開中。 新しいWebのスタイル「PWA」とは何か 昨今のWeb技術は「HTML5」や「CSS3」、各種JavaScriptライブラリやフレームワーク、クラウドバックエンドなどに支えられて発展してきました。現在では「モダンWeb」と呼ばれる、より新しく、よりリッチな表現力を持つスタイルへと進化しています。 そうしたモダンWebの技術の中から生まれたのが、今回ご紹介するPWAです。PWAは「WebサイトやWebアプリをネ
Chrome に PWA for Desktop が来ていたので next-editor で試した - mizchi's blog
追記: Canary じゃなくてもいいらしいのでタイトル修正した。が…実装具合はよくわからない 今年中に来るとは聞いていたやつ。要はウェブアプリを デスクトップアプリ化する。Electron と違って Chrome の Sandbox と同じ権限で動いている Twitter Lite をデスクトップ PWA にして使ってるんだけど、最 & 高です。 Mac だと Chrome Canary で enable-desktop-pwas のフラグを立てると使えます。 pic.twitter.com/0TPhe8gyQL— Eiji Kitamura / えーじ (@agektmr) 2018年7月12日 ちなみに Chrome Canary + フラグは上級者向けなので、自身のない方はいましばらくお待ち下さい。そのうち安定版で普通に使えるようになります。— Eiji Kitamura / えー
いまさら聞けないPWAとAMP - Qiita
概要 PWA = モバイルのWEBページでネイティブアプリのようなUXを提供するためのもの ※ 2020/04/05 追記: PWAに関する仕様の策定当初はモバイルでのユースケースが主だったと記憶していますが、PWAはモバイルに限定されたものではなく、実際にデスクトップでの活用例も増えています。参考: PWAs: building bridges to mobile, desktop, and native (Google I/O '18) AMP = モバイルのWEBページを高速化するためのもの どちらもGoogleが主軸となって策定されている、モバイルページを進化させるためのプロジェクトおよび技術。ネイティブアプリの代替技術ではなく、ブラウザAPIの進化によってネイティブアプリのようなUXをウェブページで提供することが主眼。 1. PWAとは Progressive Web Appsの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Microsoft、「PWABuilder 2.0」をリリース ～既存サイトの“PWA”移行を支援／デザインの刷新や“Feature Store”の新設など。「PWABuilder 2.1」も開発中
「Google Chrome 67」はデスクトップ“PWA”をサポート！……で、“PWA”って何？／「Google フォト」や「Twitter Lite」といったWebアプリをまるでデスクトップアプリのように【やじうまの杜】