方格子開發誌 #12｜PWA 給你仿 APP 的無縫閱讀體驗 ft. 豆皮壽司來三盤
閱讀時間約 3 分鐘
又見面了！上次和大家分享新功能，又過了近一個月，本來想說：「就這麼拖稿下去，應該也不會被發現吧？」
但是，看到冨樫義博老師受腰痛折磨，仍每天在 twitter 上更新進度，如此不屈不撓的精神激勵了獅獅的上進心 (｡･ω･｡)（還有羞恥心）。
因此，今天要來向大家分享新功能，它叫做 —— 漸進式網頁應用程式（PWA, Progressive Web Application）！
PWA? Is that good to eat?
漸進式 ⋯⋯ 網頁 ⋯⋯ 啥？
火星語我們就先不說了，有興趣的格友們，我們下集做個影片給大家介紹介紹（並不會）。簡而言之，PWA 提供了許多功能，讓我們的「網頁」瀏覽體驗變得更接近「原生 APP」。
比方說，以前要來方格子看文章，都要先經過三個步驟：
- 打開手機裡的網頁瀏覽器 APP
- 點擊書籤裡面的「方格子」
- 一邊想晚餐要吃什麼，一邊等方格子出現在你面前
是不是很麻煩呢？
從今以後，這些冗長的步驟將從你的人生中消失！為您隆重介紹 —— 加入主畫面功能（好不帥氣的名字 ಥ_ಥ）。
iOS Safari 步驟教學：走捷徑只要兩秒鐘～ ♫
那麼，我們就馬上來看看新功能怎麼運作吧！
1. 打開方格子，點擊底部的這個按鈕
2. 點選「加入主畫面」
3. 按下「新增」
4. 回到主畫面點擊捷徑：享受更乾淨的閱讀介面
Android Chrome 步驟教學：一樣只要兩秒鐘～ ♫
1. 打開方格子，點擊右上角的這個按鈕
2. 點選「加到主畫面」
3. 按下「新增」
4. 回到主畫面點擊捷徑：享受更乾淨的閱讀介面
未來無論是通勤時、閒暇時、躺在床上耍廢時、遠距開會時，只要簡單動動一根手指，馬上就可以遁入方格子，享受閱讀與文字！
其實，除了捷徑之外，PWA 還有其他強大又實用的功能，還在獅獅的秘密實驗室試驗中，看看這些新玩意兒是否能讓方格子變得更棒。格友們，是不是也和我們一樣期待呢 (●°u°●) 。
題外話：稻荷壽司 No.1
天氣變熱後，壽司店成了最常造訪的餐廳，我吃壽司只有一個原則，那就是稻荷壽司點爆。
其他朋友都很不解，同樣的價格可以吃到鮭魚、鮪魚或海貝，為什麼要點無聊的豆皮？還點三盤？
豆皮才不無聊，你才無聊 (`Д´)，吸飽湯汁、微蘸醬油、鹹鹹甜甜的豆皮壽司是最棒的！
格友們的必點壽司又是什麼呢？
那麼，今天的開發誌就到這裡囉，希望下次見面時，我們已經看完新的獵人了（可以吧 ⋯⋯ 冨樫老師？），下次見！
為什麼會看到廣告
284.4K會員
3.0K內容數
哈囉，歡迎來到方格子 vocus 的官方沙龍！
在這裡你可以參與方格子 vocus 的發展旅程，接受到所有關於 vocus 的最新動態，包含平台重大功能更新、活動消息、各房間發佈的最新內容，甚至是徵才資訊等等，現在就按下「加入」，與 vocus 一起展開精彩的創作冒險吧！
留言0
查看全部
你可能也想看
Google News 追蹤
最近我開始試用方格子這個平台，發現方格子這個平台不錯的優點，想跟大家分享
在方格子上發文三篇文章後，平台會寄一封信給你，跟你說有哪些變現方式：
1. 贊助，目前暫停使用
2. 廣告分潤計畫，透過廣告收入來補貼創作者的方案
3. 沙龍，一個付費內容的計畫，讀者可以付費訂閱你的專屬內容，
大家想過方格子的創辦人對方格子的想法嗎? 又是如何解讀這個的平台呢?
大家又知道方格子有跟web3做結合嗎? 一起來聽聽看寶博跟方格子創辦人怎麼說吧!
近期方格子更新了「關於頁面全新升級」功能，格友們使用了嗎？
為搭配這次介面的更新，方格子推出首次的沙龍社群活動，讓你在社群上串連新格友們加入你的沙龍，完成以下簡單的步驟，就有機會獲得方格子的專屬曝光推薦，來看看怎麼參加活動吧～
此篇主要紀錄PWA開發過程心得，內容為PWA有什麼特色，為何React可以使PWA成為接近App的操作體驗，以概念敘述與簡單開發流程紀錄來介紹PWA。
什麼是漸進式網路應用程式(PWA)
PWA擁有傳統網頁和移動應用的優點，使網頁應用程序可以像應用程序一樣運行，提供更加優越的用戶體驗
可能包含敏感內容
什麼事方格子？
https://vocus.cc/
想不到，小弟的網頁直接擺第一頁，值得留念，截圖！
讀者請直接加入，我來教你如何無風險套利！賺大錢！一起加油，每天寫文章給你看
什麼是出版業？就是書本、報紙、竹子、紙張的組合。現在的人不看書了。根本都在滑手機，沒天裹著無所事事的一天？有夠
大家在討論瀏覽量的時候，都會提到方格子首頁的通透度的問題，在這個問題上提了很多次，但是仔細看方格子的首頁，其實沒有太大的問題，如果你是會員的話。首頁基本上是對你開放的，你要怎麼瀏覽都可以，對會員這個閱讀者來講，他是感到方便自在的。可以往下拉，看推薦的文章。也可以直接搜尋，他想要找的搜尋。也可以透過探
方格子沙龍初體驗：向大家報告最近我使用方格子在以下兩方面的改變，（1）閱讀格友的文章和與格友互動，及（2）準備和發放自己的文章。這些體驗讓我反思如何分配時間並適應這新的互動模式。
最近我開始試用方格子這個平台，發現方格子這個平台不錯的優點，想跟大家分享
在方格子上發文三篇文章後，平台會寄一封信給你，跟你說有哪些變現方式：
1. 贊助，目前暫停使用
2. 廣告分潤計畫，透過廣告收入來補貼創作者的方案
3. 沙龍，一個付費內容的計畫，讀者可以付費訂閱你的專屬內容，
大家想過方格子的創辦人對方格子的想法嗎? 又是如何解讀這個的平台呢?
大家又知道方格子有跟web3做結合嗎? 一起來聽聽看寶博跟方格子創辦人怎麼說吧!
近期方格子更新了「關於頁面全新升級」功能，格友們使用了嗎？
為搭配這次介面的更新，方格子推出首次的沙龍社群活動，讓你在社群上串連新格友們加入你的沙龍，完成以下簡單的步驟，就有機會獲得方格子的專屬曝光推薦，來看看怎麼參加活動吧～
此篇主要紀錄PWA開發過程心得，內容為PWA有什麼特色，為何React可以使PWA成為接近App的操作體驗，以概念敘述與簡單開發流程紀錄來介紹PWA。
什麼是漸進式網路應用程式(PWA)
PWA擁有傳統網頁和移動應用的優點，使網頁應用程序可以像應用程序一樣運行，提供更加優越的用戶體驗
可能包含敏感內容
什麼事方格子？
https://vocus.cc/
想不到，小弟的網頁直接擺第一頁，值得留念，截圖！
讀者請直接加入，我來教你如何無風險套利！賺大錢！一起加油，每天寫文章給你看
什麼是出版業？就是書本、報紙、竹子、紙張的組合。現在的人不看書了。根本都在滑手機，沒天裹著無所事事的一天？有夠
大家在討論瀏覽量的時候，都會提到方格子首頁的通透度的問題，在這個問題上提了很多次，但是仔細看方格子的首頁，其實沒有太大的問題，如果你是會員的話。首頁基本上是對你開放的，你要怎麼瀏覽都可以，對會員這個閱讀者來講，他是感到方便自在的。可以往下拉，看推薦的文章。也可以直接搜尋，他想要找的搜尋。也可以透過探
方格子沙龍初體驗：向大家報告最近我使用方格子在以下兩方面的改變，（1）閱讀格友的文章和與格友互動，及（2）準備和發放自己的文章。這些體驗讓我反思如何分配時間並適應這新的互動模式。