採用向けベスト React Native テスト

標準的なJavaScriptテストがReact Nativeに失敗する理由

多くの企業はJavaScriptアセスメントまたはフロントエンド開発者テストを使用してReact Nativeエンジニアを採用しています。これは間違っています。React Nativeはレイアウトの構文を共有していますがConstraints、落とし穴、設計パターンは完全に異なります。

フロントエンドコーディングテストに合格した候補者はReact Nativeで失敗する可能性があります。彼らが悪いからではなく、React Nativeは異なるトレードオフを強制するからです。

React Native採用を異なるものにするもの

ブリッジ問題

React Nativeでは、JavaScriptとネイティブコード間の境界について考える必要があります。Webデベロッパーはこれを決してしません。React Nativeエンジニアは以下を理解する必要があります：

• JavaScriptからネイティブモジュールを呼び出す方法
• メインスレッドをブロックするとどうなるか（即座にアプリがフリーズ）
• レイアウトがどのように異なるか（CSSはなく、異なるボックスモデル）
• 2つのランタイム全体でデバッグします（JSのChrome DevTools、ネイティブのXcode/Android Studio）

JavaScriptとネイティブ間のこのギャップは、悪い採用が来る場所です。

パフォーマンスはより難しい

Webデベロッパーは遅くことができ、それで逃げることができます。React Nativeはラップトップのメモリの半分を持つ電話で実行されます。パフォーマンスが重要です：

• 最適化なしで1000アイテムのフラットリストレンダリングは遅い
• 画像キャッシングが重要
• バンドルサイズは起動時間に影響します
• ブリッジシリアル化は高価です（ネイティブ呼び出しが多すぎる=レイテンシー）

パフォーマンスについて考えたことのない優秀なWebデベロッパーはReact Nativeを遅く書きます。

テストが異なる

Web：jsdom、Jest、React Testing Libraryでテストします。React Native：プラットフォーム固有のテストはより難しい。多くのReact Nativeエンジニアはほとんどテストしません。テストの適性をテストしないアセスメントはシグナルを見落とします。

理想的なReact Nativeアセスメント構造

フェーズ1：スクリーン（30分ライブ）

特定のバグを含む半構築アプリを提供します。例：

「このアプリはAPIからのユーザーのページ分割されたリストを表示します。一番下にスクロールすると、次のページをフェッチします。しかし、リストは読み込み時に吃ります（フレームをドロップします）。ボトルネックを見つけて、修正方法を説明してください。」

これがテストする内容

• React Nativeパフォーマンスについて推論できますか？
• FlatList、keyExtractor、最適化を知っていますか？
• ブリッジを理解していて、ネイティブコードが重要な理由を理解していますか？
• コードを実行せずに診断できますか？

Webデベロッパーはメモ化を提案するかもしれません。React Nativeエンジニアはフラットリスト最適化が実際の答えであることを知っています。

フェーズ2：テイクホーム（90分）

「シンプルなメモアプリを作成してください。ユーザーはメモを作成、編集、削除できます。メモはデバイスストレージに保持されます。要件：

• AsyncStorageを使用して永続性を実現
• メモが読み込まれている間に読み込み状態を表示
• ストレージが満杯の場合を処理
• リストと詳細画面間のナビゲーション」

これがテストする内容

• 完全な機能を作成できますか？
• 永続性について考えていますか？
• エッジケース（ストレージが満杯、破損したデータ）を処理していますか？
• React Navigationを効果的に使用できますか？
• コードは整理されてテスト可能ですか？

採点ルーブリック：

• 実行されますか？（50%）
• 要件は満たされていますか？（30%）
• 保守可能ですか？（20%）

完璧を期待しないでください。働いている、思慮深いコードを期待してください。

フェーズ3：ウォークスルー（30分）

質問：

• 「メモがどのように保存されるか説明してください。ユーザー入力からストレージへのフローは何ですか？」
• 「メモが保存されている間、ユーザーがアプリを閉じるとどうなりますか？」
• 「これをどのようにテストしますか？何をテストしますか？」
• 「メモをクラウドに同期する必要があった場合、何を変更しますか？」

これは明かします：

• 自分のコードを理解していますか、それともコピーしましたか？
• 故障モードについて考えていますか？
• アーキテクチャのトレードオフについて推論できますか？

深さのブリッジ問題

これは最も重要な採用フィルターです。ウォークスルーでこの質問をしてください：

「デバイスに大きなファイルを保存する必要があります。ネイティブモジュール（Objective-CまたはKotlin）を書いて、これを効率的に行います。JavaScriptコードはこのモジュールを呼び出します。これをどのように構造化しますか？ファイルが大きすぎる場合はどうなりますか？進行状況をどのように処理しますか？」

答えは彼らが以下を理解しているかどうかを明かします：

• ネイティブモジュール構造
• ブリッジシリアル化制限
• 2つのランタイム全体の非同期パターン
• クロス言語コードのエラー処理

Webデベロッパーはこれについて考えません。React Nativeエンジニアです。

テスト規律

テストできないReact Nativeエンジニアは採用リスクです。彼らはリファクタリングが難しいコードを書きます。これをアセスメントに追加してください：

「メモ保存ロジックのテストをどのように書きますか？何をテストしますか？何がテストするのが難しいですか？」

良い答え：テストはAsyncStorageが呼ばれることを確認し、エラーが処理され、UIが更新されることを確認します。難しい部分：実際のデバイスストレージ動作をテストします。

弱い答え：「Jestテスト？私はすべてをモックして、関数が呼ばれるかをチェックします。」

React Nativeアセスメントの赤信号

ネイティブコードが多すぎる

アセスメントがKotlinまたはSwiftの記述を要求する場合、React Nativeエンジニアリングではなく、プラットフォーム専門知識をテストしています。React Nativeエンジニアはネイティブモジュールを使用できるべき、必ずしも書く必要はありません。

Webのような機能が多すぎる

「OAuthを使用した完全な認証システムを構築する」はReact Nativeスキルをテストしません。それはOAuth前にしたことがあるかどうかをテストします。

エッジケースが不足している

オフラインサポート、データ永続性、またはパーミッション処理を無視するアセスメントは不完全です。

パフォーマンス制約がない

パフォーマンスを考えずに「アプリを作る」はあまりに簡単です。

候補者のソリューションを比較

2つのソリューションは両方とも機能する可能性があります。どのように区別しますか？

候補者A：

• keyExtractorでFlatListを使用
• サービスレイヤーでラップされたAsyncStorage
• エラーを処理します（ストレージが満杯、許可が拒否されました）
• テストが書かれていない
• コードは整理されていますが防御的です

候補者B：

• FlatListを正しく使用
• JSON シリアル化を処理するラッパーを備えたAsyncStorage
• エラーとエッジケースを処理
• テストを含みます（Jest +モックAsyncStorage）
• コードは清潔で、小さく、テスト可能です

候補者Bがより良い。アプリが機能するから（両方が機能する）ではなく、保守性とテストについて考えているからです。

React Webバックグラウンドを使用したReact Nativeの評価

候補者がReactバックグラウンドが強力でReact Nativeエクスペリエンスがない場合は、期待を調整してください：

• 構文とコンポーネント思考はすぐに転送される
• 状態管理（Redux、Zustand）パターン転送
• テストパターン（Jest、モック）はほぼ転送

しかし、彼らは苦労します：

• ナビゲーション（React Routerはreact Navigationと異なります）
• パフォーマンスチューニング
• ネイティブモジュール統合
• デバイスメモリ制約の観点から考える

アセスメントはまだフルスタックをテストする必要がありますが、学習曲線では穏やかにすることができ、転送される中核推論スキルに焦点を当てることができます。

アセスメントの実装

モバイル開発者を規模で評価している場合、React NativeはネイティブiOS またはAndroidとは異なるツールとトレードオフを持つことを考慮してください。アセスメントを混ぜないでください。React Nativeエンジニアは独自のパイプラインが必要です。

3つのフェーズ（ライブスクリーン、テイクホーム、ウォークスルー）は候補者時間の約2.5時間と面接官時間の1.5時間がかかります。これはミッドレベルロールに適切です。

シニアReact Nativeエンジニアの場合は、30分のアーキテクチャディスカッションを追加してください：「APIからデータをフェッチして、ローカルにキャッシュし、オフラインで同期するアプリを構築しています。これをどのように構成しますか？どのライブラリを使用しますか？」

避けるべき一般的な間違い

• Webフレームワーク（React DOM、Next.js等）をテストしないでください
• 特定の状態管理ライブラリの知識を要求しないでください
• CSSまたはスタイリングに関するアセスメントを作成しないでください
• すべてのプラットフォーム（Android、iOS、Web）を使用したと仮定しないでください

焦点を当てます：

• React Fundamentals
• JavaScriptの基礎
• React Native固有のパターン（FlatList、AsyncStorage、Navigation、Bridge）
• デバイスConstraintsとパフォーマンス思考

このフレームワークを使用して、テスト結果を公正で一貫して解釈してください候補者全体で。