フロントエンドクイズ大会

Transcript

1. Cybozu Frontend Day 2024 Summer フロントエンド クイズ大会
2. 参加者の人はステージの上へ お願いします
3. 飛び入り参加、あと2組いけます！ 1チーム、1~3人まで受け付けてます！
4. 参加チームの紹介 所属と普段やってることと、意気込みを一言！
5. p 1チーム、1〜3人でD p 回答はスケッチブックに記載くださ‚ p 問題はスクリーンに表示しまD p 答えは調べたらすぐ出てくるものもあるので、
 PCやスマホを使って調べるのはやめてくださ‚ p チームメンバー間での相談は自由でD p 雰囲気を見て、司会がヒントを出すこともありまD p 正答数が最も多かったチームが優勝です 概要
6. むずかしい問題もあるかもしれないケド そんな時は自分の直感を信じよう 楽しむ心を大事にネ
7. 業務連絡
8. mugishimaさん、 正当数メモって！！ タイムキープもお願い！！
9. ⁨⁩それじゃあ早速始めよう
10. 次のグラフはそれぞれ State of JS 2023で公開された React、Vue、Storybook、Vite のどれかである 組み合わせとして正しいものを選べ 第１問
11. ❶ ポジティブな意見 使ったことがある 使ったことがない これはReact、Vue.js、Storybook、Viteのどれか
12. ❷ ポジティブな意見 使ったことがある 使ったことがない これはReact、Vue.js、Storybook、Viteのどれか
13. ❸ ポジティブな意見 使ったことがある 使ったことがない これはReact、Vue.js、Storybook、Viteのどれか
14. ❹ ポジティブな意見 使ったことがある 使ったことがない これはReact、Vue.js、Storybook、Viteのどれか
15. A ❶ Vue.js ❷ Storybook ❸ React ❹ Vite B ❶ React ❷ Vue.js ❸ Vite ❹ Storybook C ❶ Storybook ❷ Vue.js ❸ Vite ❹ React D ❶ Storybook ❷ Vue.js ❸ React ❹ Vite 第１問 次のグラフを表すライブラリとして正しい組合せを選べ ❶ ❷ ❸ ❹
19. A ❶ Vue.js ❷ Storybook ❸ React ❹ Vite B ❶ React ❷ Vue.js ❸ Vite ❹ Storybook C ❶ Storybook ❷ Vue.js ❸ Vite ❹ React D ❶ Storybook ❷ Vue.js ❸ React ❹ Vite 第１問 次のグラフを表すライブラリとして正しい組合せを選べ ❶ ❷ ❸ ❹
20. mugishimaさん、 正当数メモよろしく！
21. 現在のCore Web Vitalsを 構成する指標の組み合わせとして 正しいものを選べ 第２問
22. A FCP、CLS、TBT B TTFB、INP、CLS C CLS、LCP、INP D FID、CLS、LCP 第２問 現在のCWVの指標として正しい組合せを選べ
26. A FCP、CLS、TBT B TTFB、INP、CLS C CLS、LCP、INP D FID、CLS、LCP 第２問 現在のCWVの指標として正しい組合せを選べ
27. 次のうち、WAI-ARIAの ランドマークロール を 選べ ではないもの 第３問
28. A banner B navigation C header D main E search 第３問 ランドマークロール を選べ ではないもの
32. 第３問 ランドマークロール を選べ ではないもの A banner B navigation C header D main E search
33. 次のフレームワークを リリースが古いものから順に 並び替えてください 第４問
34. A Next.js v14.0.0 B Nuxt v3.0.0 C SvelteKit v2.0.0 D SolidStart v1.0.0 第４問 リリースが古いもの順に並び替えてください
38. B 1 Nuxt v3.0.0 2023/01/20 A 2 Next.js v14.0.0 2023/10/27 C 3 SvelteKit 2023/12/15 D 4 SolidStart 2024/05/22 第４問 リリースが古いもの順に並び替えてください
39. 第５問 https://web.dev/baseline/2023?hl=ja
40. Baseline2023に 機能を選べ 含まれていない 第５問
41. A dialog要素 B :has() C inert属性 D CSSのネスト構文 第５問 Baseline2023に 機能を選べ 含まれていない
45. A dialog要素 B :has() C inert属性 D CSSのネスト構文 第５問 Baseline2023に 機能を選べ 含まれていない
46. JavaScriptの ランタイムとエンジンの 組み合わせとして を選べ 間違っているもの 第６問
47. A Node.js V8 B Bun V8 C LLRT QuickJS D WinterJS SpiderMonkey E Deno V8 第６問 JSのランタイムとエンジンの組合せとして を選べ 間違っているもの
51. A Node.js V8 B Bun V8 C LLRT QuickJS D WinterJS SpiderMonkey E Deno V8 第６問 JSのランタイムとエンジンの組合せとして を選べ 間違っているもの
52. まずは、次のコードを見てください 第7問
53. 第7問
54. ブラウザで⁨⁩は どのように表示されるか 正しいものを選べ 第7問
55. A B C D 第7問 ブラウザで表示されるものとして正しいものを選べ
59. A B C D 第7問 ブラウザで表示されるものとして正しいものを選べ
60. 次のJavaScriptを実行して 出力されるものとして 正しいものを選べ 第８問
61. 第８問 A 5→7→7→5 B 6→7→6→5 C 5→7→6→5 D 6→7→7→6
65. 第８問 A 5→7→7→5 B 6→7→6→5 C 5→7→6→5 D 6→7→7→6
66. 次のJavaScriptを実行して 出力されるものとして 正しいものを選べ 第９問
67. A Start Promise 1 Promise 2 End Result 2 Timeout 1 Result 1 B Start Promise 1 Promise 2 End Timeout 1 Result 1 Result 2 D Start End Promise 1 Promise 2 Result 2 Timeout 1 Result 1 C Start Promise 1 Promise 2 End Result 2 Result 1 Timeout 1
71. A Start Promise 1 Promise 2 End Result 2 Timeout 1 Result 1 B Start Promise 1 Promise 2 End Timeout 1 Result 1 Result 2 D Start End Promise 1 Promise 2 Result 2 Timeout 1 Result 1 C Start Promise 1 Promise 2 End Result 2 Result 1 Timeout 1
72. 優勝は... 口頭で発表するよ
73. 優勝賞品は！
74. 近所のデパートで買った ちょっと高そうなお菓子！