React Native

Book description

Dieses Buch gibt eine praktische Einführung in React Native, ein neuartiges Framework zur Entwicklung plattformübergreifender, nativer Apps mit JavaScript. React Native bietet eine vollwertige und agile Alternative zu den herkömmlichen Ansätzen der App-Entwicklung für Android und iOS, die in der Regel deutlich schwerfälliger und zeitraubender sind.Das Buch richtet sich hauptsächlich an Programmierer mit grundlegenden JavaScript-Kenntnissen. Sie lernen die Prinzipien kennen, die für die Entwicklung mit React Native erforderlich sind. Anhand einer Beispiel-App, die im Laufe des Buches parallel für Android und iOS entwickelt wird, werden die wichtigsten Komponenten und APIs des Frameworks beschrieben. In kurzer Zeit werden Sie selbst in der Lage sein, native Apps mit nur einer Quellcode-Basis für Android und iOS zu erstellen.

Table of contents

  1. Cover
  2. Titel
  3. Impressum
  4. Inhalt
  5. Einleitung
  6. 1 React Native kurz vorgestellt
    1. React Native: viele Vorteile, wenige Einschränkungen
    2. Architektur und Funktionsweise des Frameworks
    3. Zusammenfassung
  7. 2 Erste Schritte mit React Native
    1. Vorbereitungen und Installation
    2. Einen Editor für die Programmierung auswählen
    3. Die App Expo auf das Smartphone laden
    4. Node.js auf dem Rechner installieren
    5. Installation von create-react-native-app
    6. Entwicklung der ersten App
    7. Ein Projekt für React Native erstellen
    8. Die App auf dem Smartphone mit Expo testen
    9. Aufbau und Inhalt des Projekts
    10. Texte ändern und Button einfügen
    11. Styling der App anpassen
    12. Verhalten des Buttons zum Setzen des Zählers
    13. Zusammenfassung
  8. 3 React Native: die Grundlagen
    1. Relevante Neuerungen in JavaScript
    2. Aus Modulen importieren und exportieren
    3. Klassen
    4. Konstanten und Variablen (const und let)
    5. Pfeilfunktionen
    6. Netzwerkzugriff mit fetch und asynchrone Funktionen
    7. Weitere nützliche Neuerungen in Version ES2015 und später
    8. React: ein deklaratives Programmiermodell für UI-Komponenten
    9. Deklarative Komponenten mit JSX und props
    10. Das Programmiermodell von React-Komponenten
    11. Zusammenfassung
  9. 4 Plattformübergreifende UI-Komponenten verwenden
    1. View und Text
    2. Texte darstellen mit Text
    3. Komponenten mit View zusammenfassen
    4. Benutzereingaben mit TextInput
    5. Einfache Listen mit FlatList
    6. Bedienbarkeit von TextInput verbessern
    7. Sichtbarkeit mit KeyboardAvoidingView gewährleisten
    8. Referenzen auf Komponenten mit ref setzen
    9. SectionList für Listen mit Abschnitten
    10. Button und die Touchable-Komponenten
    11. Code durch Komponenten strukturieren
    12. Zusammenfassung
  10. 5 Styling des Layouts und des Erscheinungsbilds
    1. Styling allgemein
    2. Styles in JavaScript-Objekten definieren und verwenden
    3. Von Inline-Styles zur StyleSheet-API
    4. Größe und Anordnung von Komponenten
    5. Breite und Höhe
    6. Flexbox-Layout
    7. Text zentrieren und Eingabefeld am unteren Rand darstellen
    8. Gestaltung und Erscheinungsbild
    9. Farben und Schrift
    10. Rahmen um Komponenten darstellen
    11. Äußere und innere Abstände (margin und padding)
    12. SectionList stylen
    13. Komponenten absolut positionieren
    14. Zusammenfassung
  11. 6 Fotos mit der Kamera aufnehmen
    1. Tagebucheintrag als Komponente
    2. Code der eigenen Komponenten im Projektordner organisieren
    3. Einträge mit Uhrzeit und mehrzeiligem Text
    4. Bilder mit Image einbinden
    5. Texteingabe und Icon als kombinierte Komponente
    6. Kamera ansteuern und Foto übernehmen
    7. Foto im Tagebucheintrag darstellen
    8. Zusammenfassung
  12. 7 Daten lokal speichern und aus dem Web laden
    1. Lokale Datenspeicherung mit AsyncStorage
    2. Löschen der Daten ermöglichen
    3. Bemerkungen zu AsyncStorage
    4. Daten aus dem Web mit fetch einbinden
    5. Aktuelle Wetterdaten für den Standort anfordern
    6. Zusammenfassung
  13. 8 Navigation zwischen mehreren Screens mit Tabs
    1. Die Bibliothek react-navigation
    2. Screens für Tagebuch, Fotogalerie und Einstellungen vorbereiten
    3. Die Funktionsweise von TabNavigator
    4. Eine Tableiste für MyJournal
    5. Einheitliche Tableiste in Android und iOS
    6. Fotogalerie und Einstellungen umsetzen
    7. Zusammenfassung
  14. 9 Detailansicht und Editor mit StackNavigator einbinden
    1. Funktionsweise von StackNavigator
    2. StackNavigator in die Navigationsstruktur aufnehmen
    3. Eine Route im StackNavigator ansteuern
    4. Styling der Kopfleiste in StackNavigator anpassen
    5. Tagebucheintrag in der Detailansicht darstellen
    6. Von der Fotogalerie zur Detailansicht navigieren
    7. Editor für Tagebucheinträge erstellen
    8. Bearbeiten von Tagebucheinträgen ermöglichen
    9. Wetterdaten und Standort im Editor anfragen
    10. Zusammenfassung
  15. 10 Auf Touchgesten reagieren und Animationen anzeigen
    1. Gesture Responder System
    2. Auf Touchgesten mit PanResponder reagieren
    3. Wischbewegung auf Tagebucheinträgen erkennen
    4. Animationen in React Native einsetzen
    5. Eine Wischbewegung animieren
    6. Listeneintrag mit Animation ausblenden und löschen
    7. Zusammenfassung
  16. 11 Abschluss und Ausblick
  17. Fußnoten
  18. Index
  19. Über die Autoren

Product information

  • Title: React Native
  • Author(s): Erik Behrends
  • Release date: March 2018
  • Publisher(s): dpunkt
  • ISBN: 9783960090663