SlideShare une entreprise Scribd logo
1  sur  37
SKILLVALUE
REACT NATIVE MASTER CLASS
BENOIT FILLON
Deputy CEO / CTO SKILLVALUE FREELANCERS
28/06
2018
SKILLVALUE VALUE YOUR SKILLS THE SMART WAY
MASTERCLASS AGENDA
OBJECTIF
FAIRE UNE APPLICATION AVEC REACT NATIVE
Les concepts
Un cas pratique dont vous aurez le source sur GitHub
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
AGENDA
• PART I > Learn the basics
• PART II > Welcome to the real world
• Conclusion
SKILLVALUE VALUE YOUR SKILLS THE SMART WAY
REACT NATIVE MASTERCLASS
PART I
LEARN THE BASICS
React Native : quelques faits
Pour bien commencer
La Navigation avec React Native
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Cela vient d’où?
• Facebook (hackhathon interne en 2013)
• https://facebook.github.io/react-native/
• 1ere version publique « 0.0.0 » : 27/01/2015
• 1 release/mois : Current = 0.55.4 (Mai 2018)
> Npm info react-native_
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Breaking news!!!
• v0.56
https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018
https://www.developpez.com/actu/210653/Facebook-annonce-la-reecriture-des-
composants-internes-de-son-Framework-React-Native-pour-faciliter-son-utilisation-
avec-les-applications-hybrides/
We're working on a large-scale
rearchitecture of React Native to make
the framework more flexible and
integrate better with native
infrastructure in hybrid
JavaScript/native apps
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Qui l’utilise ?
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Architecture
Source : https://www.logicroom.co/react-native-architecture-explained/
• iOS et
Android
• Routage
d’appels
natifs via
un bridge
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Pour bien commencer
• MUST READ https://facebook.github.io/react-
native/docs/getting-started.html
• Node JS
• Option 1 : CRNA
– https://github.com/react-community/create-react-
native-app
– Outil de scaffolding / simplicité et sans besoin
d’Android Studio ou XCode
– S’appuie sur Expo
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Pour bien commencer
• Option 2 : Expo
(https://expo.io/)
– Simplicité et facilité de
distribution
– Limites possibles :
création et utilisation de
code natif
https://docs.expo.io/versions/v28.0.0/introduction
/why-not-expo
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Pour bien commencer
• https://snack.expo.io/
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
REACT NATIVE > Pour bien commencer
• Option 3 : A la main
– Choix d’un éditeur de texte Atom.io ou Sublime
– Besoin des outils de développement natifs
• XCode (uniquement sur iOS)
• Android Studio
– Capacité à créer ses composants natifs si besoin
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
HELLO MASTER CLASS
DEMO #1
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI #1 : Quelques tips
• %ANDROID_HOME%platform-toolsadb
reverse tcp:8081 tcp:8081
• Hot Reloading
• Debugging avec React Native
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI #2 : Composants
• Chaque composant « est » un composant React
– https://reactjs.org/docs/react-component.html
• Le Cycle de vie d’un composant RN est
identique au cycle de vie d’un composant
Reactjs avec l’appel « classique » de :
– constructor()
– componentWillMount()
– render()
– componentDidMount()
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI #3 : Styles avec React Native
• Basé sur les mêmes principes
que le CSS
– Pas de notion prédéfinie de
feuille de style globale
• Flexbox
– Basé également sur CSS
– Gestion de l’alignement
– Gestion du remplissage
Source : https://facebook.github.io/react-
native/releases/next/docs/flexbox.html
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
La Navigation avec React Native
• www.reactnavigation.org
• Librairie officiellement sponsorisée par RN
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
La Navigation avec React Native
• 1 JS par écran
• 1 JS pour configurer
les ou les
navigateurs choisis
pour l’application
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
MC NAVIGATION
DEMO #2
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI #1 : Quelques tips
• WebView : facile de charger un site responsive
directement dans l’app
• Librairies UI RN
– Nativebase.io
– Shoutem
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI #2 : Quelques tips - suite
• react-native link
– Nécessaire pour les projets qui font appel à du code
natif (ex : react-native-vector-icons !!)
• Librairie d’icônes react-native-vector-icons
– https://oblador.github.io/react-native-vector-icons/
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI #3 : Un mot sur NPM
• Un projet RN « est » un projet NodeJS
– Fichier Package.json contient les dépendances
• Quelques règles
– Bien choisir ses
dépendances
– Gérer les montées
de version (au
moins une fois
par mois !!!)
SKILLVALUE VALUE YOUR SKILLS THE SMART WAY
REACT NATIVE MASTERCLASS
PART II
WELCOME TO THE REAL WORLD
Gestion d’état avec React Native
(Serverless) Backend
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Gestion d’état avec React Native
• Props
– Propriété statique et non modifiable définie
généralement par le composant parent
– Ex: <Tabs myProp="benoit" />
• State
– Initialisé dans le constructeur
– Modifiable via setState
– Chaque composant a son propre état :
• Synchroniser un état commun entre un composant et
plusieurs enfants se fait via les Pros
• Notifier un composant parent du changement d’état d’un
enfant se fait via les events
Source : https://reactjs.org/docs/state-and-lifecycle.html
https://facebook.github.io/react-vr/docs/components-props-and-state.html
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Redux résout quel problème ?
Source : https://css-tricks.com/learning-react-redux/
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
“Redux is a predictable state container for
JavaScript apps” - http://redux.js.org
• Store
– Single Source of trust
• Actions
– State is read-only:
only way to change it
is to emit an action
• Reducers
– Changes are made by
pure functions Takeaway : http://redux.js.org/docs/basics/
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Utilisation d’un Backend : exemple de Firebase
• Proposé par Google
• « Serverless »
• Hébergement
NoSQL et en temps
réel
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Firebase > Authentification
• Avec Google (mais pas que…)
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
NoSQL Firebase Database : Exemple simple
• Structure libre mais uniquement un seul arbre
• La structure des données influe sur la
complexité et la vitesse des requêtes
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Firebase > Evènements importants
• value
– Utile pour récupérer tous les changements sous un
nœud donné
– Récupère toutes les données
• child_added / child_changed / child_removed
– Utiles pour la gestion de listes
– Ne recupère que l’élément concerné
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
MC FIREBASE & REDUX
DEMO #3
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
POI : Real time update (Waouh effect )
SKILLVALUE VALUE YOUR SKILLS THE SMART WAY
REACT NATIVE MASTERCLASS
CONCLUSION
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Key learnings
• React Native a (seulement) 2 ans
• Besoin de tester sur Android et sur iOS
• Se tenir à jour est crucial
– Dépendances
– Compréhension
– Améliorations ou nouveaux composants
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Bibliographie
https://medium.com/react-native-development/a-brief-history-of-react-
native-aae11f4ca39
https://www.logicroom.co/react-native-architecture-explained/
https://facebook.github.io/react-native/blog/2016/03/24/introducing-
hot-reloading.html
https://js.coach/
https://medium.com/rumors/react-native-redux-and-firebase-for-
experts-by-dummies-6376becdd5c8
https://app.pluralsight.com/library/courses/build-react-native-exponent-
redux-apps/table-of-contents
VALUE YOUR SKILLS THE SMART WAYSKILLVALUE
Code GitHub des démos
https://github.com/Benouzef/SledgeHammer
• Démo 1 : masterclassapp
• Démo 2 : mcnavigationapp
• Démo 3 : mcfirebaseapp
N’hésitez pas à contribuer à « baretoolsapp »:
application « toolbox » pour les freelances
24/05
2018
MERCI
Benoit FILLON
Deputy CEO / CTO Skillvalue Freelancers
benoit.fillon@skillvalue.com
linkedin.com/in/benoit.fillon

Contenu connexe

Tendances

Tendances (8)

Azure pipelines vs GitHub actions
Azure pipelines vs GitHub actionsAzure pipelines vs GitHub actions
Azure pipelines vs GitHub actions
 
JHipster à Devoxx 2015
JHipster à Devoxx 2015JHipster à Devoxx 2015
JHipster à Devoxx 2015
 
CocoaHeads Rennes #14: Programmation Responsive par Celedev
CocoaHeads Rennes #14: Programmation Responsive par CeledevCocoaHeads Rennes #14: Programmation Responsive par Celedev
CocoaHeads Rennes #14: Programmation Responsive par Celedev
 
Firebase par nicolas lehovetzki
Firebase par nicolas lehovetzkiFirebase par nicolas lehovetzki
Firebase par nicolas lehovetzki
 
Cedric leblond migrer jenkins AWS vers Azure Devops
Cedric leblond migrer jenkins AWS vers Azure DevopsCedric leblond migrer jenkins AWS vers Azure Devops
Cedric leblond migrer jenkins AWS vers Azure Devops
 
J'ai fait une app native en React Native
J'ai fait une app native en React NativeJ'ai fait une app native en React Native
J'ai fait une app native en React Native
 
Gérer son environnement de développement avec Docker
Gérer son environnement de développement avec DockerGérer son environnement de développement avec Docker
Gérer son environnement de développement avec Docker
 
Migrer de Jenkins vers Azure DevOps les Builds Java
Migrer de Jenkins vers Azure DevOps les Builds JavaMigrer de Jenkins vers Azure DevOps les Builds Java
Migrer de Jenkins vers Azure DevOps les Builds Java
 

Similaire à 20180628 skill value_masterclass_reactnative - v1.3

Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...
Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...
Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...
ENSIBS
 
Au coeur du framework .net 4.5.1
Au coeur du framework .net 4.5.1Au coeur du framework .net 4.5.1
Au coeur du framework .net 4.5.1
Cellenza
 

Similaire à 20180628 skill value_masterclass_reactnative - v1.3 (20)

Chtijug springbatch 2011
Chtijug springbatch 2011Chtijug springbatch 2011
Chtijug springbatch 2011
 
Pourquoi rails est génial? (version longue)
Pourquoi rails est génial? (version longue)Pourquoi rails est génial? (version longue)
Pourquoi rails est génial? (version longue)
 
What’s Next Replay! Lyon 2011 - G. Darmont
What’s Next Replay! Lyon 2011 - G. DarmontWhat’s Next Replay! Lyon 2011 - G. Darmont
What’s Next Replay! Lyon 2011 - G. Darmont
 
REX react native
REX react nativeREX react native
REX react native
 
Acquia et Arte : Drupal Camp Paris 2013
Acquia et Arte : Drupal Camp Paris 2013Acquia et Arte : Drupal Camp Paris 2013
Acquia et Arte : Drupal Camp Paris 2013
 
Maven
MavenMaven
Maven
 
Scub Foundation, usine logicielle Java libre
Scub Foundation, usine logicielle Java libreScub Foundation, usine logicielle Java libre
Scub Foundation, usine logicielle Java libre
 
Usine Logicielle 2013
Usine Logicielle 2013Usine Logicielle 2013
Usine Logicielle 2013
 
.Net pour le développeur Java - une source d'inspiration?
.Net pour le développeur Java - une source d'inspiration?.Net pour le développeur Java - une source d'inspiration?
.Net pour le développeur Java - une source d'inspiration?
 
Solutions Web « prêtes à porter » avec WordPress
Solutions Web « prêtes à porter » avec WordPressSolutions Web « prêtes à porter » avec WordPress
Solutions Web « prêtes à porter » avec WordPress
 
Javascript as a first programming language : votre IC prête pour la révolution !
Javascript as a first programming language : votre IC prête pour la révolution !Javascript as a first programming language : votre IC prête pour la révolution !
Javascript as a first programming language : votre IC prête pour la révolution !
 
SLIDES-625.1.1-IDL-4-build tools maven.pdf
SLIDES-625.1.1-IDL-4-build tools maven.pdfSLIDES-625.1.1-IDL-4-build tools maven.pdf
SLIDES-625.1.1-IDL-4-build tools maven.pdf
 
Au cœur du Framework .NET 4.5.1
Au cœur du Framework .NET 4.5.1Au cœur du Framework .NET 4.5.1
Au cœur du Framework .NET 4.5.1
 
Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...
Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...
Agile Tour Paris 2014 : Ma stack d'outils Agiles, tout un programme !, Cedric...
 
Au coeur du framework .net 4.5.1
Au coeur du framework .net 4.5.1Au coeur du framework .net 4.5.1
Au coeur du framework .net 4.5.1
 
Arte utilise Acquia Cloud pour héberger ses plateformes web
Arte utilise Acquia Cloud pour héberger ses plateformes webArte utilise Acquia Cloud pour héberger ses plateformes web
Arte utilise Acquia Cloud pour héberger ses plateformes web
 
Investir sur son API web (in French)
Investir sur son API web (in French)Investir sur son API web (in French)
Investir sur son API web (in French)
 
Livraison en continue avec l'outillage devops - Jenkins, Ansible, Docker et ...
Livraison en continue avec l'outillage devops - Jenkins, Ansible, Docker et  ...Livraison en continue avec l'outillage devops - Jenkins, Ansible, Docker et  ...
Livraison en continue avec l'outillage devops - Jenkins, Ansible, Docker et ...
 
gradle_lavajug
gradle_lavajuggradle_lavajug
gradle_lavajug
 
Architecture Plug-in en LabVIEW : de la conception à la réalisation
Architecture Plug-in en LabVIEW : de la conception à la réalisationArchitecture Plug-in en LabVIEW : de la conception à la réalisation
Architecture Plug-in en LabVIEW : de la conception à la réalisation
 

20180628 skill value_masterclass_reactnative - v1.3

  • 1. SKILLVALUE REACT NATIVE MASTER CLASS BENOIT FILLON Deputy CEO / CTO SKILLVALUE FREELANCERS 28/06 2018
  • 2. SKILLVALUE VALUE YOUR SKILLS THE SMART WAY MASTERCLASS AGENDA OBJECTIF FAIRE UNE APPLICATION AVEC REACT NATIVE Les concepts Un cas pratique dont vous aurez le source sur GitHub
  • 3. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE AGENDA • PART I > Learn the basics • PART II > Welcome to the real world • Conclusion
  • 4. SKILLVALUE VALUE YOUR SKILLS THE SMART WAY REACT NATIVE MASTERCLASS PART I LEARN THE BASICS React Native : quelques faits Pour bien commencer La Navigation avec React Native
  • 5. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Cela vient d’où? • Facebook (hackhathon interne en 2013) • https://facebook.github.io/react-native/ • 1ere version publique « 0.0.0 » : 27/01/2015 • 1 release/mois : Current = 0.55.4 (Mai 2018) > Npm info react-native_
  • 6. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Breaking news!!! • v0.56 https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018 https://www.developpez.com/actu/210653/Facebook-annonce-la-reecriture-des- composants-internes-de-son-Framework-React-Native-pour-faciliter-son-utilisation- avec-les-applications-hybrides/ We're working on a large-scale rearchitecture of React Native to make the framework more flexible and integrate better with native infrastructure in hybrid JavaScript/native apps
  • 7. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Qui l’utilise ?
  • 8. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Architecture Source : https://www.logicroom.co/react-native-architecture-explained/ • iOS et Android • Routage d’appels natifs via un bridge
  • 9. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Pour bien commencer • MUST READ https://facebook.github.io/react- native/docs/getting-started.html • Node JS • Option 1 : CRNA – https://github.com/react-community/create-react- native-app – Outil de scaffolding / simplicité et sans besoin d’Android Studio ou XCode – S’appuie sur Expo
  • 10. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Pour bien commencer • Option 2 : Expo (https://expo.io/) – Simplicité et facilité de distribution – Limites possibles : création et utilisation de code natif https://docs.expo.io/versions/v28.0.0/introduction /why-not-expo
  • 11. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Pour bien commencer • https://snack.expo.io/
  • 12. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE REACT NATIVE > Pour bien commencer • Option 3 : A la main – Choix d’un éditeur de texte Atom.io ou Sublime – Besoin des outils de développement natifs • XCode (uniquement sur iOS) • Android Studio – Capacité à créer ses composants natifs si besoin
  • 13. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE HELLO MASTER CLASS DEMO #1
  • 14. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI #1 : Quelques tips • %ANDROID_HOME%platform-toolsadb reverse tcp:8081 tcp:8081 • Hot Reloading • Debugging avec React Native
  • 15. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI #2 : Composants • Chaque composant « est » un composant React – https://reactjs.org/docs/react-component.html • Le Cycle de vie d’un composant RN est identique au cycle de vie d’un composant Reactjs avec l’appel « classique » de : – constructor() – componentWillMount() – render() – componentDidMount()
  • 16. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI #3 : Styles avec React Native • Basé sur les mêmes principes que le CSS – Pas de notion prédéfinie de feuille de style globale • Flexbox – Basé également sur CSS – Gestion de l’alignement – Gestion du remplissage Source : https://facebook.github.io/react- native/releases/next/docs/flexbox.html
  • 17. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE La Navigation avec React Native • www.reactnavigation.org • Librairie officiellement sponsorisée par RN
  • 18. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE La Navigation avec React Native • 1 JS par écran • 1 JS pour configurer les ou les navigateurs choisis pour l’application
  • 19. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE MC NAVIGATION DEMO #2
  • 20. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI #1 : Quelques tips • WebView : facile de charger un site responsive directement dans l’app • Librairies UI RN – Nativebase.io – Shoutem
  • 21. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI #2 : Quelques tips - suite • react-native link – Nécessaire pour les projets qui font appel à du code natif (ex : react-native-vector-icons !!) • Librairie d’icônes react-native-vector-icons – https://oblador.github.io/react-native-vector-icons/
  • 22. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI #3 : Un mot sur NPM • Un projet RN « est » un projet NodeJS – Fichier Package.json contient les dépendances • Quelques règles – Bien choisir ses dépendances – Gérer les montées de version (au moins une fois par mois !!!)
  • 23. SKILLVALUE VALUE YOUR SKILLS THE SMART WAY REACT NATIVE MASTERCLASS PART II WELCOME TO THE REAL WORLD Gestion d’état avec React Native (Serverless) Backend
  • 24. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Gestion d’état avec React Native • Props – Propriété statique et non modifiable définie généralement par le composant parent – Ex: <Tabs myProp="benoit" /> • State – Initialisé dans le constructeur – Modifiable via setState – Chaque composant a son propre état : • Synchroniser un état commun entre un composant et plusieurs enfants se fait via les Pros • Notifier un composant parent du changement d’état d’un enfant se fait via les events Source : https://reactjs.org/docs/state-and-lifecycle.html https://facebook.github.io/react-vr/docs/components-props-and-state.html
  • 25. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Redux résout quel problème ? Source : https://css-tricks.com/learning-react-redux/
  • 26. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE “Redux is a predictable state container for JavaScript apps” - http://redux.js.org • Store – Single Source of trust • Actions – State is read-only: only way to change it is to emit an action • Reducers – Changes are made by pure functions Takeaway : http://redux.js.org/docs/basics/
  • 27. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Utilisation d’un Backend : exemple de Firebase • Proposé par Google • « Serverless » • Hébergement NoSQL et en temps réel
  • 28. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Firebase > Authentification • Avec Google (mais pas que…)
  • 29. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE NoSQL Firebase Database : Exemple simple • Structure libre mais uniquement un seul arbre • La structure des données influe sur la complexité et la vitesse des requêtes
  • 30. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Firebase > Evènements importants • value – Utile pour récupérer tous les changements sous un nœud donné – Récupère toutes les données • child_added / child_changed / child_removed – Utiles pour la gestion de listes – Ne recupère que l’élément concerné
  • 31. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE MC FIREBASE & REDUX DEMO #3
  • 32. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE POI : Real time update (Waouh effect )
  • 33. SKILLVALUE VALUE YOUR SKILLS THE SMART WAY REACT NATIVE MASTERCLASS CONCLUSION
  • 34. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Key learnings • React Native a (seulement) 2 ans • Besoin de tester sur Android et sur iOS • Se tenir à jour est crucial – Dépendances – Compréhension – Améliorations ou nouveaux composants
  • 35. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Bibliographie https://medium.com/react-native-development/a-brief-history-of-react- native-aae11f4ca39 https://www.logicroom.co/react-native-architecture-explained/ https://facebook.github.io/react-native/blog/2016/03/24/introducing- hot-reloading.html https://js.coach/ https://medium.com/rumors/react-native-redux-and-firebase-for- experts-by-dummies-6376becdd5c8 https://app.pluralsight.com/library/courses/build-react-native-exponent- redux-apps/table-of-contents
  • 36. VALUE YOUR SKILLS THE SMART WAYSKILLVALUE Code GitHub des démos https://github.com/Benouzef/SledgeHammer • Démo 1 : masterclassapp • Démo 2 : mcnavigationapp • Démo 3 : mcfirebaseapp N’hésitez pas à contribuer à « baretoolsapp »: application « toolbox » pour les freelances
  • 37. 24/05 2018 MERCI Benoit FILLON Deputy CEO / CTO Skillvalue Freelancers benoit.fillon@skillvalue.com linkedin.com/in/benoit.fillon

Notes de l'éditeur

  1. https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading.html
  2. https://css-tricks.com/snippets/css/a-guide-to-flexbox/
  3. https://css-tricks.com/snippets/css/a-guide-to-flexbox/
  4. https://facebook.github.io/react-native/docs/linking-libraries-ios.html
  5. https://facebook.github.io/react-native/docs/linking-libraries-ios.html
  6. https://facebook.github.io/react-native/docs/linking-libraries-ios.html
  7. https://facebook.github.io/react-native/docs/linking-libraries-ios.html