You are previewing Getting Started with React Native.
O'Reilly logo
Getting Started with React Native

Book Description

Learn to build modern native iOS and Android applications using JavaScript and the incredible power of React

About This Book

  • Learn to design and build a fully-featured application using the newest cutting-edge framework from Facebook

  • Leverage your JavaScript skills to become a native app developer

  • Develop custom UI components, implement smooth navigation, and access native features such as geolocation and local storage

  • Who This Book Is For

    This book is for web developers who want to learn to build fast, good-looking, native mobile applications using the skills they already have. If you already have some JavaScript knowledge or are using React on the web, then you will be able to quickly get up and running with React Native for iOS and Android.

    What You Will Learn

  • Set up the React Native environment on both devices and emulators

  • Gain an in-depth understanding of how React Native works behind the scenes

  • Write your own custom native UI components

  • Learn the ins and outs of screen navigation

  • Master the art of layout and styles

  • Work with device-exclusive data such as geolocation

  • Develop native modules in Objective-C and Java that interact with JavaScript

  • Test and deploy your application for a production-ready environment

  • In Detail

    React Native is a game-changing approach to hybrid mobile development. Web developers can leverage their existing skills to write mobile applications in JavaScript that are truly native without using cross-compilation or web views. These applications have all of the advantages of those written in Objective-C or Java, combined with the rapid development cycle that JavaScript developers are accustomed to.

    Web developers who want to develop native mobile applications face a high barrier to entry, because they are forced to learn platform-specific languages and frameworks. Numerous hybrid technologies have tried to simplify this process, but have failed to achieve the performance and appearance that users expect.

    This book will show you all the advantages of true native development that React Native has without the steep learning curve, leveraging the knowledge you already have. We do this by getting you up and running quickly with a sample application. Next, we’ll introduce you to the fundamentals of creating components and explain how React Native works under the hood. Once you have established a solid foundation, you will dive headfirst into developing a real-world application from start to finish. Along the way, we will demonstrate how to create multiple screens and navigate between them, use layout and style native UI components, and access native APIs such as local storage and geolocation. Finally, we tackle the advanced topic of Native modules, which demonstrates that there are truly no limits to what you can do with React Native.

    Style and approach

    This book provides a simple and easy way to build mobile applications in JavaScript. Each topic takes you through the life cycle of creating a fully-functional native app, with detailed explanations of the entire process.

    Downloading the example code for this book. You can download the example code files for all Packt books you have purchased from your account at If you purchased this book elsewhere, you can visit and register to have the code file.

    Table of Contents

    1. Getting Started with React Native
      1. Table of Contents
      2. Getting Started with React Native
      3. Credits
      4. About the Authors
      5. About the Reviewer
        1. Support files, eBooks, discount offers, and more
          1. Why subscribe?
          2. Free access for Packt account holders
      7. Preface
        1. What this book covers
        2. What you need for this book
        3. Who this book is for
        4. Conventions
        5. Reader feedback
        6. Customer support
          1. Downloading the example code
          2. Downloading the color images of this book
          3. Errata
          4. Piracy
          5. Questions
      8. 1. Exploring the Sample Application
        1. Installing Xcode
        2. Running the sample application
          1. A sneak peek at the sample application
        3. Experimenting with the sample application
        4. Summary
      9. 2. Understanding React Native Fundamentals
        1. The Virtual DOM
        2. Components
          1. Creating your first component
          2. JSX
          3. Back to our first component
          4. Props and states
            1. Props
              1. Validating props
            2. State
        3. Summary
      10. 3. Beginning with the Example Application
        1. Generating the projects
          1. Xcode and the iOS simulator
          2. The Android SDK and emulator
          3. Modifying the React Native starter template
        2. Structuring the application
          1. Creating the SimpleButton component
        3. Navigation
          1. The Navigator component
            1. Navigator.NavigationBar
          2. The NoteScreen – first pass
        4. Summary
      11. 4. Working with Styles and Layout
        1. React CSS
          1. Style Sheet
          2. Styling the SimpleButton component
        2. Layout and Flexbox
          1. Flex container
            1. Flex items
            2. Horizontal and vertical centering
            3. Absolute positioning
        3. Styling the NavigationBar component
          1. Changing the Android Material Theme
        4. Styling the NoteScreen
        5. Summary
      12. 5. Displaying and Saving Data
        1. Lists
          1. Understanding props
            1. Using state
            2. Passing callbacks in props
            3. Creating new notes
            4. Using AsyncStorage
            5. Deleting notes
        2. Summary
      13. 6. Working with Geolocation and Maps
        1. Introducing the Geolocation API
          1. The location permission in iOS
        2. Tagging notes with geolocation
        3. NoteLocationScreen
          1. MapView
        4. Summary
      14. 7. Integrating Native Modules
        1. Adding images to notes
        2. Installing react-native-camera on iOS
          1. Searching for Native Modules
          2. Using the camera component
        3. Viewing images
          1. The image component
          2. Deleting images
        4. Connecting the final pieces
        5. Summary
      15. 8. Releasing the Application
        1. Generating the static bundle in iOS
        2. Testing the static bundle in iOS
        3. Creating an iOS release in Xcode
        4. Generating the Android APK
        5. Summary
      16. Index