專案開發心得－Simple Twitter

隨著JavaScript課程的學習的最後階段， Twitter專案不只考驗平時課程所學的技能，也讓我們提前預習在職場上與人合作完成專案的經驗。

完全沒有和人一起完成關於寫程式經驗的我，很幸運得到兩位神隊友﹘Rossi和雅婷。她們對於寫程式的能力還是比我優秀很多。

在這次專案中，我負責從所有人的空閒時間，找出可以共同開會的時間和做最後檢查的時間。任務分配上，我被分配到使用者個人頁面的所有功能。關於整個專案過程的貢獻度，我可以說是只有1％。也就是記得交sprint 1 ~ 3的作業。一開始在clone專案時我就開始錯誤連連，我過去習慣用Download ZIP的方式來clone專案，沒想到這次要用複製網址的方式在終端機上用git clone方式下載專案，遠端如果有更新我才能接受到訊息。過去不需要和人協作，也沒有注意到這個細節。幸好隊友Rossi和雅婷熱心的幫我解決第一個難關我才能繼續往下走。當我很開心地要開始寫第一個功能時，我又碰上另一個難關﹘使用者點擊個人網頁時，畫面要跳出使用者可以看見自己所有貼文的頁面。剛開始我設計的路由「router.get('/users/:id/tweets', authenticated, userController.getUser)」，是連接不到使用者個人頁面的畫面。路由反而設成「router.get('/users/:id', authenticated, userController.getUser)」，是可以連接到使用者個人頁面的畫面。

嘗試反覆看課程的教案和作業，想找出有沒有相似的地方？有依照助教的指示確認看一下是不是符合 users/self這個模板的需求，但還是無解。後來我嘗試將nav-item的連結改成<a href="/users/{{user.id}.tweets}">，終於跑出畫面。當我要繼續設計畫面的時候，卻發現使用者頁面推文沒出來的問題。尋求助教的解答是要我檢查db是不是沒資料還是 query 有問題，但我檢查完之後改補的缺失也補了，還是沒用。當我回去查看教案之後嘗試將{{#each tweets}}改成{{#each user.Tweets}}之後，可以秀出推特文。接著我又有新的問題產生，沒有秀出使用者的名字和e-mil這個細節；於是我開始向隊友提出求救。起初隊友要我先檢查controller的地方是否有將tweet跟user用include方式做連結，並參考他做getTweets的部分，應該有類似的地方。但結果還是失敗，於是她提議往comment上一層user去找，改用../user.name 試試看，也就是將this.User.name改成../user.name，結果真的成功了。於是我上網查詢了「../user.name 」和 「this.user.name」的差別。

在模板中，`../user.name` 和 `this.user.name` 有不同的意義和用法。

「../user.name」：

 ※「../」 表示回到模板中上一層上下文（context）。

 ※ 這意味著你正在訪問父級上下文的屬性。

 ※ 在這個情況下，「../user.name」 表示你希望訪問父級上下文中的 「user.name」 屬性。

「this.user.name」：

 ※ 「this」 代表當前的上下文。

  ※ 這意味著你正在訪問當前上下文中的 `user.name` 屬性。

  ※ 通常，「this」 是可選的，你可以直接訪問 `user.name` 屬性，因為模板引擎已經處於 `user` 上下文中。

要選擇使用哪一種取決於你的需求和模板引擎的設置。通常，如果你需要訪問父級上下文中的變數或屬性，可以使用 「../」否則你可以直接使用 「this」 或省略它，以訪問當前上下文中的變數或屬性。

當問題解決之後又有新的問題產生，將程式碼更新到最新之後要進行合併發PR，出現合併異常發送PR需求給確認者，一直出現Alarm導致PR發送失敗。為了找出問題，我只能不斷地確認和合併Alarm訊息找原因。更慘的是，原本設計好的可以連接使用者個人頁面這個功能，不明原因又連結不到了。我反覆的察看程式碼並向助教請教。即使助教給了一些建議，比如說AC 教材有提到 的postman用這個可以打 request 到妳本地起的 service，這樣就能知道 API 有沒有錯誤？這個問題到現在還沒有解決，也影響了專案的結果被評斷是為 fail。

兩個星期的專案過程中碰到無數的難題，有的已經順利解決、有的還在努力找答案。對我來說即使專案的結果被評斷是為 fail，我還是會繼續努力學習下去把剩下的作業完成。