フロントエンド面接体験

前言

やっと最近の面接の経緯を整理する時間ができました。まず、見てきたことをまとめてみます：

1. 多くの企業の面接では、主にJavaScriptの習熟度が評価されます。アルゴリズムやプロトタイプチェーンについての説明が多く、DOMやイベントの操作についてはあまり問われません。
2. CSSに関してはほとんど評価されず、あってもクラスやIDの優先度などの基本的な質問にとどまります。
3. HTMLに関する面接質問はなく、セマンティックタグやアクセシビリティ、input typeの使用なども問われませんでした。
4. React、Redux、ES6の構文がほぼフロントエンド開発者にとって必須スキルとなっており、Angularを採用する企業は少ないです。
5. 一般的なヘッドハンターは専門知識が不足している印象があり、もしかすると自分がまだ専門的なスキルを持っていないからかもしれません。

以下は今回の面接を受けた会社です：

1. Accupass
2. Codementor
3. Linker Network Inc.
4. 楽天市場
5. 17 media

背景

国立科技大学の情報管理学科を卒業し、現在は2年の職務経験があります。普段はフロントエンド開発に集中しており、約2年間ReactやReduxの開発に取り組んできました。一般的なフロントエンド「エンジニアリング」だけでなく、実装やインタラクションも好きで、自分の小さなプロジェクトでAWS、Lambda、Node.js、データベース、機械学習などのバックエンド知識を練習していますが、やはり最も得意なのはフロントエンド関連です。

期待する仕事環境

1. フロントエンドチームと一緒に協力できること。以前の職場ではフロントエンド開発が一人だけだったため、特定のフロントエンド技術について議論するのが難しかったです。
2. 突発的な事態があまりないこと。突然の要件変更や、開発中のプロダクトの中止、人的理由での開発などがないこと。
3. 主力製品と明確なサービスがあること。
4. 技術的な内容が高く、優秀なチームと共に働けること。

求人の探し方

• inside jobboard
• yourator
• 104人力銀行
• f2e jobs
• PTT Soft_Job版

1. Accupass 活動通

応募職種：Frontend Developer

イベントチケットのウェブサイトで、現在AngularからReactにアーキテクチャを移行中です。元々のAngularがメンテナンスが難しく、全体に影響を及ぼすことが多かったためです。

面接前

104で面接の招待を受けて、PMからの招待でした。

面接中

チームが拡大中で、面接では自分の職務経験や小プロジェクトについて主に話しました。面接官は日本人のフロントエンドエンジニアで、流暢に中国語を話していました（全て中国語での面接でした）。

Accupassの開発状況、機能の開発方法、スケジュール管理などについて話しました。また、前端エンジニアとはCSS Modules、RxJS、CycleJSについても話し、フロントエンド技術に情熱を持っている印象を受けました。

面接結果

オファーを辞退しました。

PMは私がAccupassチームに加わることを非常に望んでいましたが、辞退後に理由を尋ねる電話もあり、今後の機会に協力したいとも言われました。しかし、他の職位の方が魅力的だったため、Accupassのオファーを辞退しました。

2. Linker Network Inc. 美商宝蘊凌科技有限公司

応募職種：Frontend Developer

IoT、AI、機械学習に特化したクラウドコンピューティングプラットフォームで、これらのプラットフォームにはUIのサポートが必要なため、フロントエンド開発者が必要です。公式サイトはかなり簡素で、何をしているのかがわかりませんが、技術的には非常に高いレベルです。

面接前

104で自発的に履歴書を提出し、電話面接の招待を受けました。この会社は技術的に深いことをしており、オフラインでもいくつかのコミュニティイベントを開催しています。

面接中

技術的には非常に堅実な会社だと感じました。自己紹介で過去の職務経験とReact、Reduxについて話しました。

後で、私が面接を受けたのはc9sだと気づき、どこかで見たことがあると感じました。技術の理解度が非常に高い方でした。（ただし、本人は少し疲れているように見えました）

面接では、最適化に関連するいくつかの問題が出題されました。例えば：

1. jsをどうやってminifyしますか？ この質問は、jsのminifyプロセスを大まかに説明し、最終的にはコード内の不要な空白を削除する方法に簡略化することが求められました。考え方自体はシンプルですが、実装には注意が必要な詳細があり、その時はあまり考えずに何度もヒントをもらわないと書けませんでした。
2. フロントエンドのパフォーマンス最適化はどう行いますか？ 一般的な方法をいくつか挙げましたが、面接官にあまり受け入れられなかった印象があります。例えば、base64エンコーディングでリクエストの数を減らすことや、キャッシュ、ServiceWorkerなどです。
3. SPAのフレームワークを作るとしたら、どうしますか？ SPAはフロントエンドでrouterを扱う必要があるので、まずはrouterの処理方法を考慮する必要があります。その後、ライフサイクルの問題も考慮するように言われました。
4. 一部のJavaScriptの質問
5. プロトタイプチェーンの原理
6. newの背後で何が起こるか？
7. 継承をどう実装するか
8. thisは誰を指すか

最後に、見た目がマネージャーのような方が私に会社の現状や将来の発展について話してくれました。

面接結果

未返答（すでに3週間が経過しました）。おそらく自分がまだ未熟だったからでしょうか。

3. 台湾楽天市場

応募職種：Frontend Developer

以前、面接を受けたことがありますが、フルタイムの勤務時間を提供できなかったため（確かではありませんが）、再度応募しました。オフィスの雰囲気は一般的な大企業と同様で、社員証がないと入れません。

面接前

HRから連絡があり、身元調査表とプログラミングのテスト問題が送られてきました。フォーマットはおおよそ104の履歴書と同じです。特に彼らの面接招待メールについて言及したいと思います。

一般的な会社は通常、メールに住所を添付しますが、楽天市場はXX出口、XX銀行の上、エレベーターを降りて右に曲がるなど、重要なランドマークを示します。これは些細なリマインダーですが、面接者にとって非常に役立ちます。誰もが大日照の下でGoogleマップを見て反対方向に進むことを望んでいませんから。

面接中

今回の面接は以前よりもさらに形式化されていて、知能テストや性格テストの問題を解かなければならず、加減乗除などの問題が出題されました。私はいくつか間違えたようですXD。全体の面接プロセスはこのために少し長くなりました。

エンジニアとの面接は非常に楽しく、主に職務経験や技術について話しました。2人のエンジニアは技術的に非常に優れた印象を受けました。1人のエンジニアは以前に私の面接を受けた方で、「あなたの技術力には問題がない」と言っていましたが、兵役の関係で拒否されてしまったため、非常に感動しましたQQ。

その後、実は1人がreact-bootstrap-tableのクリエイターであることに気づきました。

面接では主にJavaScriptに関する質問がありました。例えば：

1. 再帰とその実際の応用 文字列を反転する問題があり、主考官は再帰を使って実装するように指示し、その利点について尋ねました。私は頭を悩ませても答えが思いつかず、ネットでも答えが見つかりませんでした。
2. クロージャと実際の開発応用
3. IIFE（即時実行関数）の利点 私はいくつかの例を挙げましたが、後にエンジニアがjQueryのソースコードを共有し、IIFEの方法がminifyに効果的であること（windowをパラメータ化するため）を教えてくれました。このアイデアは以前考えたことがありませんでした。
4. React、Reduxの開発シナリオ応用 Reduxの一般的な開発シナリオ、ストアの管理方法、Reactライフサイクルの応用についていくつか質問されました。
5. （更新）+を使わずに加算機能を実装する方法 この問題はビット演算子についての理解が問われました。XORを使うことで実現できます。高校の加算器で教わりましたXDが、真理値表を書く必要がありました。
6. （更新）台湾楽天市場の印象的なスローガンがありました：複雑なものを簡素化し、簡単なものをプロセス化し、プロセスのものを標準化し、標準化したものを自動化する。（原文がこうであるかは不明です）

その後、CI/CDや開発プロセスの実行方法など、よりエンジニアリング的な質問がありました。楽天市場の技術ラインはAngular、React、RoR、GraphQLなど多岐にわたります。

面接結果

資格が不十分で、基本的に淘汰されたようです。しかし、フロントエンドチームは非常に堅実で、2人のエンジニアはフロントエンド以外にも他の分野での開発経験があり、非常に友好的でした。面接が終わった際には、飲み物をごちそうしてもらい（会社の自販機ですがXD）、キャリアに関する多くのアドバイスもいただきました。

4. Codementor

応募職種：Frontend Developer

1対1のオンラインメンターサービスを提供しています。それに付随して、オンラインコードレビュー、デバッグ、ペアプログラミングなどの多くのサービスを展開しています。

面接前

技術的な内容が高く、対象もエンジニアであるため、非常に良い練習の場になると思い、104で履歴書を提出しました。翌日、HRからオンライン面接の招待を受けました。オンライン面接が好きで、エンジニアにとって会社に行く必要がないのは大きな福音です！

面接中

第一段階  —  エンジニア面接

チームリーダーとの面接で、過去の職務経験について話し、開発に関するいくつかの質問を受けました。口頭でJavaScriptとReactの理解をテストされました。

1. クロージャ
2. Flux vs MVCが解決する問題：正直なところ、Fluxを実際に使ったことはなく、構成図やコードを見たことしかないので、自己理解を基に答えました。
3. JavaScriptはどのように非同期を実現していますか？コールスタックとイベントループについての理解を話しました。

第二段階  —  Co-Founderとの面接

同じくオンラインでCo-Founderと会話しました。この段階では技術的な部分はあまり話さず、自己紹介が終わった後、彼は私のサイドプロジェクトに非常に興味を持っているようでしたXD。設立の動機やなぜ完全なサービスにしなかったのかについて話し合いました。しばらくの間、この小プロジェクトについて話し、Codementorが類似のコンテンツプラットフォームサービスを行っていることにも触れました。

その後、Codementorの歴史やチーム文化についていくつか質問されました。合計で約30〜40分程度でした。

第三段階  —  CEOとの面接

CEOはカリフォルニアにいて、同じくオンライン面接です。主に自分の職務内容や開発経験、人格特性に関する質問をしました。おそらく、お互いの適合度を確認するためでしょう。合計で約30〜40分程度です。

CodementorのCo-FounderとCEOはどちらもエンジニア出身で、非常に楽しく会話でき、上から目線で見られることはありませんでした。

その後、「自分が賢いと思いますか？」という質問がありました。私は「そうではない」と答え、プログラムやアルゴリズムの数を見れば見るほど、無知さを痛感すると答えました。

自分が一生でReactのような大規模な構造や、さまざまなソートアルゴリズムを設計することができないと思うと、どう考えても自分のことを賢いと思えません。

面接後

約5日後に辞退されました。もっとシニアなフロントエンドを見つけたようです。Codementorからの印象は非常に楽しく、CEOやチームリーダーは自分たちの製品に対する情熱が感じられました。将来また彼らと一緒に働けることを願っています。

5. 17 media

応募職種：Frontend Developer

これは私がこれまで面接を受けた中で最も楽しい会社です。f2e jobsで求人情報を見つけ、応募するかどうか悩んでいましたが、友人の推薦で面接の招待を受けました。

面接中

チームリーダーは勤務時間後の18:30に面接を行いました。私は時間通りにオフィスに到着し、チームリーダーも時間通りに現れました。この点が非常に印象的でした。

面接者がいつ来るかわからないため、多くの会社ではエンジニアがまだ働いている状態で突然面接の通知を受け、慌てて関連資料を準備したり、履歴書をちらっと見るということがよくあります。現在までに何人の面接者がいたか尋ねると、彼はわざわざSlackのメッセージを見せてくれ、何人かの遅刻者についてもメモを取りました。時間を非常に重視している方です。

最初にHRが会社の施設を案内してくれました。オフィスは広く、スナックや冷蔵庫が豊富で、コーヒーマシン、コーヒー豆、電子レンジなどの器具もあります。聞いたところによると、RDチームには別のオフィスもあるそうですが、その日の状況では少し混雑しているようでした。

その後、チームリーダーとの面接が始まり、まず自己紹介と職務経験について話しました。

話を進めながら、現在の会社やチームの状況についても触れました。彼はチームを非常に大切にしているように感じました。その後はライブコーディングに移り、実際の状況を模擬するためにネットワークを切らず、主にJavaScriptの一般的な開発応用やビルトイン関数の実装を評価されました。

コードを書いた後、チームリーダーはあなたの書いたコードについて技術的な議論を始めます。なぜこのように書いたのか、より良い書き方はないかなど、多くの時間をかけて議論し、質問し、自分の意見を述べてくれました。まるで実際のコードレビューのようでした。この部分が最も時間を要し、約1.5時間もかかりました。

最後に、汚れたコードを渡され、コードレビューとバグ解決を行い、一緒に議論した後、面接は終了しました。

オフィスを出る頃には21:50を過ぎていましたが、彼は非常に根気強く、側で仕事を続けていました。特に印象に残ったのは、\Bの使い方についての議論です。この正規表現は理解されることが少なく、元々の答えについて話し合った後、私は彼に\Bの使い方を尋ねました。

彼は非常に根気よく、\b、\wから\Bまで一つ一つ説明してくれ、長年の疑問が解消されました。（ネット上では\bについて明確に説明されることが少ないです）

彼から受けた印象は次の通りです：

1. リアル：会社の状況を隠さず、入社後に騙されたと感じることはありません。また、過程の中で仕事の無奈や感嘆について軽く話すことが多く、かなりの苦労を乗り越えてきた印象があります。
2. 誠実：変な質問で人を試すことなく、コードの質やこのコードをどう改善できるかを一緒に議論してくれました。面接の中では非常に珍しいことです。また、オフィスが広すぎて誰を探せばいいかわからないと伝えたところ、HRにフィードバックを伝えると言ってくれました。私は彼がただ言っただけだと思っていたのですが（ほとんどの会社がそんな風ですから）、実際にHRにフィードバックをしてくれたことに非常に感動しました。

面接結果

オファーをいただきました。HRからオンボードプロセスに関して説明の電話がありました。

面接の感想

面接は本当に疲れますQQ。可能であれば、あちこち奔走せず、すべてオンライン面接で済ませたいと思っています。これはまさに「怠惰なエンジニア」にぴったりです！

今回の面接では「仕事を探す」ことに加え、多くの開発者との出会いがありました。彼らはおそらく大きなコミュニティに顔を出すことは少ないですが、実力や教養に関しては、コミュニティで目立つ開発者よりも遙かに深いものがあります。コミュニティに参加することが悪いことだとは言いませんが、多くの人が静かに貢献していることも忘れてはなりません。活動の頻度で個人の実力を判断すべきではないでしょう。

今回の面接で私が学んだことは、謙虚さです。ソフトウェア開発の分野には多くの賢い人がいて、自分がどれほど無知であるかを絶えず思い知らされます。

1. 履歴書の準備

私は普段からMediumやブログを書く習慣があるため、履歴書にそれを組み込むことができます。また、履歴書はGitHubに置いているため、非常に簡単に更新できます。

2. 職務経験

職務経験は単に会社名、職位、年数を書くのではなく、具体的にどのような業務を担当したのか、会社で何をしたのかを詳しく書くべきです。例えば：

• React、Reduxを使って複雑なページを開発
• ホームページのロードパフォーマンスを最適化

このように書くことで、「フロントエンド開発を担当」というよりも遥かに良い印象を与えられます。

3. サイドプロジェクト

仕事以外に、自分のサイドプロジェクトがあればさらに良いです。エンジニアとして、必ず自分の手で解決したい問題があるはずです。

面接官に自分の好きな分野や技術ラインを知ってもらうことができ、各プロジェクトには長い間悩まされていた特定の問題があるはずです。

4. 多くの質問をする

面接は一方通行のプロセスではなく、双方向のコミュニケーションであるべきです。相手に対して質問を返すことで、会社についての理解も深まります。

私は通常、いくつかの社内の質問をします。主に以下のような点を尋ねます：

1. 自動化はありますか？ 多くの会社はまだ手動でSSHにログインしてデプロイしています。このような開発方法は、会社の文化を間接的に反映する可能性が高いです。例えば、予算申請のプロセスが煩雑で、自動化できるものに目を向けていないなどです。
2. バグはどのように解決しますか？ バグ解決の方法から、会社がどのようにスケジュールを立てるかを見ることができます。バグはどのように報告され、誰が優先度を決定するのかなど、通常、相手の回答から彼らがどのような規範を持っているかを判断できます。
3. 要件は頻繁に変更されますか？ 要件変更に関するこの質問は、さまざまな角度から切り込むことができます。「頻繁に変更されるとは？」、「いつ変更されるのか？」、「どのような状況が変更と見なされるのか？」など、この質問から、この会社が開発時にAと言いながら、納品時にはBと言うような状況があるかどうかが分かります。

その後、これらの回答からさらに追及する形で質問を続けていきます。通常、面接官の回答の程度から、この会社の内部状況が分かるでしょう。