蕭又寧 的部落格

[S18_WebFund] Lab7 資工三乙 404262389 蕭又寧

Lab7:
1.截圖

Lab7 說明:

使用Google+ oAuth來做網站登入

第一二張圖為網頁使用Google登入的頁面

第三張圖是用Google+ oAuth登入取得用戶資料並存入資料庫的畫面。

第四張是使用Laravel 的 Socialite 來實作 Google+ oAuth,並將登入資料存入資料庫的程式碼。

2. 心得:

[S18_WebFund] Lab5 資工三乙 404262389 蕭又寧

1.截圖

2.說明功能

(1.) 刪除卡片功能(若卡片不存在會出現錯誤提醒)

(2.) 可離線觀看

(3.) 更改背景顏色

3.心得

這次時間特別勁湊(也可能對單元特別不熟悉),雖然很努力的去了解、測試與編寫程式碼,也對他有基本的概念,不過還是覺得沒來得及很深入的了解。不過第一次接觸到PWA覺得非常驚訝居然有這樣的技術,響應式用戶介面與離線功能真的很強大讓我之後還會想要再好好的研究。其實希望這次的作業可以動態的讀取已有的卡片,並呈現在刪除的頁面上。這之後有空也會再改進的。

[S18_WebFund] Lab5 資工三乙 404262389 蕭又寧

1.截圖

2.說明功能

(1.) 刪除卡片功能

(2.) 可離線觀看

(3.) 更改背景顏色

3.心得

這次時間特別勁湊(也可能對單元特別不熟悉),雖然很努力的去了解、測試與編寫程式碼,也對他有基本的概念,不過還是覺得沒來得及很深入的了解。不過第一次接觸到PWA覺得非常驚訝居然有這樣的技術,響應式用戶介面與離線功能真的很強大讓我之後還會想要再好好的研究。其實希望這次的作業可以動態的讀取已有的卡片,並呈現在刪除的頁面上。這之後有空也會再改進的。

[S18_WebFund] Lab4 資工三乙404262389 蕭又寧

第一部分 JSON APIs, Ajax, jQuery tutorial on FreeCodeCamp:
1.截圖

2.心得

以前有碰過一點JQuery,所以上手比較容易一些。而覺得 Json Api and Ajax 這個很好玩,用jQuery去取得 Json 格式的資料,再來做處理、佈置網頁或其他用途。 雖然實作上還沒操作過,不過應該滿有用的。

第二部分 Github personal page :
1.網址:http://monica-shiao.github.io/

2.說明新增部分:

[S18_WebFund] Lab3 資工三乙 404262389 蕭又寧

第一部分 Wireshark :

1.截圖

(1)輔大信箱(Get)

(2)輔大成績、排名查詢系統(Post)

2.文字說明

可見第一張“輔大信箱”是以 Get 形式傳送資料,而登入“輔大成績、排名查詢系統” 是以 Post 傳送資料。

操作步驟:

    1. 打開 Wireshark,選擇網路( 家裡 Wifi )

    2. 在目標網頁上登入

    3. Wireshark上按下暫停,搜尋關鍵字" login " or " post "

    4. 找到 Login 封包後觀察是以什麼形式做傳送

[S18_WebFund] Lab2 資工三乙 404262389 蕭又寧

1.網頁網址

https://monica-shiao.github.io

2.心得

製作路程有點艱辛QQ

頁面呈現上,想做出來的跟做出來的總是有差距,要一直花時間查資料才會逐漸靠近心目中的樣子。
經過這次的學習對css的各種用法有更深刻的認識與體會。

不過總體來說,雖然花了很多時間做得有點頭痛,但看看成品還是覺得值得的啦!也學到很多,開始對網頁有初步的概念了。

也更會操作github一些......I guess Orz (遇到了奇怪的bug QQ)