Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Learn Once, Write Anywhere: Intro to React Native

Learn Once, Write Anywhere: Intro to React Native

Facebook has gifted the world with a new way to develop native mobile applications using JavaScript: React Native. This doesn't sound like a very revolutionary concept, but the way Facebook chose to do it makes React Native stand out among its peers. In this talk, we’ll take a look at what RN is, how it differs from its competition, and why we might want to use it. Geared toward developers with limited or no experience building mobile applications, it takes a high level view of the framework and makes a compelling case for considering it as part of your toolset.

Aaron Greenwald

April 05, 2016
Tweet

More Decks by Aaron Greenwald

Other Decks in Technology

Transcript

  1. Introduction to React Native
    Learn Once, Write Anywhere
    Aaron Greenwald
    github.com/aarongreenwald
    @aaronjgreenwald
    [email protected]

    View Slide

  2. 01 / Meet React Native

    View Slide

  3. “A framework for building native apps
    with React”
    - Facebook

    View Slide

  4. “A framework for building native apps
    with React”
    - Facebook
    Very popular, but very young and
    unstable

    View Slide

  5. Wait...this isn’t new
    let [
    PhoneGap,
    Trigger.io,
    Cordova,
    Ionic,
    Sencha Touch,
    Kendo UI,
    Appcelerator Titanium,
    Xamarin
    ...rest
    ] = stuffWeTriedBefore;

    View Slide

  6. 02 / How It Differs

    View Slide

  7. Webviews vs Native UI

    View Slide

  8. Write Once, Run Anywhere

    View Slide

  9. Write Once, Run Nowhere

    View Slide

  10. Learn Once, Write Anywhere

    View Slide

  11. 03 / How it Works

    View Slide

  12. JS Core UI
    Bridge

    View Slide

  13. UI
    Asynchronous
    Serializable
    Batched
    Communication
    JS Core

    View Slide

  14. 04 / How It Feels

    View Slide

  15. Look Ma, No XCode!!!

    View Slide

  16. IDE Packager
    Chrome
    Simulator

    View Slide

  17. View Slide

  18. 05 / Advantages

    View Slide

  19. We need native mobile apps
    but we hate writing them

    View Slide

  20. Smoother transition from the web

    View Slide

  21. Use the richest ecosystem there is
    Smoother transition from the web

    View Slide

  22. Use the richest ecosystem there is
    Smoother transition from the web
    Develop quickly

    View Slide

  23. Develop quickly
    Use the richest ecosystem there is
    Smoother transition from the web
    Deploy like you’re on the web

    View Slide

  24. Develop quickly
    Deploy like you’re on the web
    Use the richest ecosystem there is
    Smoother transition from the web
    Learn Once, Write Anywhere

    View Slide

  25. Develop quickly
    Deploy like you’re on the web
    Use the richest ecosystem there is
    Learn Once, Write Anywhere
    Smoother transition from the web
    Reuse code

    View Slide

  26. We need native mobile apps
    but we hate writing them

    View Slide

  27. UX of Native
    Developer Experience of the Web

    View Slide

  28. But...what if it limits me?

    View Slide

  29. It won’t.

    View Slide

  30. By definition.

    View Slide

  31. 06 / It’s Still Not Web Development

    View Slide

  32. You can’t always
    code push.
    Sometimes
    you need to change
    binaries.
    It’s Still Not Web Development

    View Slide

  33. You can’t always
    code push.
    Sometimes
    you need to change
    binaries.
    Styling is
    different.
    Presents a
    learning curve.
    It’s Still Not Web Development

    View Slide

  34. You can’t always
    code push.
    Sometimes
    you need to change
    binaries.
    Styling is
    different.
    Presents a
    learning curve.
    Platform-specific
    thinking.
    Adapt requirements
    and mindset for
    mobile.
    Debugging isn’
    t the same.
    It’s getting better,
    but slowly.
    It’s Still Not Web Development

    View Slide

  35. It’s Still Not Web Development
    You can’t always
    code push.
    Sometimes
    you need to change
    binaries.
    Styling is
    different.
    Presents a
    learning curve.
    Platform-specific
    thinking.
    Adapt requirements
    and mindset for
    mobile.
    Debugging isn’
    t the same.
    It’s getting better,
    but slowly.

    View Slide

  36. 07 / Should I Use It?
    Umm...it depends

    View Slide

  37. ● Many poorly solved
    problems
    ● No consensus on best
    practices
    ● Instability
    ● Large community
    ● Many solved problems
    ● A chance to get involved

    View Slide

  38. ● Many poorly solved
    problems
    ● No consensus on best
    practices
    ● Instability
    ● Large community
    ● Many solved problems
    ● A chance to get involved
    If your scale is relatively small,
    stick to traditional native

    View Slide

  39. ● Reuse web developers’
    skills
    ● Transition quickly
    between web and mobile
    ● Deliver amazing mobile
    apps
    ● Many poorly solved
    problems
    ● No consensus on best
    practices
    ● Instability

    View Slide

  40. ● Reuse web developers’
    skills
    ● Transition quickly
    between web and mobile
    ● Deliver amazing mobile
    apps
    If you’re Wix,
    you don’t really have a choice
    ● Many poorly solved
    problems
    ● No consensus on best
    practices
    ● Instability

    View Slide

  41. Resources
    The INTERNET

    View Slide

  42. Resources
    The Mobile Guild
    The INTERNET
    https://github.com/wix/awesome-mobile-framework

    View Slide