An Introduction to React Native

An Introduction to React Native

An introduction to React Native and an overview of its developer experience to an audience primarily made up of iOS developers and designers.

Event: CocoaHeads Montreal
Location: Shopify Montréal

0781a471438822cdb4f69bcb2efc28e0?s=128

Naoufal Kadhom

April 12, 2016
Tweet

Transcript

  1. An Introduction to React Native

  2. Hi, I’m Naoufal Naoufal

  3. Hi, I’m No-Fell Senior UI Engineer @ Unsplash

  4. Hi, I’m No-Fell Senior UI Engineer @ Unsplash

  5. Unsplash Do whatever you want high-resolution photos

  6. None
  7. None
  8. None
  9. None
  10. None
  11. None
  12. What is React Native

  13. First, What is React

  14. React • JavaScript Library • A new declarative way of

    building UIs • One-way data flow
  15. Declarative UI

  16. Example

  17. Example • Liked • Count • Color • Transition

  18. The Imperative Way • Liked • Count • Color •

    Transition
  19. The Declarative Way • Liked • Count • Color •

    Transition
  20. Declarative Wins • Less Code • Easier to Reason about

    the Application • Faster Development
  21. React Structure

  22. React Structure React React Native React Dom Objective-C/Swift/Java

  23. React Native

  24. React Native • It’s React • Manipulates Native UI Components

    • Powerful Native Plugin API • CSS Style with Flexbox • Apple Approved OTA Updates
  25. Development Tools

  26. Development Tools • Live Reload • Hot Module Replacement •

    Inspector • Chrome Debugger
  27. Apps

  28. Apps

  29. Demo

  30. Connect @naoufal on Twitter & GitHub