前端問題在HackerRank面試中

Last updated: December 12, 2024

概述 

HackerRank 面試包含前端框架，Angular 和 React。

候選人可以在一個高度響應、穩定且熟悉的編輯器上解決前端問題，無需擔心在面試期間熟悉新編輯器或平台中斷的問題。

使用前端框架啟動面試

  1. 在你作為面試官登錄面試後，可以從面試登陸頁面點擊前端框架來開始前端面試。

你可以參考這個影片來開始前端面試。

從零開始

HackerRank Interviews 為您提供一個簡單的專案作為此選項的起點。您可以在面試前或面試期間修改專案以符合您的需求。
體驗全新的無容器 VS Code IDE，帶來更快的載入速度和穩定的 IDE，能在不穩定的網路連線下無縫運作。開發者在編碼時可以享有更快、更準確的自動完成。

terminal.png

增強的 IDE 功能

  • 內建即時預覽
    • IDE 在右側窗格開啟一個內建預覽視窗。您或候選人所做的任何更改都可以在 預覽 標籤中看到。 preview_tab.png
    • 由於 IDE 是無容器的，您可以在瀏覽器中查看預覽。點擊瀏覽器圖示 browser_icon.png以在瀏覽器中查看預覽。
    • 您也可以選擇響應式視圖（平板、手機、桌面等）來預覽。點擊圖示 responsive_modeicon.png來查看響應式視圖。preview_tour.gif
  • 測試執行
    • 您可以點擊 測試 標籤來執行測試案例。點擊 執行測試 選項。輸出結果會顯示出來。tests.gif
  • 內建開發工具  
    • 開發工具位於預覽窗格的下方。您可以點擊「開發工具」選項來啟動相應框架的控制台。  
    • 控制台作為協作工具。面試官和候選人可以實時看到彼此的變更。devtools.gif
  • 依賴管理器
    • 在 IDE 的左側窗格中，您可以找到 依賴 搜索欄，點擊立方體圖示即可。dependencies.gif您可以搜尋您想要的依賴並點擊 加入 來添加。新增的依賴會更新到 package.json 檔案中。
  • 外部 CSS 和 Javascript 支援
    • 外部資源位於左側窗格。輸入外部 CSS 和 JavaScript 資源的 URL 至外部資源地址，以格式化和樣式化 UI。externl_resources.gif
  • 其他 UI 增強功能
您可以在以下片段中查看基於 VS Code 編輯器的其他 UI 增強功能。ui_tour.gif

從問題庫導入

此選項將帶您到面試中的庫部分。在這裡，您可以從 HackerRank 庫中選擇一個問題或公司內部創建的問題。 import_lib.png

點擊 使用 以啟動問題並開啟 IDE。IDE 會啟動。

terminl_candidt.png

導入您的專案

此選項允許您透過上傳自己的專案 zip 檔或從公開 Git URL 添加，來選擇您的面試起始碼。以適當的名稱保存專案，以便在後續的面試中檢索。導入後，專案會在 HackerRank 的專案 IDE 中載入。

image4.png

注意： 項目允許的最大檔案大小為5MB。此流程不包含新的IDE功能。此流程目前處於測試階段。

mceclip0.png

一旦您上傳了專案，您可以在 最近使用 區域找到它，該區域在您開始新的面試時會顯示在首頁上。