$ npm install @escalated-dev/escalated-react-nativeなぜEscalatedか
React NativeにEscalatedを選ぶ理由
カスタマー向けサポート体験のために設計されたTypeScriptネイティブライブラリ。
React Queryデータレイヤー
チケット、記事、ミューテーションはReact Queryフックで管理されます。自動キャッシュ、バックグラウンドリフェッチ、楽観的更新。
全体を通したTypeScript
すべてのコンポーネント、フック、サービスが完全に型付けされています。オートコンプリート、コンパイル時チェック、anyタイプはゼロ。
認証フックシステム
ログイン、ログアウト、登録、トークンリフレッシュの動作をオーバーライド。デフォルトのBearerトークン実装を使用するか、独自の認証フローを接続できます。
はじめに
仕組み
ゼロから動作するヘルプデスクまで3ステップ。
パッケージをインストール
npm install @escalated-dev/escalated-react-native
ピア依存関係をインストール
npx expo install @react-navigation/native react-native-screens react-native-safe-area-context
アプリをラップ
EscalatedProviderでアプリをラップし、APIベースURLを渡し、React Navigationにスクリーンを接続します。
機能
React Native向けに構築
React Nativeアプリでのカスタマーサポート体験に必要なすべて。
React Queryフック
useTickets、useCreateTicket、useReplyTicket、useArticlesなど。自動キャッシュ無効化とバックグラウンド同期。
React Navigation統合
すべてのスクリーンがReact Navigationで動作します。createEscalatedTabs()でプリビルトナビゲーターを使用するか、スクリーンを個別に接続します。
ダーク＆ライトテーマ
ThemeProviderとuseThemeフックによる完全なテーマサポート。手動切り替え付きでシステム設定を尊重。
4言語i18n
英語、スペイン語、フランス語、ドイツ語の翻訳が含まれています。すべてのカスタマー向け文字列はローカライズ可能。
設定可能なデザイントークン
EscalatedConfigを通じてプライマリカラー、ボーダーラジウス、スペーシングをオーバーライドし、ブランドに合わせます。
完全なスクリーンセット
ログイン、登録、チケットリスト、チケット作成、返信付きチケット詳細、ナレッジベース、ゲストアクセス、設定 — すべてプロダクション対応。
コード
シンプルな統合
数行でReact Nativeアプリにカスタマーサポートを追加。
// App.tsx import { EscalatedProvider, createEscalatedTabs } from '@escalated-dev/escalated-react-native'; import { NavigationContainer } from '@react-navigation/native'; const SupportTabs = createEscalatedTabs(); export default function App() { return ( <EscalatedProvider baseUrl="https://api.example.com" primaryColor="#6366f1" > <NavigationContainer> <SupportTabs /> </NavigationContainer> </EscalatedProvider> ); }