Corso React-Native
React Native è un framework sviluppato dal Lab Facebook per lo sviluppo mobile cross-platform. E’ basato su Javascript e ha lo stesso design di React.
La particolarità di React Native è che non sviluppa applicazioni ibride o HTML5. React Native costruisce “reali” app mobile utilizzando le stesse UI blocks (User Interface) native di iOS e Android. Programmando ovviamente una volta sola con Javascript e React.
Sono sviluppate con React Native le applicazioni mobile di molte grandi aziende come Facebook, Istagram, AirBnB, Walmart, Adidas, UberEats, Tesla e molte altre.
Corso-React-Native erogato anche in modalità Online-Classe Virtuale.
Obiettivo: fornire una solida base teorica che permetta di inquadrare architetturalmente il framework e dare conoscenze pratiche che permettano allo sviluppatore di muoversi con indipendenza in un progetto React Native. Ogni giornata è organizzata con lezioni teoriche di inquadramento degli argomenti ed esercitazioni guidate studiate ad hoc che si pongono l’obiettivo di portare ogni sviluppatore verso l’autonomia nello sviluppo di App mobile
Requisiti: corso rivolto a sviluppatori front-end. Necessarie basi di Javascript, HTML,
CSS, concetti di programmazione ad oggetti, protocollo http (utili ma non indispensabili conoscenze sullo sviluppo moble nativo)
Consigliabile seguire con un Mac Apple specialmente per il deploy e pubblicazione per l’APP iOS
Corso React-Native erogato solo su richiesta e per le aziende. Modalità virtual classroom online o frontale.
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
