[心得] 2020 Dcard Web Frontend Intern 面試分享
未錄取，一面即結束。
背景
大學很混，私立轉國立學校為了準時畢業的學分分奴，
畢業前實習接觸到前端工程師這個領域，因為門檻相對比較低，
幻想自己有一天可以自由生活在工程與 UX 之間。
現實上，只要有上過 CS50 超過 1/3 就比我強，
*更新：後來找時間上過 CS50 ，有點誇大惹，資工系乖乖上課還是學比較多
「畢業後」任職於高雄沒什麼技術含量的小公司一年多一點，
離職前皆使用 Angular 7 / Rx.js / TypeScript 同套 Angular 生態系。
這邊特別標注一下「畢業後」，
也就是這份「實習」職缺是以有正職工作經驗的情況下申請的，
於 Cover latter、*直播互動、寫信詢問中都再三確認，
雖然結論是沒有錄取，但剛畢業/第一份工作時應該也可以試試。
*當時台灣 COVID-19 疫情爆發，許多活動轉變為線上活動。
Pre-test
Dcard 第一階似乎都是有慣例的出作業。
這次題目是：
使用 React 實作一個簡易版的 Dcard reader 網頁
並且還很貼心附上實作畫面，基本上就是要匯串接資料與實作
infinite-scroll, modal。
難度大概是大學有認真修網頁相關課程或是有買過任一線上課程並且完成實作，大概就可以寫得出來，估計不超過 5 — 10小時內可以完成。
值得一提的是，範例中有用到 Virtual scrolling, 也可以看看 react-window
主要是避免畫面上出現太多 dom 節點，
大家可以開 inspect ，當時沒碰過的東西，當下覺得蠻有趣的。
（不過這個不在題目需要的實作內容中）
註：做這個作業時大概剛碰 React 兩個月，就順便拿這個作業練習 React.js
一面
這邊主要條列有聊到的東西，
會列很完整是因為我想記錄自己回答狀況。
條列的不是確切問題，是和問題有關的技術（考點）。
自我介紹：
- 人數 , co-work
- 離職後學習的過程
- 我大概回答撰寫鐵人賽心得（沒有 follow-up） https://ithelp.ithome.com.tw/users/20120757/ironman/2708 - 作業架構有參考什麼？
- 這題我不確定要問什麼，我覺得小作業所以用 CRA + 練習 hook
- 好像沒有 context, redux ，只用 state 存資料
技術問題：
- 什麼是 git reset
$ git reset HEAD^ or $ git reset <SHA-1> - git cherry-pick
有大概聊一下為什麼會用到這個。 - git rebase / git merge
主要回答這分支是從哪裡生出來的 - 問前公司 work flow
- Cookie / LocalStorage
很常問的問題，回答時有刻意延伸到 Session，但對方沒有 follow-up - CORS / JSONP
這邊我花很久時間解釋 CORS，因為我當時回答似乎口誤
但我後來回想我自己回答沒錯，但對方聽到我口誤似乎就沒聽我回答講什麼了 ⋯⋯ 我講惹 3 分鐘 :(
提醒各位，名詞記錯，遇到 專有名詞刷人 或許是蠻常見的。
> PTT [心得] AmazingTalker/台灣樂天市場 面試心得：https://www.ptt.cc/bbs/Soft_Job/M.1587570699.A.908.html
AmazingTalker 回文參考：https://pttcareer.com/soft_job/M.1587488744.A.9C5.html
AmazingTalker 回文參考：https://www.ptt.cc/bbs/Soft_Job/M.1587799089.A.BC6.html - React 事件處理
我是往 onClick 之類的事件和 dom event 行為不同的方向作答 - React 網站效能調整
主要往減少 diff , 或是 useMemo / useCallback 方向回答 - React 架構優化
我這邊是聊我 angular 的經驗，因為當時沒用過 React。 - react 和 angular 渲染底層機制
好像大家都蠻好奇的，這個比較偏想了解 angular。 - React 和 Angular 變化偵測 change detection
同上，問題延伸。 - 簡單介紹 redux
- saga , observable 設計原因
Redux 也是 React 狀態管理蠻重要的一環。 - SSR
我這邊主要回答 Angular 接觸的 Universal Javascript / 為了 SEO 的 pre-render，
當時並不太熟悉 React 生態有沒有特別的解法，現在估計都是 Next.js。 - React props 傳遞問題
這邊我好像沒回答到完全，有反問是不是漏掉什麼效能問題的考慮，
對方表示 React context API props 傳下去每一層都會 render - hook 解決什麼問題？
我這邊回答印象中 Dan 寫文的內容
文章： https://zh-hant.reactjs.org/docs/hooks-intro.html
對方表示回答 state 就好 （記憶不太確定） - code splice
我主要聊 Angular dynamic import module 的實作經驗和 prefetch module 策略。 - css 問題 ：div 置中
flex - css 問題 ：把 block 在畫面上隱藏，但實體存在
這邊對方問題沒有描述清楚（和其他 10 間以上的面試問題相比）
不過基本上可能出現的回答都回答 後來才確定問題 - css 問題 ：過長文字如和變 …
參考答案
JS：
- arrow fn / 一般 Fn
- this binding
- null / undefined 差別
- addeventlister 第三個參數
這個我真的不知道為什麼要特別問，跪求分享實務 - preventdefault /stoppropagation
綜合類：
- 同事不懂架構，怎麼設計架構合作
- 測試經驗
- 最近感興趣的技術
- 怎麼設計”通知系統”
- hook 渲染機制
- angular 怎麼做 通知系統
- 對工作的期待
總結
大家可以算一算，有幾個問題 ⋯⋯
基本上都是快問快答的感覺，有些題目我故意壓下時間想問對方的理解，
不然節奏很怪，很不舒服。
（面試總長約1小時，可以換算回去一個題目有多久時間可以回答）
但通常都被帶過去，只有少數問題有小討論，感覺時間壓力應該很大 Orz
剛到的時候有參觀辦公室，和 2016 年參加 meetups 的時候差很多。
不過最後還是只拿到制式感謝信，連二面都沒機會 ＱＱ
也沒有特別提到是以什麼門檻篩選，面試感覺是用口說寫考卷，比較少交流的感覺。
因為多半不會針對問題深入，也不知道自己回答題目哪些是有錯誤，還是觀念有問題 :(
閒聊：
最近公司收到的履歷都越來越年輕，
有很多強的大學生
如果心得有幫助到想面試的各位，可以幫我點個拍手。
目前最後修改 ：2022.05.03
官方心得好像有人提到類似條列整理 感覺好像影響到人家設計的面試流程 :(
