立即申請 檢閱考試指示 測驗分數評估

考試

請實作依照設計圖像素完美桌面及手機前端介面。

  • 必使用React.js, Flexbox, 及 React UI 零件架構。
  • 必使用 static page 方式(無後端)在Firebase或其他架構上架。

桌面介面

手機介面

需求規範

  1. RWD. 桌面及手機 Responsive Web Design。
  2. 必使用JavaScript.
  3. 必使用 React.js.
  4. 必使用 **CSS Flexbox
  5. 必使用React UI framework,從以下賽選:
  6. Material UI
  7. Semantic UI
  8. React Bootstrap
  9. React Toolbox
  10. Elemental UI
  11. 必使用 static page 方式(無後端)在雲端架構上架。
  12. 請用雲端架構 Heroku, Firebase, ZEIT, 或 Netilfy 上架 static page。
  13. 這不是後端測驗,所以網頁和使用者互動全在前端實作。

重要提醒

  • 我們並不期望你完整開發每個功能。重點不是要全部 “做完”,是要查看有嘗試部分的能力、進度,盡力而為就可以。
  • 請使用 GitHub/GitLab.
  • 這份線上測驗分數會決定您的職級與薪資範圍。每個網頁功能有分數。請必定要交卷。
  • 2.5 小時到時:
    • 有開發多少,就交卷多少,考試並沒有所謂的 “完成”。
    • 請必定要上架,並提供網頁 URL.
  • 請填寫測驗完成表格 Exam Submission Form.

考題大綱

  1. 像素完美在一下狀態:
  2. 桌面(Chrome)
  3. 手機(Android, iOS)
  4. 沒設計圖的狀態
  5. 效果
  6. Hover
  7. Selection
  8. Disable
  9. 鍵盤及滑鼠動作
滿分 網頁功能
50 數據輸入格
50 圈圈表格及數據介面
60 選項介面(每種選項型 20 分)
40 主頁及 Hashtags

測驗分數評估

網頁功能

請以下表單選任網頁功能實作,不用照順序。

1. 數據輸入格

  • 限制輸入數字 (0-9), 逗點 (.), 及符號 (/)
  • 不行用左右鍵往前後
  • 不行用滑鼠點輸入格
  • 鍵盤自動專注在輸入格,不需點輸入格
  • “Press Enter” 文字及 “Submit” 會在有輸入數字時出現

2. 圈圈表格及數據介面

  • 桌面和手機介面像素完美
  • 不能只是個畫面,需要跟著數據變動

桌面介面

手機介面

3. 選項介面

  • 桌面和手機介面像素完美
  • 三種選項
    • 簡易選項
    • 多選項
    • 點勾選項

簡易選項

多選項

點勾選項

4. 主頁及 Hashtags

  • 桌面和手機介面像素完美

桌面介面

手機介面