From Native To React Native

Talk on ReactNotAConf 2018 Edition.

Transcript

1. FROM
   NSString *native
   TO
   
   28/04/2018
   

   View Slide

2. @deVladinci
   

   View Slide

3. View Slide

4. View Slide

5. Version 2.0
   ✅ ❌
   

   View Slide

6. View Slide

7. Version 3.0
   ✅ ❌
   

   View Slide

8. You want to be on as
   many platforms as you
   can.
   

   View Slide

9. ?
   

   View Slide

10. 4%
    77%
    19%
    iOS Android Other
    Show how many users are on android
    mobile.
    

    View Slide

11. Should we go Native
    or
    React Native?
    

    View Slide

12. Pros
    1. The whole team can maintain the codebase and
    contribute
    
    2. Cross-platform
    
    3. Compiles to native code
    
    4. Reuse existing native and web logic
    
    5. Speed up development
    

    View Slide

13. Cons
    1. Not a mature technology
    
    2. Smaller community
    
    3. Still need native devs at some point
    

    View Slide

14. 0
    Lines
    of platform specific code
    

    View Slide

15. View Slide

16. Structuring the
    Project
    

    View Slide

17. –W.Edwards Deming
    “If you can’t describe what you are doing as a
    process, you don’t know what you are doing”
    

    View Slide

18. View Slide

19. Components
    

    View Slide

20. 1. General components
    

    View Slide

21. View Slide

22. 1. General components
    
    2. Wrap 3rd party libraries
    

    View Slide

23. View Slide

24. 1. General components
    
    2. Wrap 3rd party libraries
    
    3. Express domain concept
    

    View Slide

25. View Slide

26. 1. General components
    
    2. Wrap 3rd party libraries
    
    3. Express domain concept
    
    4. Handle platform specific UI
    

    View Slide

27. 99% of the platform specific code is
    in Components
    

    View Slide

28. View Slide

29. View Slide

30. Modules
    

    View Slide

31. View Slide

32. Screen
    Action
    Reducer
    Selector
    Constants
    

    View Slide

33. Navigation
    is a module
    

    View Slide

34. View Slide

35. Navigation in Redux
    

    View Slide

36. View Slide

37. View Slide

38. Thank you!
    

    View Slide