第七章 フロントエンド技術質問

本章ではフロントエンドエンジニアとして聞かれる質問内容について書いていきます。フロントエンドエンジニアで最も力を入れるべきはJavaScriptに関連する技術ドメイン知識です。

ByteDance, Bloomberg, Agodaなどのフロントエンドエンジニアの面接を受けてきましたが、必ずこの質問が聞かれます。また、ReactのUIコーディングを行う上でもuseMemoは何のために使う？Suspenseを使う場面はいつ？などの技術質問をされるので、個々に対する質問の回答も用意しなければなりません。その他ではHTML/CSSやパフォーマンスに関連する質問も合わせて聞かれる場合があるので準備しましょう。JavaScript特有の問題かもしれませんが、このJSコードの出力結果は何？というトリッキーな質問も聞かれる場合があります。頻出問題は抑えておきましょう。

注意点としては回答例はあくまで面接用に簡略化したものなので、より深い知識を得るためには詳しい解説をしている関連リンクから詳細を辿って理解する事をオススメします

問題カテゴリ（合計89問）

1. HTML
2. CSS
3. JavaScript
4. React
5. Browser Networking
6. Web Performance Optimization
7. Web Security
8. JS Coding

HTML

🚦 Important

HTMLのDOCTYPE宣言とは何ですか？

What is DOCTYPE declaration in HTML?

🔗 <!DOCTYPE> - ドキュメントタイプ - とほほのWWW入門 (tohoho-web.com)

🔗 HTML Standard (whatwg.org)

---

多言語のWebサイトを作成する上でHTMLにおいて気をつけるべき事は何ですか？

What should we be careful about in HTML when designing a multilingual website?

---

🚦 Important

HTMLセマンティック要素とは何か、なぜこれを使いたいのですか？

What are HTML semantic elements, and why would we like to use them?

🔗 Semantic HTML (web.dev)

🔗 Semantics (セマンティクス) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN (mozilla.org)

---

WebページのリンクをTwiiterのようなSNSに共有した時に画像とTitleとDescriptionが表示されなかった。どのように修正しますか？

When you shared a web page link to SNS like Twitter, the image, title, and description did not appear. How will you fix this?

---

🚦 Important

Webのアクセシビリティに関して気をつけるべき事は何ですか？