[S18_WearComp] PWA Lab 醫資二 405570173 林芸妗

Group content visibility: 
Use group defaults
Groups audience: 

1. 截圖(有網址的話就附上)

 

2. 說明功能 或 說明與範例不同的地方

功能:

在離線的情況下,仍能顯示近7天的天氣狀況,在完善的狀態下,能提供最即時的天氣資訊。

可以透過右上方按鈕新增城市的氣候狀況及重整頁面,並保留已經新增的項目。

隨著設備的不同,響應式用戶介面使得畫面就算大小改變仍能顯示完整資訊。

 

與範例不同之處:

更改了title及透過HTML和CSS做了一些美化(顏色的調整),並將圖片換成其他圖示,且增加新的地點(台北、東京)之天氣。

另外,在畫面上方增加跑馬燈,作用為提醒使用者將有一場大雨,並記得攜帶雨具。

 

3. 心得

按照官方的教學範例逐步完成整個PWA,雖然並沒有完全理解每一個步驟,但還是盡力去消化吸收。這次因為有一些功能還不是很熟悉,所以仍把重點著重在以往所學的美化的部分,覺得有新學到東西也有複習到一些語法,不過仍希望未來能再繼續嘗試,並強化功能部份的實作,做出一個符合自己期待的PWA。