2022 Dcard Frontend Intern 面試分享

2022-05-09

在一月底的時候,我在求職網上看到了 Dcard 開出了前端實習生的職缺。雖然條件很吸引人,但其實我還是猶豫了很久,一直到快二月底才開始做前置的作業。之所以會猶豫是因為我在前端這塊領域上的經驗不多,履歷上也沒有什麼令人驚豔的作品或是厲害的經歷,感覺就算投遞了也是會被刷掉。簡單來說,就是害怕失敗吧。

但是,能夠進到 Dcard 工作實在是太吸引我了,而且就算被刷掉了,我也不是一無所獲,至少還能把前置作業當成是一個作品來充實我的履歷。

面試流程

Dcard 的實習生面試總共分成三個部分,第一部分是前置作業加履歷,第二部分是跟技術團隊的面試,最後則是跟 CEO 和 HR 的面試。從履歷繳交的截止日開始算的話,整個面試的時長大概一個月左右。

前置作業和履歷

這次前端的前置作業是要串接 GitHub REST API 來瀏覽單一使用者的 repositories,每次 call api 都只能載入十筆資料,滑到最底部時要再 call api 載入下十筆資料,直到沒有資料可以載入為止。換言之,就是要實作 infinitely scrolling 的功能。

這份作業其實還蠻簡單的,應該只是要確認求職者會不會使用 React 而已。題外話,對我來說最難的部份是要自己設計畫面,一開始對於怎麼排版真的毫無頭緒,不管怎麼用都覺得自己設計得好醜。

再來是履歷的部分。由於我的經驗很少,作品也很少,所以我的履歷其實就只有短短的幾句自我介紹、學歷、目前會的技能、一些在 Frontend Mentor 上做的 project 以及我自己開發的 package,裡面唯一比較吸引人的地方應該只有自己開發一個 package 吧。

和 Web Team 的面試

這一關會有三位前端工程師來面試,總時長一小時。雙方自我介紹完之後,面試官就會開始提問一些關於 Frontend 的技術問題。

技術問題

這邊問的問題大概有七成都跟 React 有關,所以對於 React 的熟悉程度不高的話可能很容易被問倒。

所有題目加起來應該有二十題左右,但我面試完就忘記好幾題了,只能列出還有印象的幾題。

React

  1. React 是怎麼更新畫面的
  2. 承上題,如果不想要畫面 re-render 的話可以怎麼解決
  3. React.memo 是怎麼去判斷 props 有沒有改變的
  4. 要怎麼客製化 React.memo 去比較 props 的方式
  5. hook 解決了什麼問題
  6. input 可以直接用 state 去設定 value 也可以使用 defaultValue,這兩種有什麼差異
  7. 承上題,在什麼情況下會去用 controlled component
  8. 為什麼 hook 不能包在 if 裡面(這題我太緊張直接忘記,面試官一講到 index 我才想起來)
  9. Class component 跟 functional component 的差異(我忘記這題敘述是不是這樣了,但我記得我回答的內容跟這個有關)
  10. 如果不想要 props 一直傳遞下去的話,可以用什麼方法解決

JavaScript

  1. stopPropagation 跟 preventDefault
  2. Promise 是什麼,通常會拿 promise 來幹嘛
  3. cookie, sessionStorage, localStorage
  4. == 和 === 的差異

http

這邊的問題我幾乎都記不太清楚了因為幾乎都不會,所以有些題目敘述可能會很怪,但那不是面試官的問題,是我的問題。

  1. 前端在跟後端溝通的時候是怎麼運作的

React 跟 http 的部分應該還有兩、三題漏掉,JavaScript 的話就是真的那麼少。

作業提問

接著面試官會開始問跟作業有關的問題,我還記得他們問我在這個作業中有沒有覺得做得很好的地方想跟他們分享,我想了一下之後就跟他們說:「沒有,但我可以說這份作業我哪裡做得很爛。」

講完之後我感覺他們好像愣了一下,應該是因為很少遇到會掀自己短處的面試者 XD。

然後我就開始一一列出我覺得哪裡做得不夠好的地方,以及我之後是怎麼改進的。

其他問題

接下來就是跟履歷上比較有關係的問題和一些感覺上比較像是在聊天的問題。

接下來想做什麼樣的 package

這裡我是說我想要做一個 component library,這個 library 只會有一些比較複雜的 component,例如 Accordion, dropdown。另外也只會去實作它的功能,不會有任何的 style,因為想要重複用在各個專案中。

面試官說聽起來還不錯,還提到其實有一個叫做 Reach UI 的 package 就是在做我想做的事情。

題外話,除了 Reach UI 以外,還有 Headless UI 也是在做一樣的事情。原本還以為這個點子應該還沒有人做,結果原來已經有滿多現成的 library 了,那這樣我也沒有開發的必要了......

接著另外一位面試官有問我,除了 component library 之外我還有想做什麼其他的 package。這邊我是回答因為我覺得 Redux 要寫一堆 reducer 很麻煩,所以我想要嘗試做一個 global state manager 來減少這些繁冗的工作。

最近有在研究什麼新東西嗎

接續上一個回答,因為要實做 global state manager,所以我就說我最近在看 useSyncExternalStore 要怎麼使用。其中一位面試官聽到之後就馬上問我知不知道為什麼要用這個 hook ,幸好我在這之前有去了解一下為什麼會有這個 hook,不然感覺會被認為是打腫臉充胖子。

比較一下目前用過的 style method

就是稍微說一下對於 style 的方法有什麼想法。我這邊是說最近學到了 Tailwind CSS,覺得比 CSS-in-JS 方便許多,除了不用想 class name 以外,也不用去想 element 的取名,也因此不必再多寫一個 style file.

提問環節

最後就是問我有沒有什麼想提問的問題,每一個問題面試官都回答得很詳盡,所以就不把回答全部列出來了。

  1. 對於一個經驗不足的人來說,在實作新功能時可以直接使用別人已經做好的 package 嗎?還是應該先嘗試自己能不能完成。
  2. 如果成為 Dcard 的前端實習生,要做的工作是什麼。
  3. Redux 通常都用來存什麼
  4. 看 source code 有什麼訣竅嗎
  5. Dcard 是怎麼決定要不要升到 React 18 的

這邊拿第三點出來講好了,關於這題面試官是說 redux 的創作者其實自己現在也不會去用 redux 了,言下之意就是基本上可以不用考慮用他(那我也不用開發一個 global state manager 了),另外 Dcard 現在也在考慮把 redux 從專案中移除了。

CEO 和 HR 的面試

第一次面試結束之後,大概過一個禮拜就會收到第二次面試的通知了。第二次面試的總時長也是一個小時,CEO 和 HR 的面試各三十分鐘。

和 CEO 的面試

我看了很多面試分享的文章,每一篇都有提到跟 CEO 面試就是由我來提問問題,所以在面試之前,我自己有先準備一些問題。

然而,這個面試跟我原先預想的不太一樣。我原本以為 CEO 自我介紹完之後會讓我也自我介紹,結果 CEO 說完之後就跟我說可以開始提問了。

我問的第一個問題是 CEO 是依據什麼標準來決定我能不能成為 Dcard 的實習生,他的回答是要讓他覺得我是一個有趣的人。接下來就是繼續問我準備的問題,還有 CEO 也會問我一些問題。

雖然途中有額外問其他問題,但是因為 CEO 回答問題的速度非常快,所以我的問題一下子就問完了。接著我就和 CEO 說我的問題差不多就這樣,面試就結束了,總時長大概只有二十分鐘。

和 HR 的面試

HR 一共有兩位,不過其中一位因為臨時有事,所以中途才加入。

這一關其實就滿輕鬆的,HR 會問以前跟同學合作的模式如何,遇到的困難是怎麼解決的。回答完問題之後就是開始介紹 Dcard 公司內部有什麼部門,以及各部門是如何合作的。

結語

先講結果好了,我最後有收到錄取通知 ╰(°▽°)╯

比起經歷,我覺得 Dcard 的 Web Team 應該是更看重自學的能力以及在這塊領域上的熱忱。因為我在介紹自己做的 package 時還滿激動的,甚至激動到把語助詞脫口而出,可能是因為這樣讓 Web Team 感受到了我對前端的熱情。

老實說,我在兩次面試完之後並不覺得自己會被錄取,因為我跟 CEO 面試的表現還蠻糟糕的。除了問題不夠導致面試提早結束以外,問題的內容感覺也沒什麼深度,還有就是我覺得 CEO 不會覺得我是一個有趣的人 QQ。

雖然成為 Dcard 的實習生確實是一件令人開心的事情,但是打開租屋網來看看台北的房子之後,才發現還有一個大問題要解決,希望可以找到好房子......