React Native
共 2 條筆記
2025-08-12 09:38
您的瀏覽器不支援 audio 元素。 📑 智慧總結 音訊資訊 時長 ：約58分鐘 參與人數 ：約4人 場景型別 ：技術崗位面試訪談 內容總結 候選人技術背景
教育與開發方向 ：候選人Jackson大學本碩均為電腦科學專業，最初學習Java開發，涉及J2EE和安卓專案，後轉向React技術棧，專注於前端和React Native開發，並在GitHub上貢獻過產品。
對Dealer Studio理解 ：Jackson認為Dealer Studio可能是遠端辦公公司，崗位有前後端之分，猜測與汽車行業相關。面試官補充介紹公司主要業務為為汽車經銷商搭建網站、提供內容管理系統、客戶管理系統、移動應用，以及庫存聚合工具和分析，前端使用React、Next.js和React Native等技術。 過往工作技術棧與工具
技術棧 ：Jackson在前端主要使用TypeScript，因React Native產品需求，呼叫Java、Objective - C等原生層能力，使用MongoDB和REST API管理與獲取資料，利用Github actions管理CI/CD，藉助Expo EAS構建和釋出專案，使用React Native測試庫、React Query等進行測試與資料請求管理，還運用React導航等技術。
除錯經驗 ：在iOS開發中，遇到React與React Native專案程式碼複用問題，透過建立共享資料夾放置可複用元件解決；使用相機API等原生API時，因Expo官方文件不足，需參考第三方文件。在選擇React Native專案解決方案時，權衡Expo託管專案、Expo預構建解決方案和純React Native專案的利弊。 UI除錯與HTTP知識
UI除錯工具 ：除錯UI問題時，主要使用Chrome開發工具檢視網路、UI元素和原始碼，利用React Native開發者工具除錯React元件行為，若使用Redux，還會藉助Redux開發工具追蹤資料流，但該工具學習和使用難度較大。
HTTP方法與框架 ：HTTP常見方法有GET、POST、DELETE等，在React或React Native社羣中，Axios是常用的處理HTTP請求的框架，在Node.js後端開發中，使用Express框架結合Axios實現HTTP請求與響應，需用JSON解析響應體，處理異常，考慮非同步請求的同步處理方式。 狀態管理與Git操作
React狀態管理 ：React狀態管理有多種框架，如Redux，透過單向資料流，在一個資料中心管理狀態，核心元件包括action、reducer、dispatcher，便於除錯和元件間通訊；還有其他方式，如使用元件內的useState、props以及自定義hooks進行狀態管理。useEffect用於在元件渲染後執行有副作用的操作，與純函式元件不同。
Git與Github操作 ：候選人日常使用Git命令列管理程式碼，如git add、git commit、git push等，使用git rebase和git merge處理程式碼合併與衝突。在Github上進行程式碼審查、提交pull請求、整合部署、自動化測試和CICD流水線，還利用Wiki模組撰寫文件，支援Markdown格式。 React Native導航與樣式處理
導航處理 ：主要使用React Navigation進行導航，遵循其規則呼叫navigate函式實現頁面跳轉，最新版本可使用App Router技術註冊不同頁面，遇到問題會藉助AI工具解決，尤其關注原生部分開發。
樣式處理 ：React Native不能直接使用CSS，可在元件內編寫樣式屬性，或藉助某些橋樑使用CSS，還可利用元件的內建樣式屬性。日常工作中常藉助AI工具進行樣式處理，提高效率。 應對程式碼修改與時間管理
程式碼修改應對 ：當他人提出刪除自己編寫兩天的程式碼並提供更好解決方案時，首先要充分理解對方意圖，進行調研，瞭解刪除原因，為溝通做好準備；然後明確刪除程式碼的必要性及替代方案，再決定是否同意，同時也會提出自己的建議。
時間管理 ：面臨截止日期和同事可能延誤的情況，先向主管反饋，尋求如推遲幾天或調整任務優先順序等建議；與同事合作，瞭解專案進度，共同探討問題，讓同事提前意識到可能的延誤並在日常會議中說明，以便提前提供幫助。 📅 章節概要 00:00:53 訪談開場與候選人背景詢問 訪談開始，說話人0介紹自己來自美國工作室，與全球團隊成員Lana一同對Jackson進行面試，因其技術評估給團隊留下深刻印象。隨後說話人1開始提問，讓Jackson介紹自己的編碼背景以及如何進入該領域。Jackson表示大學本碩均為電腦科學專業，從Java開發起步，參與過J2EE和安卓專案，之後轉向React技術棧，專注前端和React Native開發，並在GitHub上有產品貢獻，享受前端開發帶來的樂趣和成就感。 00:03:39 對Dealer Studio的探討 說話人2詢問Jackson對Dealer Studio的瞭解。Jackson認為它可能是遠端辦公公司，從崗位描述推測與汽車行業相關。接著說話人2補充介紹公司業務，主要為汽車經銷商搭建網站，涵蓋網站建設、內容管理系統、客戶管理系統、移動應用開發，還有庫存聚合工具和分析等，前端使用React、Next.js和React Native等技術。 00:06:14 過往工作技術棧闡述 說話人2詢問Jackson上一份工作使用的框架和技術。Jackson詳細介紹了自己使用的技術棧，前端以TypeScript為主，因React Native產品需求呼叫Java、Objective - C等原生層能力，使用MongoDB和REST API管理與獲取資料，藉助Github actions管理CI/CD，透過Expo EAS構建和釋出專案到應用商店，還使用React Native測試庫、React Query等進行測試與資料請求管理，以及React導航等技術。 00:10:14 除錯經驗分享 說話人3請Jackson舉例說明除錯過程及解決問題的方法。Jackson講述在iOS開發中遇到React與React Native專案程式碼複用難題，透過建立共享資料夾放置可複用元件解決；使用相機API等原生API時，因Expo官方文件不足，需參考第三方文件。同時，他還介紹了在選擇React Native專案解決方案時，對Expo託管專案、Expo預構建解決方案和純React Native專案三種方案的利弊權衡。 00:15:19 UI除錯與HTTP知識交流 說話人3詢問若UI出現問題如何解決。Jackson表示主要利用Chrome開發工具、React Native開發者工具以及Redux開發工具（若使用Redux）進行除錯。之後說話人3又問到HTTP基本方法及與API互動相關知識，Jackson介紹了HTTP常見方法，以及在React或React Native社羣和Node.js後端開發中處理HTTP請求的框架和相關注意事項，如使用JSON解析響應體、處理異常、非同步請求的同步處理等。 00:20:18 狀態管理相關討論 說話人1請Jackson解釋React中的狀態管理，以及useState和useEffect的區別。Jackson介紹了多種狀態管理框架，以Redux為例說明其單向資料流、核心元件及在大型專案中的優勢，還提及其他狀態管理方式，如useState、props和自定義hooks。同時，他解釋了useEffect用於在元件渲染後執行有副作用的操作，與純函式元件的不同之處。 00:29:29 Git操作說明 說話人3詢問Jackson對基本Git工作的理解。Jackson表示每天使用Git和Github，透過命令列使用git add、git commit、git push等命令管理程式碼，用git rebase和git merge處理程式碼合併與衝突。在Github上進行程式碼審查、提交pull請求、整合部署、自動化測試和CICD流水線，還利用Wiki模組撰寫支援Markdown格式的文件。 00:34:50 React Native導航與樣式處理探討 說話人3詢問Jackson在React Native中如何處理導航。Jackson表示主要使用React Navigation，遵循其規則呼叫navigate函式實現頁面跳轉，新版本可使用App Router技術註冊頁面，遇到問題會藉助AI工具解決，且更關注原生部分開發。接著說話人3詢問樣式處理方式，Jackson介紹了React Native不能直接使用CSS，可在元件內編寫樣式屬性、藉助橋樑使用CSS或利用元件內建樣式屬性，日常常藉助AI工具處理樣式。 00:42:39 程式碼修改與時間管理問題探討 說話人0提出假設問題，若他人提出更好解決方案要刪除自己編寫兩天的程式碼怎麼辦。Jackson表示首先要充分理解對方意圖，進行調研，明確刪除必要性及替代方案，再決定是否同意，同時也會提出自己的建議。之後說話人0又問到面臨截止日期和同事可能延誤的情況如何處理，Jackson稱會先向主管反饋，與同事合作瞭解進度，讓同事提前意識到延誤並在日常會議說明，以便提前提供幫助。 00:56:22 訪談結束 Jackson表示事先深入瞭解了公司資訊，感謝面試官的時間、坦誠與耐心，本次訪談結束。 📋 待辦事項 本次訪談未明確提及待辦事項。
2026-03-19 11:12
您的瀏覽器不支援 audio 元素。 📑 智慧總結 錄音資訊 時長 ：約 0 小時 56 分鐘 參與人數 ：約 4 人 內容型別 ：技術面試 錄音總結 本次是Dealer Studio面向候選人Jackson的React Native開發崗位技術面試，面試官團隊由前端負責人Johnny、移動端團隊成員Lana、移動端高階開發Hamish組成，面試涵蓋背景瞭解、技術提問、程式碼挑戰、行為問題，最終結束面試並告知候選人1-2個工作日內反饋結果。 面試官開場與候選人自我介紹 * 面試團隊自我介紹 ：Johnny為Dealer Studio前端負責人，Lana為移動端團隊成員，Hamish為移動端高階開發，本次面試因面試官對候選人的技術評估表現印象深刻發起。 * 候選人技術背景介紹 ：候選人Jackson本科和碩士均為電腦科學專業，最初從事Java方向開發，做過J2EE與Android專案，之後轉用React技術棧，專注前端與React Native開發，還在GitHub貢獻過開源專案。 * 候選人對公司的初步認知 ：候選人認為Dealer Studio是遠端優先的公司，猜測業務和汽車行業經銷商相關。 公司業務與技術棧介紹 * 團隊分佈與客戶規模 ：公司是遠端企業，團隊成員分佈在澳大利亞多地（珀斯、布里斯班、達爾文），還有1名成員在新加坡，當前運營超過1000個網站，服務800家汽車經銷商。 * 核心業務與技術棧 ：核心業務是為汽車經銷商搭建網站，同時提供CMS、線索管理系統、React Native移動端應用、庫存聚合與分析工具；前端使用React+Next.js，98%以上使用TypeScript，後端使用Ruby on Rails，移動端開發為主，偶爾需要修改後端程式碼。 候選人過往技術棧使用情況 * 核心技術棧明細 ：候選人上一份工作核心為React Native專案，前端使用TypeScript，會呼叫原生層的Java與Objective-C程式碼，使用REST API與MongoDB管理資料，透過GitHub Actions管理CI/CD。 * 專案構建與工具使用 ：候選人使用Expo EAS構建專案併發布到Google Play與App Store，使用React Native Testing Library做測試，使用React Query做資料請求管理，使用NativeWind做樣式開發，使用React Navigation做路由管理。 技術問題：問題排查方法 * 複雜程式碼複用問題解決方案 ：候選人遇到React專案程式碼向React Native專案複用的問題時，會建立shared資料夾，存放可複用的通用元件提升程式碼複用率。 * 原生API適配問題處理 ：候選人遇到Expo官方文件未覆蓋的原生API定製需求時，會查閱第三方文件與原始碼，自行測試解決問題。 * Expo專案三種方案對比 ：Expo託管方案簡單、文件完善但缺少原生API支援；Expo預構建方案支援更多原生API、可使用EAS釋出，但可能和企業現有CI/CD流程衝突；裸React Native方案功能強大但複雜度高，需要同時處理Android與iOS兩端的問題。 * UI問題排查工具 ：遇到UI異常問題時，候選人優先使用Chrome開發者工具檢視網路與UI元素，使用React Native開發者工具除錯元件行為，使用Redux開發者工具追蹤資料流。 技術問題：HTTP基礎方法 * 候選人初始誤解問題方向 ：候選人最初將問題誤解為講解HTTP連線建立過程，講解了DNS解析、三次握手建立連線、四次揮手斷開連線的流程。 * 糾正後的回答內容 ：基礎HTTP方法包括GET、POST、DELETE等，React專案中常用Axios傳送請求，Node.js後端常使用Express框架處理請求，請求響應使用JSON格式傳輸，需要處理異常，且因為HTTP請求是非同步的，需要使用async/await處理Promise返回結果。 技術問題：React狀態管理與Hooks * 狀態管理方案對比 ：Redux功能強大，適合大型專案的多元件通訊，可以追蹤資料流方便除錯，但是需要編寫大量樣板程式碼；Zustand等輕量庫更簡單，不需要手動觸發同步，樣板程式碼更少；元件內部可以使用useState管理本地狀態，也可以透過props做父子元件通訊，還可以自定義Hooks管理狀態。 * useEffect的作用與依賴陣列 ：useEffect用於處理渲染後的副作用，不屬於純函式，會在元件渲染完成後呼叫；依賴陣列用於控制useEffect的觸發次數，傳入空陣列時useEffect只呼叫一次，傳入依賴變數，變數變化時會重新觸發useEffect。 技術問題：Git工作流 * 候選人日常Git使用習慣 ：候選人每天都會使用Git和GitHub，習慣在終端使用命令列操作Git，不使用圖形介面工具。 * 基礎工作流內容 ：日常使用 git add 、 git commit 提交程式碼， git pull 拉取遠端最新程式碼，解決衝突後合併， git push 推送到遠端倉庫；在GitHub上發起Pull Request做程式碼評審，配置CI/CD流水線自動測試部署，還可以使用GitHub Wiki編寫文件，使用發版功能管理不同版本。 技術問題：React與React Native差異 * 核心差異說明 ：React執行在瀏覽器中，基於DOM，使用HTML與CSS實現介面；React Native會將元件編譯為對應平臺的原生UI控制元件，最終輸出是原生應用。 * 可複用部分說明 ：兩者可以複用自定義Hooks、通用業務邏輯、工具函式、基礎UI邏輯等內容，減少重複開發。 技術問題：React Native基礎開發問題 * 路由管理方式 ：候選人主要使用React Navigation庫做路由管理，最新版本支援App Router技術，可以註冊頁面，呼叫導航方法跳轉頁面，開發時會藉助AI工具獲取分步指導。 * 樣式開發方式 ：React Native不能直接使用CSS，預設使用JavaScript StyleSheet編寫樣式，也可以透過橋接工具使用CSS，還可以藉助AI工具快速完成樣式開發。 JS事件迴圈程式碼挑戰 * 候選人給出的答案 ：題目是帶延遲0的setTimeout、普通同步log、Promise then的輸出順序問題，候選人認為輸出順序和程式碼編寫順序完全一致。 * 面試官講解正確答案 ：正確輸出順序是同步log → Promise then → setTimeout；JavaScript是單執行緒，存在宏任務與微任務佇列，Promise屬於微任務，會在當前同步程式碼執行完成後立即執行，setTimeout屬於宏任務，即使延遲設定為0，也會等到所有同步程式碼和微任務執行完成後再執行。 行為問題：PR被要求刪除全部程式碼的應對方案 * 候選人應對思路 ：首先會自行研究對方的方案，充分理解為什麼要刪除現有程式碼，之後如果認可對方方案，會完全接受對方的更優方案；如果不認可，會清晰給出自己的理由溝通，若溝通無法達成一致，可以找專案經理介入協調。 * 面試官對回答的評價 ：面試官認可候選人的回答思路，提醒候選人接到任務後先明確需求，可以避免做無用功。 行為問題：作為團隊lead無法按時交付的應對方案 * 候選人應對思路 ：首先會主動向上級專案經理反饋風險，詢問能否延期交付或者調整任務優先順序；之後會和初級開發一起解決問題，幫助對方推進進度；最後會做覆盤，要求團隊成員在每日站會主動提出遇到的阻塞問題，提前暴露風險提前處理。 * 面試官對回答的評價 ：面試官認可候選人的思路，該思路體現了責任心，會主動保護團隊成員，提前暴露問題，公司內部也會採用主開發加輔助開發的配置，方便遇到風險時及時增派人手。 面試收尾環節 * 候選人入職時間與工作許可權 ：候選人當前待業，可以一週內入職，並且擁有澳大利亞永久居留權，可以全職合法工作。 * 後續流程說明 ：面試官告知候選人會在1-2個工作日內給出面試結果，透過郵件反饋。 📅 章節概要 00:00:51 面試開場與團隊自我介紹 本次面試是Dealer Studio針對React Native開發崗位的招聘面試，面試團隊由前端負責人Johnny、移動端團隊成員Lana、移動端高階開發Hamish組成。Johnny開場說明，面試官團隊對候選人Jackson的技術評估結果非常滿意，因此發起本次面試，由Hamish率先開始提問。 00:01:40 背景瞭解環節 Hamish首先請Jackson介紹個人編碼背景，Jackson說明自己本科和碩士均為電腦科學專業，最初做Java方向開發，有J2EE和Android專案經驗，之後轉React技術棧，專注前端與React Native開發，還在GitHub做過開源貢獻。隨後Hamish請Jackson介紹對Dealer Studio的瞭解，Jackson認為公司是遠端優先企業，猜測業務和汽車行業經銷商相關。 00:05:06 面試官介紹公司業務與技術棧 面試官確認Dealer Studio確實是遠端企業，團隊成員分佈在澳大利亞多地，還有1名成員在新加坡，目前運營超過1000個網站，服務800家汽車經銷商。公司核心業務是為汽車經銷商搭建網站，同時提供內容管理系統、線索管理系統、React Native移動端應用、庫存聚合與分析工具；技術棧方面，前端用React+Next.js，98%以上用TypeScript，後端用Ruby on Rails，移動端開發為主，偶爾需要修改後端程式碼。 00:07:17 候選人過往技術棧使用情況分享 Hamish請Jackson介紹上一份工作使用的技術棧，Jackson說明核心是React Native專案，前端用TypeScript，會呼叫原生層的Java和Objective-C程式碼，用REST API和MongoDB管理資料，透過GitHub Actions做CI/CD，使用Expo EAS構建專案併發布到應用商店，用React Native Testing Library做測試，React Query做資料請求管理，NativeWind做樣式，React Navigation做路由。 00:10:10 技術提問：問題排查實踐 Lana請Jackson分享最近解決的技術問題，Jackson分享了三類常見問題：第一是React程式碼向React Native複用時，透過建立shared資料夾存放可複用元件提升複用率；第二是Expo文件未覆蓋的原生API需求，需要查閱第三方文件和原始碼自行測試；第三是對比了三種Expo專案方案的優缺點：託管方案簡單但原生API支援不足，預構建方案支援更多原生API但可能和企業流程衝突，裸React Native方案功能最強但複雜度最高。隨後Lana詢問UI異常的排查方法，Jackson說明會用Chrome開發者工具、React Native開發者工具、Redux開發者工具分別排查不同問題。 00:17:21 技術提問：HTTP基礎 Lana請Jackson解釋基礎HTTP方法，Jackson最初誤解問題，講解了HTTP連線建立的DNS解析、三次握手、四次揮手流程。Johnny糾正問題方向後，Jackson說明基礎方法包括GET、POST、DELETE，專案中常用Axios傳送請求，Node.js後端用Express處理請求，響應用JSON格式，需要處理非同步請求和異常，用async/await處理Promise。 00:22:13 技術提問：React狀態管理與Hooks Lana請Jackson解釋React狀態管理，以及useState和useEffect的差異，Jackson說明Redux適合大型專案，功能強大可追蹤資料流但樣板程式碼多，Zustand等輕量庫更簡單，樣板程式碼少，元件內部可用useState管理本地狀態。隨後Johnny詢問useEffect依賴陣列的作用，Jackson說明依賴陣列控制觸發次數，空陣列只執行一次，依賴變化時重新觸發。 00:29:22 技術提問：Git工作流 Lana請Jackson說明日常使用的Git基礎工作流，Jackson說明習慣在終端用命令列操作，日常用git add、git commit提交，git pull拉取合併程式碼，解決衝突後git push推送到遠端，在GitHub發起Pull Request做程式碼評審，配置CI/CD自動測試部署，還可以用Wiki寫文件，管理專案發版。 00:32:16 技術提問：React與React Native差異 Lana請Jackson說明React和React Native的核心差異，Jackson說明React執行在瀏覽器，基於DOM使用HTML和CSS，React Native會把元件編譯為對應平臺的原生控制元件，最終生成原生應用，兩者可以複用自定義Hooks、業務邏輯、工具函式等內容。 00:34:50 技術提問：React Native開發基礎 Lana依次詢問了React Native開發的幾個基礎問題：路由管理方面，Jackson主要用React Navigation，最新版本支援App Router，開發時會藉助AI獲取分步指導；可滾動列表元件，Jackson沒能準確說出FlatList，Lana補充說明FlatList效能優於ScrollView，因為它只渲染螢幕可見區域的內容；樣式開發方面，React Native預設用JavaScript StyleSheet，也可以透過橋接使用CSS，日常開發會藉助AI工具快速完成樣式編寫。 00:41:08 JS事件迴圈程式碼挑戰 Johnny給出一道關於JS事件迴圈的程式碼題，題目包含同步log、延遲0ms的setTimeout、Promise then，要求給出輸出順序並解釋原因，Jackson認為輸出順序和程式碼順序一致。Johnny講解正確答案，正確順序為同步log → Promise then → setTimeout，核心原因是JavaScript單執行緒，Promise屬於微任務會在同步程式碼執行完立即執行，setTimeout屬於宏任務，需要等所有微任務執行完才會執行。 00:45:35 行為問題：PR程式碼被要求全部刪除的應對 Johnny給出第一個行為問題：如果自己寫了幾天的PR被同事要求全部刪除替換為新方案，該如何處理。Jackson的應對思路是：先自行研究對方方案理解原因，認可方案就接受，不認可就清晰溝通，溝通無果可以找經理介入。Johnny認可這個思路，補充提醒接到任務先明確需求，可以避免做無用功。 00:50:34 行為問題：作為team lead無法按時交付的應對 Johnny給出第二個行為問題：晉升為team lead後帶領專案，因為初級開發能力不足無法跟上進度，專案無法按時交付該如何處理。Jackson的應對思路是：先主動向上級專案經理反饋風險，申請延期或者調整優先順序，然後和初級開發一起解決問題推進進度，最後覆盤要求團隊在每日站會提前暴露阻塞風險。Johnny非常認可這個思路，稱該思路體現了合格的領導力，公司內部也會採用主開發加輔助開發的配置，方便遇到風險時及時增派人手。 00:55:12 面試收尾確認資訊 面試進入收尾環節，Johnny確認候選人的可入職時間和工作許可權，Jackson說明當前待業，可以一週內入職，並且擁有澳大利亞永久居留權，可全職合法工作。Johnny告知候選人，面試官團隊會在1-2個工作日內完成評估，透過郵件傳送面試結果，結束本次面試。 ✨ 金句精選 “If there comes a better solution, why not just use it? I’m totally open to it.” (執行策略) “We all just want to polish the products and we want to make it better.” (思考啟發) “If everything is too late to be noticed, then it’s kind of hard to rescue.” (執行策略) 📋 待辦事項 Johnny：1-2個工作日內完成面試評估，給Jackson傳送反饋郵件 Jackson：等待Dealer Studio的面試結果反饋