並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 40 件 / 50件

新着順 人気順

"プログレッシブ ウェブ"の検索結果1 - 40 件 / 50件

  • Appleが「iOS 17.4でのPWA廃止」を撤回すると発表

    2024年2月の頭頃から、AppleがiOS 17.4のベータ版で「プログレッシブウェブアプリ(PWA)」のサポートを廃止していることが明らかになっています。AppleはPWAのサポート廃止について、欧州連合(EU)のデジタル市場法に準拠するためと説明していたのですが、多くの批判にさらされた末、サポート廃止を撤回すると発表するに至りました。 iOS 17.4 won't remove Home Screen web apps in the EU after all - 9to5Mac https://9to5mac.com/2024/03/01/apple-home-screen-web-apps-ios-17-eu/ iPhoneは長らくPWAをサポートしており、これによりモバイルアプリと同じようにウェブ上のアプリをホーム画面に追加して利用することができるようになっています。iOSでのP

      Appleが「iOS 17.4でのPWA廃止」を撤回すると発表
    • Appleの「iPhoneでのPWA廃止」についてEUの規制当局が調査を開始したとの報道

      2024年2月、Appleは突如欧州連合(EU)でiOSにおけるPWAサポートを廃止しました。AppleのPWAサポート廃止について、EUの規制当局が調査を開始したことが報じられています。 EU seeks to investigate Apple over cutting off web apps https://www.ft.com/content/d2f7328c-5851-4f16-8f8d-93f0098b6adc Apple’s decision to drop iPhone web apps comes under scrutiny in the EU - The Verge https://www.theverge.com/2024/2/26/24083511/apple-eu-investigation-web-app-support 2024年2月、Appleが提供する

        Appleの「iPhoneでのPWA廃止」についてEUの規制当局が調査を開始したとの報道
      • AppleがiOSからPWAのサポートを削除したことを認める、デジタル市場法への対応で影響はEU圏のユーザーに限定

        iOSでは「プログレッシブウェブアプリ」(PWA)と呼ばれる技術を用いることでウェブサイトをiPhoneのホーム画面に追加したり通知を受信したりできます。ところが、2024年3月に正式展開される予定のiOS 17.4のベータ版では、EU圏のユーザーを対象にPWAが削除されていることが判明しています。これについてAppleが、EUのデジタル市場法(DMA)に準拠するためPWAを削除したと公式に認めました。 Apple confirms iOS 17.4 removes Home Screen web apps in the EU, here’s why - 9to5Mac https://9to5mac.com/2024/02/15/ios-17-4-web-apps-european-union/ Apple confirms it’s breaking iPhone web apps i

          AppleがiOSからPWAのサポートを削除したことを認める、デジタル市場法への対応で影響はEU圏のユーザーに限定
        • Build a Next.js app in Storybook with React Server Components and Mock Service Worker

          🚀Update, March 12: Storybook 8 is out now!Storybook 8 (our next major release) brings React Server Component (RSC) compatibility to Storybook for the very first time, letting you build, test and document Next.js server applications in isolation. In our first demo, we used Storybook to develop a contact card RSC, which accessed contact data both asynchronously and from a file system while simulati

            Build a Next.js app in Storybook with React Server Components and Mock Service Worker
          • ウェブ上でネイティブアプリ並の機能を実現するPWAで利用できる機能をまとめてテストできるサイト「What PWA Can Do Today」

            プログレッシブウェブアプリ(PWA)は、ウェブ上でネイティブアプリと同様の使い勝手を実現するための仕組みで、2015年に概念が提唱されて以来、徐々に機能が増加しています。「What PWA Can Do Today」は、PWAで利用できるさまざまな機能について実際に試せるサイトです。 What PWA Can Do Today https://whatpwacando.today/ サイトにアクセスするとこんな感じ。最初に「Install to home screen」をクリックし、サイトをアプリとしてインストールします。 確認画面が表示されるので「インストール」をクリック。 デスクトップにアプリが追加されました。初回は自動で起動しますが、次回以降はこのアイコンをダブルクリックして起動します。 アプリを起動すると、さまざまな機能をテストできる画面が表示されました。「Media captur

              ウェブ上でネイティブアプリ並の機能を実現するPWAで利用できる機能をまとめてテストできるサイト「What PWA Can Do Today」
            • PWA Night vol.57 ~認証・認可〜 にてパスキーの話をしました - r-weblife

              ritou です。 これで話しました。 pwanight.connpass.com 発表資料と発表内容を公開します。 発表資料 speakerdeck.com 発表内容 台本チラ見しながら話したので実際にはこのとおりになってなかった部分もあります。 今日は、パスキーについて話します。 細かい自己紹介は省略します。 色々宣伝したいものがありますがブログに書きます。 今日の内容ですが、初めにパスキーの概要についてざっと触れます。 続いてWebアプリケーションにパスキーを導入するとなった場合にどこから手をつけるべきかというところに触れた後、一番の悩みどころになりそうなログインのUI/UXについて紹介します。 概要からいきましょう。 パスキーの紹介記事もたくさん出ているので要点だけまとめます。 パスキーとは「パスワードが不要な認証方式」であり、それを支える仕様はFIDOアライアンスとW3Cにより策

                PWA Night vol.57 ~認証・認可〜 にてパスキーの話をしました - r-weblife
              • サーバ不要でバックエンドAPIのモックを実現する「Mock Service Worker 2.0」正式リリース。Fetch API、ストリームAPI対応など新機能

                サーバ不要でバックエンドAPIのモックを実現する「Mock Service Worker 2.0」正式リリース。Fetch API、ストリームAPI対応など新機能 Webアプリケーションのクライアントを開発する際に、本来ならばサーバ上で稼働するWebアプリケーションのバックエンドのAPIを呼び出してデータを受け取って表示するといった動作を作り込みたいけれども、まだバックエンドのAPIも開発中であったり、何らかの理由でバックエンドを稼働させる環境を用意できなかったりすることは、しばしば起こりえます。 そうしたときにサーバを立てることなく、バックエンドのAPIをモックとして簡単に設定し提供してくれるソフトウェア「Mock Service Worker」の最新版「Mock Service Worker 2.0」が正式にリリースされました。 Announcing MSW 2.0! Migratio

                  サーバ不要でバックエンドAPIのモックを実現する「Mock Service Worker 2.0」正式リリース。Fetch API、ストリームAPI対応など新機能
                • サーバサイドのJavaScriptランタイム「WinterJS」登場。Rustで書かれ、WebAssembyにコンパイル可能なService Workerサーバ

                  サーバサイドのJavaScriptランタイム「WinterJS」登場。Rustで書かれ、WebAssembyにコンパイル可能なService Workerサーバ WebAssemblyランタイム「Wasmer」の開発元として知られているWasmer社は、新しいサーバサイドのJavaScriptランタイム「WinterJS」を発表しました。 Announcing WinterJS: a blazing-fast Javascript Service Workers server written in Rust powered by SpiderMonkey ❄️https://t.co/kX7jjJj6qv — Wasmer (@wasmerio) October 27, 2023 WinterJSはRustで書かれた高速なService Workerサーバであり、オープンソースとして公開さ

                    サーバサイドのJavaScriptランタイム「WinterJS」登場。Rustで書かれ、WebAssembyにコンパイル可能なService Workerサーバ
                  • NotionでPWAアプリの開発を実現するノーコードツール「NotionApps」の使い方! - paiza times

                    今回はNotionのデータベースを活用して、PWAにも対応したWebアプリ開発ができるノーコードツールをご紹介します! このサービスはNotionデータベースの情報を取得したり、更新・追加などがアプリ側から簡単にできるのがポイントです。ノーコードでさまざまなロジックも構築でき、自分がイメージしたアプリを素早くカタチにできます。 面倒なサーバーの準備も不要なため、誰でも簡単にアプリを開発して公開できます。ご興味ある方はぜひ参考にしてください。 【 NotionApps 】 「NotionApps」の使い方! まずはサイトの上部にある【Create your app】ボタンをクリックして、無料のユーザー登録を済ませておきましょう。 メールアドレスとパスワードを入力したら【Sign up】ボタンをクリックします。 以下のようなダッシュボード画面が表示されたら準備完了です! 「NotionApps

                      NotionでPWAアプリの開発を実現するノーコードツール「NotionApps」の使い方! - paiza times
                    • Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-後編 - dwango on GitHub

                      2023-03-06 Mon Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-後編 ニコニコQセクションのHajime-san(GitHub)です。 本記事は、Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-前編の続きとなります。 テストについて さて、前編のService Workerスクリプトの実装はローカル開発環境および検証環境での確認を経て本番環境にデプロイされているのですが、このままでは「なんとなくキャッシュが動いている」という状態がブラウザ上に構築されていることになるので、Service Workerの振る舞いの仕様書となるテストコードが欲しいというのが本稿のもう1つの主題になります。 Service Workerのテストについては筆者が知る範囲ではインターネットにはあまり知

                      • ネイティブアプリとWebアプリのギャップ解消をめざす「Project Fugu🐡」について菅原のびすけさんに聞いてみた!

                        「ネイティブアプリケーションでできることをWebアプリケーションでもできるようにする」というゴールを掲げ、APIの機能拡充を図っているChromiumのプロジェクトのひとつに「Project Fugu🐡」があります。日本語の「河豚」から名前を付けたというこのプロジェクトが、現在どんな活動をしているのか、TechFeed公認エキスパートののびすけさんに詳しく聞いてみました。 今回話を伺ったエキスパート フォローしよう! スライド資料へのリンク のびすけさんのこちらのスライドで、Project Fugu🐡について知りました。Project Fugu🐡とはどんなものですか? 概要を教えてください。 Project Fugu 🐡は「ウェブ・ケイパビリティ・プロジェクト(Web Capabilities)」とも呼ばれるChoromiumのプロジェクトチームのひとつです。ちなみにChromiu

                          ネイティブアプリとWebアプリのギャップ解消をめざす「Project Fugu🐡」について菅原のびすけさんに聞いてみた!
                        • CloudflareでもFastlyでもVercelでもDenoでもBunでもService Workerでも動く

                          HonoというWebフレームワークを作っています。 当初はCloudflare Workers向けに作っていたのですが、同じCDNであるFastlyのエッジランタイム、Compute@Edgeでも動くことが分かりました。また、Next.jsのEdge MiddlewareもしくはEdge API RoutesとしてVercelの環境でも動きます。そして、少々手を加えるとDenoでも動きました。もちろんDeno Deployにもデプロイできます。さらに、先程レポジトリが一般公開されたYet AnotherなJavaScriptランタイムのBunでも手を加えず動きました。 この「CloudflareでもFastlyでもVercelでもDenoでもBunでも動いた件」が、なかなか面白かったのでそれについて書きます。 Web標準のAPI これらの環境で同じように動くのは、JavaScriptでかつ

                            CloudflareでもFastlyでもVercelでもDenoでもBunでもService Workerでも動く
                          • Random notes around service workers development and testing

                            Hey! Here are a few random tips and tricks I learned through the years around service workers development and testing. Helpful service worker resources Introduction to Service Worker - Google's introduction to service workers. It's a great starting point if you know nothing about service workers. Now THAT’S What I Call Service Worker! - Jeremy Wagner breaks down the performance improvements obtain

                              Random notes around service workers development and testing
                            • Mock Service WorkerでAPIをモックして開発をスムーズに進められた話 - Classi開発者ブログ

                              こんにちは。開発本部 認証連携チームでエンジニアをしている id:ruru8net です。前回はこちらの記事を書かせていただきました。 tech.classi.jp 現在は認証基盤再建というプロジェクトの中で、主にフロントエンド開発を担当しています。この記事ではフロントエンド開発においてAPIのモックのために「Mock Service Worker」を使ったところスムーズに開発を進めることができたので、使い方を紹介したいと思います。 mswjs.io ツールの導入 弊社ではフロントエンドのフレームワークにAngularを採用しているのでAngularでの導入手順を記します。 基本的にはドキュメントの手順通りです。 1. インストール $ npm install msw --save-dev # or $ yarn add msw --dev 2. モックを定義 src/mocks/hand

                                Mock Service WorkerでAPIをモックして開発をスムーズに進められた話 - Classi開発者ブログ
                              • Web版「Visual Studio Code」がオフライン動作に対応 ~PWAとしてインストール可能に/指定サイズ以下のリポジトリコンテンツを自動DLして高度な検索・定義移動も利用できる

                                  Web版「Visual Studio Code」がオフライン動作に対応 ~PWAとしてインストール可能に/指定サイズ以下のリポジトリコンテンツを自動DLして高度な検索・定義移動も利用できる
                                • Progressive Web Appsの振り返りとこれから | gihyo.jp

                                  Progressive Web Apps(以下、PWA)は2018年ごろからホーム画面へのインストール機能やキャッシュ戦略等の技術視点でエンジニアの間で話題に挙がるようになりました。現在ではWebパフォーマンス、ユーザビリティ向上、PoC(実証実験)といったビジネス視点でも注目されており、多くのWeb実装にPWAが取り入れられています。 今回の記事では、国内のPWAの動向を振り返り、改めてPWA開発のスタンダードとこれからのPWAについてまとめます。 日本国内でのPWAの動向 2015年にPWAという名称が生まれ、Google Chromeを始めとした各ブラウザが順次PWAに対応していきます。2018年にiOSのSafariがService Workerに対応したことををきっかけに国内でもPWAが注目され始めました。筆者もその頃からPWAに興味を持ち、2019年2月に立ち上がったTechコ

                                    Progressive Web Appsの振り返りとこれから | gihyo.jp
                                  • TechCrunch

                                    With the current iteration of its product going through its paces with a handful of beta customers, FlexAI will launch its first commercial product later this year.

                                      TechCrunch
                                    • PWA(Progressive Web Apps)対応サイトの作り方・実装方法まとめ・入門 - AWS上で学習したPWA導入例とLighthouse Report Viewerの使い方 - NRIネットコムBlog

                                      小西秀和です。 現在、AWSの静的ウェブサイトホスティングで入門するAWS Amplify(Console、CLI) - 概要編などAWSのサーバーレスな静的ウェブサイトホスティングをテーマにしたブログ記事を執筆しています。 今回もAWSは関係しますが、フロントエンドに近い話題で、最近動向が本格的になってきたと感じているPWA(Progressive Web Apps)について私が自主的に学習した内容を記事にしてみました。 私の場合はAmazon S3、Amazon CloudFront、AWS Certificate Manager、Amazon Route53を使用した静的ウェブサイトに最小限のコンテンツをデプロイしてPWAの実装について学習しました。 また、Lighthouse Report ViewerというPWAなどの品質テストができるツールを使用して、PWAの基準に合格し、Pe

                                        PWA(Progressive Web Apps)対応サイトの作り方・実装方法まとめ・入門 - AWS上で学習したPWA導入例とLighthouse Report Viewerの使い方 - NRIネットコムBlog
                                      • Next.js で作成した Web アプリを PWA 対応する | DevelopersIO

                                        経緯 趣味が手芸(ミシン)の妻からある日突然、slack でこんな画像が送信されてきました。 特に難しいものではなかったので、隙間時間でサッと作って Cloudflare Pages にデプロイしました。 Cloth Price Calculator 計算したログを残せたほうがいいんじゃないか、そのログから合計をだしたりできたほうがいいのではないかなど色々と提案してみたのですが、これくらいシンプルなほうが使い勝手がいいとのことだったので希望通りに実装しました。 結果そこそこの反響があり、せっかくなのでオフラインでも動作するように PWA 対応をしてみました。 Next.js で PWA 対応 https://github.com/hbsnow/cloth-price-calculator/tree/v1.0.0 対応前のコードは上記になります。 ここでは Next.js の公式サイトにある

                                          Next.js で作成した Web アプリを PWA 対応する | DevelopersIO
                                        • PWAもAndroidアプリも使える! さらに“奥の手”Linuxアプリをインストール可能【Chromebookって何?】

                                            PWAもAndroidアプリも使える! さらに“奥の手”Linuxアプリをインストール可能【Chromebookって何?】
                                          • Safari on iOS 14 and iPadOS 14 for PWA and Web Developers-firt.dev

                                            What's new, what's missing, new challenges and new abilities by Maximiliano Firtman Twitter @firt About Newsletter Published 4 years ago (16 Sep 2020) About 21 min reading time #ios #webview #pwa #store From today, iOS 14 and iPadOS 14 are available to most users in the world. I've played with it, and here you have a list of the essential changes for PWA and Web Designers and Developers. As usual

                                            • Building a PWA at Google, part 1  |  Articles  |  web.dev

                                              Building a PWA at Google, part 1 Stay organized with collections Save and categorize content based on your preferences. This is the first of a series of blog posts about the lessons that the Google Bulletin team learned while building an external-facing PWA. In these posts we'll share some of the challenges we faced, the approaches we took to overcome them, and general advice for avoiding pitfalls

                                              • MicrosoftとGoogle、PWAのPlayストア登録促進でコラボ

                                                米MicrosoftのPWA(Progressive Web Apps)プロジェクト、PWABuilderは7月10日(現地時間)、米Googleとの協力により、開発者がPWAをGoogleのAndroidアプリストア「Google Playストア」に登録しやすくするため、ツールの相互運用性を確保したと発表した。 Microsoftのユダ・ガブリエル・ヒマンゴ氏は公式ブログで「Microsoftのオープンソースの開発者ツールPWABuilderとGoogleのユーティリティ&ライブラリのBubblewrapを連携させ、開発者がPWAをGoogle Playストアで公開できるようにした」とし、「MicrosoftとGoogleがWeb開発者コミュニティの利益のために新たに協力したと発表できて嬉しい」と語った。 PWAは、米Googleが中心となって取り組んでいる、Webアプリの進化系のような

                                                  MicrosoftとGoogle、PWAのPlayストア登録促進でコラボ
                                                • Service Worker Lifecycle Explained | Felix Gerschau

                                                  pwaperformanceService Worker Lifecycle ExplainedExplaining the lifecycle of Service Workers in PWAs and how to update them as fast as possible. The Service Worker lifecycle is arguably the most complex part around Service Workers and Progressive Web Apps (PWAs). I only felt like I understood it completely while writing this article, and I hope it will make your life with Service Workers a lot easi

                                                    Service Worker Lifecycle Explained | Felix Gerschau
                                                  • 【ネイティブJavaScriptのみ】 Web APIを活用したアプリ開発(PWA化も)【JS勉強1か月でも開発可】 - Qiita

                                                    はじめに コロナの影響で今年のGWは外出自粛。 ということでオンラインハッカソンに参加させていただきましたのでその記録の記事です。 構想編 何が作りたいか? 「日常生活での無駄を減らせるものが使いたい」ということで 以前より無駄だなと思っていた今日何食べよう(どこ行こう?)問題に焦点をあてることに。 何が作れるか? 現在のスキルとしてHTML,CSS,JavaScriptの基礎の知識(dotinstall一周したくらい)しかない。 JavaScriptで動かせるものを探していたらAPIがJavaScriptが動かせそうと知る。 構想編まとめ 【作成目標】 ・ 今日なに食べよう?と考える不毛時間の削減 ・ 考えるのが嫌になって毎度同じ店に行ってしまう現象の防止(未開拓店舗の発掘) 【アプリ概要】 ・ 今日の気分から適切なレストランを提案 → 周辺の店舗検索 (yes/no診断→店舗検索) ・

                                                      【ネイティブJavaScriptのみ】 Web APIを活用したアプリ開発(PWA化も)【JS勉強1か月でも開発可】 - Qiita
                                                    • mozaic.fm v3 リリースと Podcast の PWA 化 | blog.jxck.io

                                                      Intro mozaic.fm をリニューアルし v3 としてリリースした。 今回の更新は以下のような変更/修正を実施している。 PWA 化 before install prompt Background Fetch Periodic Background Sync Content Index API Badging API Player UI の刷新 Pure Webcomponents Media Session API WAI-ARIA Portal Preview Screen Wake Lock Security CSP v3 (not Report-Only) Cross Origin Resource Policy Cross Origin Opener Policy Cross Origin Embedder Policy Expect-CT NEL Referrer P

                                                        mozaic.fm v3 リリースと Podcast の PWA 化 | blog.jxck.io
                                                      • TechFeed ProのPM兼UXデザイナーが語る、PWAのデメリット・メリット

                                                        関心が高まりつつあるPWA(Progressive Web Apps)についての技術・情報交換の場である「PWA Night」。Vol.14の今回はUI/UXがテーマです。株式会社テックフィードCEOで、「TechFeed Pro」のプロダクトマネージャーでありUXデザイナーでもある白石俊平氏は、同アプリ開発の経験からUI/UX設計の2つの原則について話しました。 TechFeed ProのUI/UX 白石俊平氏(以下、白石):始めようと思います。「TechFeed ProのUI/UX」というタイトルでやりたいと思います。 軽く自己紹介すると、株式会社テックフィードというところの社長をやってます。「TechFeed Pro」というプロダクトがあるんですけれども、そのプロダクトマネージャーとかUXデザイナーとかもやっています。なので、ビジネスからUXデザイン……僕、開発者でもあるので、そうい

                                                          TechFeed ProのPM兼UXデザイナーが語る、PWAのデメリット・メリット
                                                        • “触り心地”がいいUIとはなにか PWA時代のWebエンジニア/UIデザイナーが思う、直感的な道具に必要な4つの性質

                                                          関心が高まりつつあるPWA(Progressive Web Apps)についての技術・情報交換の場である「PWA Night」。Vol.14の今回はUI/UXがテーマです。「さわり心地のよいウェブを考える」というテーマで登壇したWebエンジニアの竹本雄貴氏は、直接操作を感じさせる、触り心地のよいUIとは何かについて共有しました。 Webエンジニア/UIデザイナーとしてPWAに感じる可能性 竹本雄貴氏(以下、竹本):今回オンライン開催ということで、PWA Night 14回目のUI/UX回で話させてもらいます、竹本と申します。今YouTube Liveの画面開いてますけど、100名ぐらいの方がオンラインになっていて、けっこう緊張しているし、今までやったことのない取り組みなので、かなり不安のなかやっています。 前回の「PWA Night CONFERENCE」のLT会では「手触りのよいウェブを

                                                            “触り心地”がいいUIとはなにか PWA時代のWebエンジニア/UIデザイナーが思う、直感的な道具に必要な4つの性質
                                                          • React Native for Web + TypeScript + Firebase + PWAを調べたのでまとめておく - gibachan's blog

                                                            動機 きっかけはこの記事。ちょっと前にこれを読んで、 「モバイルネイティブアプリに慣れた開発者が、React Native for Webを利用することで手軽にWebアプリ開発できないか?」と思ってたので調べてみました。 iOSについて言えばSwiftUI登場後、宣言的にUIを構築するということが自然となり、Webアプリの各種FW(Reactなど)との距離感が縮まっていること。前述の記事にあるように、ネイティブ開発で馴染みのあるコンポーネントをReact Nativeを経由してWebの世界に持っていけるなら、Webアプリ開発の敷居が下げられるんじゃないかと思って調べてみました。 先に結論 React Native for Webを使って簡単なTODOアプリを作ってみました。 一応Firebase Hostingに置いてPWAとしてモバイルにインストールするところまで試しました。 githu

                                                              React Native for Web + TypeScript + Firebase + PWAを調べたのでまとめておく - gibachan's blog
                                                            • 「サルでもわかるGit入門」がPWAに対応しました | 株式会社ヌーラボ(Nulab inc.)

                                                              サルでもわかるGit入門はサル先生のGit入門に改名しました。 サルでもわかるGit入門がPWAに対応しました。 iOSやAndroidのスマートフォンのホーム画面にサルでもわかるGit入門を追加することでネイティブアプリのように起動し、ブラウザよりも高速に閲覧することが可能になります。 こんにちは。 ヌーラボのマーケティング課所属のレオです。 私はヌーラボが運営するサイトやCacooの開発をサポートしたりとヌーラボ内を横断しているフロントエンドエンジニアです。 今回はレガシーな構成からNuxt.jsにリプレイスしたサルでもわかるGit入門を今更ながらPWAに対応させたので、かんたんにご紹介します。 そもそもPWAとは PWAとはProgressive Web Apps(プログレッシブウェブアプリ)の略です。 通常のWebサイト / Webアプリはブラウザ上で動作しますが、PWAはブラウザ

                                                                「サルでもわかるGit入門」がPWAに対応しました | 株式会社ヌーラボ(Nulab inc.)
                                                              • 各種WebAPIの簡単な使い方と、組み合わせで実現する新たな体験・可能性を考える

                                                                2020年2月1日、「PWA Night CONFERENCE 2020」が開催されました。Web体験を進化させる、新しいWeb開発コンセプト「PWA」をテーマに、Web開発に携わるエンジニアたちが集まった本イベント。プレゼンテーション「Webでできる体験を考える会」に登壇したLINE株式会社の折原レオナルド賢氏は、既存のWebAPIを用いてできることや実現できるユーザー体験について、自身の経験や今回の発表に際して行った検証結果を用いて紹介しました。講演資料はこちら Webでできる体験を考える 折原レオナルド賢氏:それでは「Webでできる体験を考える会」ということで始めたいと思います。去年の今頃、こんな記事を書かせていただきました。 もしかしたらこれによって今回呼んでもらったのかなと思いますので、この話の内容も含めていろいろ「Web APIってどういうもの?」という発表をしていきたいと

                                                                  各種WebAPIの簡単な使い方と、組み合わせで実現する新たな体験・可能性を考える
                                                                • Release Notes for Safari Technology Preview 💯

                                                                  Safari Technology Preview Release 100 is now available for download for macOS Catalina and macOS Mojave. If you already have Safari Technology Preview installed, you can update in the Software Update pane of System Preferences on macOS. This release covers WebKit revisions 254696-255473. Web Inspector Added links to Web Inspector Reference documentation (r254730) Renamed the Canvas Tab to be the G

                                                                  • JavaScriptエンジンの仕組みをGIFアニメで分かりやすく解説

                                                                    Node.jsおよびChromiumベースのブラウザで使用されるJavaScriptエンジンの仕組みについてGIFアニメーションで分かりやすく解説された記事を紹介します。 🚀⚙️ JavaScript Visualized: the JavaScript Engine by Lydia Hallie 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 JavaScriptを視覚的に解説: JavaScriptエンジン JavaScriptはクールです(私はそう思います)が、あなたが書いたコードをマシンが実際に理解するにはどうすればいいのでしょうか。JavaScriptデベロッパーは通常、コンパイラを自分で扱う必要はありません。しかし、JavaScriptエンジンの仕組みを理解し、人に優しいJavaScriptコードをどのように処理

                                                                      JavaScriptエンジンの仕組みをGIFアニメで分かりやすく解説
                                                                    • マイクロソフト、「Blazor WebAssembly」正式版を5月にリリース。BlazorでPWAやデスクトップアプリも開発へ

                                                                      マイクロソフト、「Blazor WebAssembly」正式版を5月にリリース。BlazorでPWAやデスクトップアプリも開発へ マイクロソフトは1月14日(日本時間1月15日未明)にオンラインインベント「.NET Conf Focus on Blazor」を開催、同社が開発中のWebアプリケーションフレームワーク「Blazor」の最新動向と今後について明らかにしました。 Blazorは、C#と.NET Coreを用いてWebアプリケーションの開発を可能にするフレームワークです。JavaScriptを用いず、C#によるプログラミングでSPA(Single Page Application)のWebアプリケーションを開発できるため、.NETの知識や経験をWebアプリケーションに活かせると同時に、Visual StudioなどC#に対応した豊富な開発ツールによる開発生産性の向上を期待できるとい

                                                                        マイクロソフト、「Blazor WebAssembly」正式版を5月にリリース。BlazorでPWAやデスクトップアプリも開発へ
                                                                      • Vue.jsで作ったゲームをインストール可能(PWA)にしてGitHub Pagesで公開してみた | DevelopersIO

                                                                        はじめに おはようございます、加藤です。年末年始は実家の北海道に帰省するつもりだったのですが、見事にインフルエンザB型にかかってしまって、急遽キャンセルしました... 予定が全て吹っ飛んで暇になったので、年末年始は下記の教材を使ってVue.jsを勉強していました。 超Vue JS 2 入門 完全パック - もう他の教材は買わなくてOK! (Vue Router, Vuex含む) まだ7割しか終わっていないですが、せっかくなので簡単なゲームをインストール可能な状態で作って公開してみました。 新規プロジェクトの場合 Vue CLIで新規プロジェクトを作成する際に、指定する事でPWAとしてプロジェクトをセットアップできます。 npx -p @vue/cli vue create new-project # Manually select features を選択する Vue CLI v4.1.2

                                                                          Vue.jsで作ったゲームをインストール可能(PWA)にしてGitHub Pagesで公開してみた | DevelopersIO
                                                                        • 今後クラウドゲーミングを支えるであろうPWA技術|おりばー|note

                                                                          この記事が気に入ったら、サポートをしてみませんか? 気軽にクリエイターの支援と、記事のオススメができます!

                                                                            今後クラウドゲーミングを支えるであろうPWA技術|おりばー|note
                                                                          • ネイティブアプリ風Webアプリ「PWA」を実現する3つの技術 | さくらのナレッジ

                                                                            数年前からGoogleは「Progressive Web Apps」(PWA)という技術を提唱してその普及を推進している。PWAはネイティブアプリケーションのように動作するWebアプリケーションであり、オフラインでも動作し、プッシュ通知などの機能も利用できる。本記事ではこのPWAの中核となる技術の解説と、PWAに対応したWebアプリケーションを作成するための流れを紹介する。 「Progressive Web Apps」(PWA)とは 一昔前は「ネットサービス」といえばPCのWebブラウザからアクセスして利用するものがほとんどだった。しかし、スマートフォンが普及した昨今では多くのサービスがスマートフォン向けの対応を行っている。今ではPCからのアクセスよりもスマートフォンからのアクセスのほうが多いサービスは珍しくなく、スマートフォン向けの専用アプリを用意しているサービスも多い。 とはいえ、ネイ

                                                                              ネイティブアプリ風Webアプリ「PWA」を実現する3つの技術 | さくらのナレッジ
                                                                            • Firebase + Google Spreadsheet + Glide でサーバレスな それっぽいWebサービスを作った話【HAPPY SEEDING / 後編】 - okadato の雑記帳

                                                                              この記事は Firebase アドベントカレンダー 2019 18日目の記事です。 Firebase を活用して個人開発した結婚式の写真管理Webサービスのアーキテクチャなどについて書きます! さて前回記事になりますが、サービス自体の概要と開発の経緯についてまとめました。 今回は技術的背景の解説ということで、いきなりですが全体構成図をバーンと! 全体構成図バーン! 技術的には Firebase + Google Spreadsheet + Glide(というSaaS。詳細は後述) で構成しています。 以下では各要素を分類し、それぞれの役割について解説していきます。 Firebase部分 使用しているのは Firebase Hosting Cloud Functions Cloud Storage for Firebase の3つです(写真送信画面での手間を極力省くため、認証は噛ませていませ

                                                                                Firebase + Google Spreadsheet + Glide でサーバレスな それっぽいWebサービスを作った話【HAPPY SEEDING / 後編】 - okadato の雑記帳
                                                                              • Nuxt.js+Push7でPWAアプリとプッシュ通知を実装する - Qiita

                                                                                Nuxt.jsを使うと、比較的簡単にPWA対応のサイトを作ることができます。 ただ、PWA対応と一言で言っても、PWAが指す機能は様々なものがあります。 オフラインキャッシュ ホームスクリーン追加 プッシュ通知 カメラ 決済機能 etc iOSではAndroidと比べてPWAの対応が遅く、キャッシュ以外はあまり使うことがなかったのですが、 最近iPhoneからPixel4に機種変更したこともあり、手元の環境で色々とPWAを試すことができるようになったので、 色々実装して遊んでみました。 今回は、比較的簡単に実装ができる、 オフラインキャッシュ ホームスクリーン追加 プッシュ通知 をNuxt.jsとPush7というサービスを使って、実装してみたいと思います。 なお、今回作成したサンプルは以下のURLにアップしています。 https://nuxtpwa.netlify.com/ https:/

                                                                                  Nuxt.js+Push7でPWAアプリとプッシュ通知を実装する - Qiita
                                                                                • 🚀⚙️ JavaScript Visualized: the JavaScript Engine

                                                                                  JavaScript is cool (don't @ me), but how can a machine actually understand the code you've written? As JavaScript devs, we usually don't have to deal with compilers ourselves. However, it's definitely good to know the basics of the JavaScript engine and see how it handles our human-friendly JS code, and turns it into something machines understand! 🥳 | Note: This post is mainly based on the V8 eng

                                                                                    🚀⚙️ JavaScript Visualized: the JavaScript Engine