react-native-architecture

Überblick

Was ist react-native-architecture?

react-native-architecture bietet eine praxisorientierte Vorlage zum Aufbau skalierbarer, produktionsreifer React Native Mobile-Anwendungen. Der Fokus liegt auf Expo, fortgeschrittener Navigation, Integration nativer Module, Offline-First-Ansätzen und einer robusten Projektstruktur. Diese Skill richtet sich an Frontend-Entwickler und Mobile-Teams, die die App-Auslieferung beschleunigen und dabei bewährte Methoden einhalten möchten.

Für wen ist diese Skill geeignet?

• Entwickler, die neue React Native- oder Expo-Projekte starten
• Teams, die komplexe Navigations- oder Authentifizierungsabläufe umsetzen
• Projekte, die native Modul-Integration oder Plattform-APIs benötigen
• Apps, die Offline-Unterstützung und zuverlässiges State-Management erfordern
• Alle, die React Native Performance optimieren oder CI/CD für Mobile einrichten

Welche Probleme werden gelöst?

• Verkürzte Einrichtungszeit durch bewährte Projektstruktur
• Klare Entscheidungshilfe für Expo vs Bare React Native
• Anleitung zur Integration nativer Module und Plattform-APIs
• Unterstützung von Offline-First und plattformübergreifender Entwicklung
• Hilft bei der Pflege skalierbarer, wartbarer Codebasen

Verwendung

Installationsschritte

1. Fügen Sie die Skill Ihrem Agent mit folgendem Befehl hinzu:

   npx skills add https://github.com/wshobson/agents --skill react-native-architecture
   

2. Öffnen Sie die Datei SKILL.md für eine Übersicht und Workflow-Anleitung.
3. Lesen Sie unterstützende Dateien wie README.md, AGENTS.md und metadata.json für weiterführende Informationen.
4. Erkunden Sie die Verzeichnisse rules/, resources/, references/ und scripts/ für Implementierungsdetails und Hilfsprogramme.

Überblick zur Projektstruktur

Die empfohlene Struktur umfasst:

• src/app/: Expo Router Screens, organisiert nach Navigationstyp (z.B. auth, tabs)
• src/components/: UI- und funktionsspezifische Komponenten
• src/hooks/: Eigene React Hooks
• src/services/: API- und native Service-Integrationen
• src/stores/: State-Management-Logik
• src/utils/: Hilfsfunktionen
• src/types/: TypeScript-Typdefinitionen

Expo vs Bare React Native

• Expo: Einfachere Einrichtung, verwaltete native Module, schnelle Over-the-Air-Updates
• Bare React Native: Mehr Kontrolle, manuelles Verlinken nativer Module, höhere Komplexität
  Wählen Sie Expo für die meisten Projekte, außer Sie benötigen benutzerdefinierten nativen Code, der von Expo nicht unterstützt wird.

Anpassung der Skill

Statt Dateien direkt zu kopieren, passen Sie Architektur und Muster an Ihr eigenes Repository, Ihre Toolchain und Teamkonventionen an.

FAQ

Was ist der Hauptvorteil von react-native-architecture?

Es bietet einen klaren, skalierbaren Ausgangspunkt für React Native Projekte, reduziert Einrichtungszeit und technische Schulden.

Kann ich diese Skill mit bestehenden React Native Projekten verwenden?

Ja, Sie können die empfohlene Struktur und Muster schrittweise übernehmen, um die Wartbarkeit zu verbessern.

Ist diese Skill nur für Expo?

Nein. Obwohl Expo für die meisten Anwendungsfälle empfohlen wird, unterstützt die Architektur auch Bare React Native, wenn Sie benutzerdefinierte native Integrationen benötigen.

Wo fange ich nach der Installation an?

Beginnen Sie mit der Datei SKILL.md für eine Übersicht, und erkunden Sie dann die Dateistruktur für detaillierte Anleitungen und Beispiele.

Wie sehe ich alle verfügbaren Dateien und Skripte?

Verwenden Sie den Reiter "Files", um den kompletten Dateibaum einschließlich verschachtelter Referenzen und Hilfsskripte zu durchsuchen.