Corso React Native

Programma didattico (32 ore)

1. Cos’e React Native
• Introduzione
• Perche utilizzare React Native
• Sviluppare App Ibride
• Vantaggi e Svantaggi

2. Review ReactJS e ES6
• Utilizzo di NPM e Package.json flile
• Yarn
• Imports, arrow function e destructuring
• props e state
• Componenti React
• Functional Components vs Class Components
• Destructuring in Functional Components
• Scrivere Components con const ES6
• PropTypes
• Flow (type checking)

3. React Native
• Come funziona RN
• Virtual DOM vs Native APIs
• Rendering Lifecycle
• Expo
• Come funziona
• Vantaggi e svantaggi
• Installazione expo CLI
• Installazione e RN CLI
• Ambiente di sviluppo (Visual Studio)
• create-react-native-app
• Panoramica comandi react-native (CLI)
• Setup Progetto di esempio
• React Native packager
• Build test e run del progetto sui dispositivi
• Build test e run del progetto sugli emulatori

4. Style in React Native
• Inline style
• Styling con Objects (oggetti javascript)
• Styling con Styleshhet.Create RN
• Utilizzo dell eridatrietà
• Passare stili via props
• Layout con Flexbox, Responsive Design e Fonts
• Utilizzo posizioni assolute e relative

5. React Native Components
• View
• Text e Button
• Image
• ListView e FlatList
• Componenti Platform Specific

6. Lavorare con i progetti nativi
• Dipendenze iOS (pod file)
• Dipendenze Android (build gradle)
• Lanciare il progetto dagli IDE per sviluppo nativo
• Integrazione librerie esterne in Xcode ed Android studio
• Integrazione react-native-vector-icons (uses case)
• Creazione app di esempio;

7. Utilizzo delle periferiche native
• Utilizzare la Geolocalizzazione
• Utilizzare la Fotocamera
• Utilizzare le mappe Google Maps

8. Gesture ed eventi
• Gesture in RN
• Utilizzare TouchableHighlight component
• GestureResponder System
• PanResponder Components

9. Gestione user input e user data;
• Gestione dell input utente
• Visualizzare i dati in un ListView
• Fetching data dal web, e visulizzarli all interno dell App RN

10. React Navigation
• Confgurazione
• Navigazione
• Stack React Navigation
• Passaggio e ricezione parametri via props
• Navigane con Tabs (react-navigation-tabs)
• Navigane con drawer laterale (eact-navigation-drawer)
• La logica di navigazione a stack (react-navigation-stack)
• react-native-screens
• React Navigation vs React Native Navigation
• Async Storage in RN
• Creazione App di Esempio

11. Redux
• Concetti fondamentali
• Action, Store e reducer
• Utilizzo di Redux in RN
• Redux Observable
• epic

12. Tool e Testing in React Native;
• Build apk per progetti Android
• Build plist per progetti iOS
• Eslint, configurazione ed esecuzione
• Watchman
• Test con Jest

13. Pubblicazione;
• iOS Marketplace
• Google Play