第一份前端工作經驗分享

距離最後一天上班已經過了一個禮拜，我打算寫一篇文章記錄這份五個月的工作。

先描述一下一個禮拜不工作的人的身體上的改變。

1. 不再胃痛拉肚子
2. 不再習慣係摳弄臉上的痘疤
3. 每天睡滿八小時
4. 完成兩個side project
5. 看完原子習慣workbook(之後會分享）

可見這份工作帶給我多大的精神壓力，也讓我知道自己的抗壓能力需要加強？

這份工作是怎麼來的呢？因為去年我應徵一份工讀生的工作，主要工作內容是協助人機測試的工作以及處理客訴品等工作。因為公司是一家做血糖管理的公司，所以客訴品通常會有客戶的血液或是皮膚組織。

而我充分利用這份工讀生的空閒時間，在公司大量閱讀JS跟React相關的書籍，還有TS等程式語言相關的書籍，並有幸在九月初左右看到該公司有開出React相關職缺，我就應徵了，也順利錄取，薪水是35000。

該職位主要負責一個ＣＭＳ系統，該系統會使用到的人有公司同事以及客戶，我在工作期間只有一些小功能像是報告、通知ＵＩ跟ＡＰＩ串接新增等開發。

主要工作是獨立重構兩個專案為Vite+react版本的網站。

第一個是大概花三個月完成，具體是把原生ＪＳ專案重構成React版的專案，遇到的困難點是對於ＡＰＩ串接、圖表的繪製、S3 檔案透過ＡＰＩ資料取得處理等等。

因為有ＡＩ一起協作再加上有舊專案的程式碼可以直接看，所以就蠻順利的處理完成。在我離職前也把舊網域取代成我重構的新網站了，真的蠻感動的，因為這是第一次我自己做的東西有被使用者回饋（問題回報）以及正式上架。

第二個是在離職前處理一半的ＣＭＳ系統，ＡＩ的數量跟專案複雜程度是第一個不能相比的，再加上這個舊專案是用Java寫的，遇到最大的困難是使用IntelliJ IDEA將專案在本地端運作起來，真的是讓我學了一課呢！也感謝前端跟後端同事凱瑞。

主要重構了十四個頁面，有些單一頁面串接的ＡＰＩ就有十幾個，我才知道原來這些前端資料或功能可以（需要）透過ＡＰＩ呈現，像是：

1. 下拉選單資料
2. 初始載入的表單資料
3. 下拉選單的篩選資料會連動表單資料顯示
4. 新增/儲存/編輯/刪除資料
5. 匯入/匯出資料

最讓我印象深刻的是原來新增不需要有新增的ＡＰＩ，只需要有儲存的ＡＰＩ就可以包辦新增跟編輯這兩種模式的功能，只要判對是否為新增行為，將資料傳入或是不傳入，並在儲存時再次判斷是否為新增或編輯，透過是否有現有ＩＤ判斷。

我必須先承認錯誤，因為這個經驗在我拜託後端幫我新增一支新增ＡＰＩ之後我才get，其實沒有必要新增，但是因為已經新增了，就新增了吧（汗顏

再來是對於Java有蠻深度的認識的，Java跟ＪＳ跟的不像是狗跟熱狗的關係，更像是嚴謹的德國工藝家跟蘇格蘭的街頭藝人表達程式碼的差異。

不過因為離職後開始重學Nodejs，發現用ＴＳ寫後端也比Java更簡單（應該

也因此發現Java的後端ＡＰＩ沒有按照REST ful API標準去命名，這在我2023年看那個系列的鐵人賽文章時完全無感，代表自己真的有所成長了呢！

因為這個重構專案真的超級多支ＡＰＩ，所以我對於『串接ＡＰＩ』的行為真的是蠻多深刻的體會的，包含各種400、401、CORS err等等錯誤，都會因為header、params、payload或是body給錯，而造成串接錯誤，好笑的是我一開始會聽信ＡＩ的幻覺，以為是後端的問題，但是其實在正式環境能正常運作的功能，我都會讓ＡＩ再確認錯誤到底是哪裡造成的，以避免造成笑話。

串接ＡＰＩ的錯誤也會被資料庫影響，因為這個專案讓我重新學習SQL，公司使用MYSQL workBench，而我有遇過一次錯誤，是因為資料庫沒有資料，所以後端回傳result：0是正確的結果（但放在另一種情境時反而可能需要透過在後端新增日誌，去找出回傳result：0的原因）。

還有一次是我回報正式環境上的錯誤給後端，過一陣子，後端修好之後，我也在本地pull修改內容後，嘗試串接結果失敗，找找找，才發現是資料庫沒有跟後端同步，簡單來說，後端新增ＡＰＩ欄位，但是因為資料庫沒有新增的欄位，所以前端會串接失敗。

這真的又讓我學到一課！

直到做了第一份前端工作，我才明白我不甘自己只會前端，因為我很享受同時看前端、後端以及資料庫去找出問題點的那個過程。所以我會以全端工程師為努力的目標，所以在待業期，我會把對於後端(Nodejs,express)、雲端(Docker、AWS)、手機端(React Native)、電腦應用程式端(Electron)、資安端的技能數再補齊（期望…

我也是第一次使用協作軟體Ｊira，在上面開立issue，給自己，每日下班前填寫log work，新增工時記錄，並在issue完成後移動到ＭＲ以及後續測試完成移動到ＤＯＮＥ，這些過程我覺得很滿意，因為這行為具體化了我工作的成果！

使用了gitLab，一款跟gitHub超級超級相似的軟體，在上面最多的動作是發ＭＲ給我的同事，我一開始還會選錯環境（哭，這就跟git flow的熟悉程度有關了。

工作上的基本流程：

1. 本地端同步遠端（git pull
2. 在本地端dev開新分支，開始開發
3. 結束後使用SourceTree將修改push到dev
4. 到gitlab發ＭＲ
5. 等待同事合併ＭＲ
6. ＭＲ被合併之後，確認dev東西正常，就繼續下一個issue開發
7. 本地端dev　git pull同步
8. 繼續在dev開新分支

以上的流程我真的是花了一陣的才熟悉（哭，因為自己做side project一直都是在main上直接

1. git add .
2. git commit
3. git push

結束

偶爾會有幾次需要從dev推到master，一樣直接在gitLab上點擊ＭＲ，新增，然後環境要注意並新增修改內容

也有幾次是直接在master開分支修改，直接跳過dev，但是這會導致master跟dev不同步耶

再來說點第一次進大公司的體驗

1. 員工餐廳好好吃，雖然我離職的那個月換廠商變超級難吃，員工餐廳在七樓，風景超美，可以看到捷運線跟台鐵線
2. 福利給好給滿，在期間收到：年終、中秋禮金、生日禮金、尾牙抽獎、開工禮金等等
3. 識別證超酷，我天天帶，不過也好幾次忘記帶而被卡在一個位置等待
4. 公司停車場會經過很多綠色植物，一開始很不習慣，但是之後覺得看的蠻紓壓了

也因為工作開始用Mac Book pro，所以賣掉win筆電，買了Mac mini跟多一台外接螢幕，開始從零開始使用macOS系統，雖然對於系統的使用還有待加強，但是我在離職前也買了機械鍵盤跟觸控板希望可以加強我的開發效率。

觸控板必須特別說名購買原因，MAC的觸控板是ASUS vivobook不能相比的，而我在工作電腦上使用Heptabase的使用體驗超級絲滑，相比MX Master 3S，所以我買了巧控版。

現在想來真的覺得自己很幸運能在這間公司工作，因為當初工讀的契約要到期前，面試了五家都無聲卡，直到面試這家公司時，老實說表現沒有到很完善，但是還是有幸被錄取，而面試官們之後也成為我的凱瑞同事們。

我一直以為自己會先進入博奕公司，畢竟人就在台中嘛！但是這讓我開始覺得，也許之後進入的公司，都不要是博奕，因為我想要開發對人類有幫助的產品阿！