【前言】
這篇文章要來分析我負責的整個項目，並且準備所有我需要的東西！

【（使用者看見的）前端與（後方運作的）後端】

1. 使用者會看見登入錢包按鈕（按鈕應該要有一些特效）
   • 按下按鈕後要連到 MetaMask 系統
2. 使用者點擊按鈕後出現 Loading 特效，同時跳出 Metamask 登入及連動同意
   • 同意後，要從 MetaMask 得到當前登入者的以太坊地址
3. 使用者同意後出現登入介面，讓其輸入欲登入的角色編號
   • 得到欲登入的角色編號後，去後方資料庫查詢此地址是否真的擁有此 NFT
     // 資料庫建構的部分由其他夥伴負責，這邊我負責檢查 Tokens 的持有地址
4. 成功登入後的畫面
   // 網頁互動的部分由其他夥伴負責，這邊我負責顯示登入成功 or 失敗

【參考資料】

BAYC Login Bathroom

【分析需求】
首先呢，有前端還有動畫特效，好，我可能要會使用或讀懂前端三巨頭。
網站連動到 MetaMask，好，我可能要用 metamask.io, React.js。
查詢並檢驗 NFT 持有者的地址，好，我可能會用到 opensea.js, ethers.js, web3。

其實規劃的當下並沒有很確定未來自己會用到什麼，所以就是瘋狂上網查資料把可能用的或可以用到的全部都集合起來，再慢慢細看哪個東西可以在實作上幫助我。

// 跟各位分享一個 Youtube 影片，我現在的情況真的很像這樣...
// C hashtag?

經過我的「研究」之後發現，不管是 React.js, Solidity 等我很有可能需要具備的東西，都是跟 HTML + CSS + JavaScript 息息相關的（至少長的很像），所以管他什麼以太坊錢包連動還是檢查該地址持有的 Tokens，反正前端三巨頭先學會就對了！到時候如果真的做不出來至少我的按鈕還會發光！（錯誤觀念）

幸虧前端三巨頭的環境建置非常容易，Visual Code 打開然後 Extensions 給他用下去就好！這邊就不細講了，網路上應該很多資源講得比我更精準！

【MetaMask】
這邊超級精簡地介紹一下什麼是 MetaMask。 它是一款支援以太鏈上加密貨幣的虛擬錢包，可以歸類成一種私鑰管理器，並不會儲存大家的錢包資料、密碼、私鑰。
支援平台：Browser Extension, Mobile app
支援功能：可與 DApp 互動、能保存 ERC-20 發行的幣種（只能顯示 ETH）
支援語言：English
官方網站：metamask.io

【小結】
雖然還沒有開始應對需要具備的知識，但有對於 Project 分析的過程以及不斷的與團隊成員 Meeting 後，真的有對自己該做什麼事情有很大的了解。尤其是學習計畫的排程，這讓我知道此時此刻自己應該往哪個方向去準備，還有我剩下多少時間、需要多少時間。

過去在學校學習的過程可能都很強調個人能力，像是 Coding 要多厲害又多厲害，還是自己能考多高分、羨慕別人考多高分。但在這樣一個團隊合作的 Project 之中，多方溝通進而了解需求並且準確地實踐是最重要的。因為如果沒有確認好自己該做什麼，即便成品多麼 Fancy 也是要打掉重做的！