Professional React Native

Book description

Learn how React Native works under the hood and what this means for building large-scale, cross-platform, production-ready applications without compromising on the quality and performance

Key Features

  • Explore a modern approach to React Native, covering state management, animations, gestures, and more
  • Implement best practices and practical techniques for creating large-scale, production-ready apps
  • Create a development process including workflow automation with GitHub Actions, Fastlane, and Bitrise

Book Description

The React Native framework offers a range of powerful features that make it possible to efficiently build high-quality, easy-to-maintain frontend applications across multiple platforms such as iOS, Android, Linux, Mac OS X, Windows, and the web, helping you save both time and money. And this book is your key to unlocking its capabilities.

Professional React Native provides the ultimate coverage of essential concepts, best practices, advanced processes, and tips for everyday developer problems. The book makes it easy to understand how React Native works under the hood using step-by-step explanations and practical examples so you can use this knowledge to develop highly performant apps. As you follow along, you'll learn the difference between React and React Native, navigate the React Native ecosystem, and revisit the basics of JavaScript and TypeScript needed to create a React Native application. What’s more, you’ll work with animations and even control your app with gestures. Finally, you'll be able to structure larger apps and improve developer efficiency through automated processes, testing, and continuous integration.

By the end of this React native app development book, you'll have gained the confidence to build high-performance apps for multiple platforms, even on a bigger scale.

What you will learn

  • Become familiar with how React Native works under the hood
  • Understand how to make the most of React Native for app development
  • Explore different approaches to building apps across various platforms
  • Become familiar with process automation and automated testing
  • Contribute to open source code and structure your own code library
  • Understand how to set up the architecture for bigger React Native projects

Who this book is for

This book is for developers who want to get started with React Native as well as experienced React Native developers interested in building professional cross-platform applications. Familiarity with the basics of JavaScript (including its syntax) and general software engineering concepts, such as data types, control flows, and server/client structures, is required. Although useful, experience with React Native is not necessary.

Table of contents

  1. Professional React Native
  2. Contributors
  3. About the author
  4. About the reviewer
  5. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
    4. Download the example code files
    5. Download the color images
    6. Conventions used
    7. Get in touch
    8. Share Your Thoughts
  6. Part 1: Getting Started with React Native
  7. Chapter 1: What Is React Native?
    1. Technical requirements
    2. Exploring React
    3. Understanding React basics
      1. Understanding React components
      2. Understanding React props and state
    4. Introducing React Native
      1. React Native basics
      2. The new React Native (2022)
      3. More React Native advantages
    5. Introducing Expo
    6. Summary
  8. Chapter 2: Understanding the Essentials of JavaScript and TypeScript
    1. Technical requirements
    2. Exploring modern JavaScript
    3. Exploring JavaScript for React Native development
      1. Understanding the assigning and passing of objects
      2. Creating real copies of an object
      3. Working with destructuring in JavaScript
      4. Understanding this in JavaScript
    4. Working with asynchronous JavaScript
      1. Exploring callbacks
      2. Understanding the implementation
      3. What’s better than callbacks? Promises!
      4. Improved syntax with async/await
      5. Patching callback libraries
    5. Using typed JavaScript
      1. Flow
      2. TypeScript
    6. Summary
  9. Chapter 3: Hello React Native
    1. Technical requirements
    2. Understanding how React Native works on an 
example app
      1. Understanding the React Native example project
      2. Structuring the example application
    3. Passing properties
    4. Understanding class components, function components, and Hooks
      1. Working with class components and lifecycle methods
      2. Working with function components and Hooks
    5. Connecting different platforms to JavaScript
    6. Introducing the new React Native Architecture
    7. Summary
  10. Part 2: Building World-Class Apps with React Native
  11. Chapter 4: Styling, Storage, and Navigation in React Native
    1. Technical requirements
    2. Understanding how to style a React Native app
      1. Make styling maintainable
      2. Choosing the right styling solution
    3. Using local storage solutions in React Native
      1. Storing non-sensitive data
      2. Storing sensitive data
    4. Understanding navigation in React Native
      1. Navigating different platforms
      2. Working with React Navigation
    5. Summary
  12. Chapter 5: Managing States and Connecting Backends
    1. Technical requirements
    2. Managing global application states
      1. Passing properties
      2. Using global state providers/containers
    3. Comparing local component state and global application state
    4. Working with global state management solutions
      1. Working with React Context
      2. Working with Zustand
      3. Working with Redux
    5. Connecting to remote backends
      1. Understanding the general principles of connections in React Native
      2. Working with the built-in Fetch API
      3. Working with other data fetching solutions
    6. Summary
  13. Chapter 6: Working with Animations
    1. Technical requirements
    2. Understanding the architectural challenge of animations in React Native
    3. Using the internal Animated API of React Native
      1. Starting with a simple example
      2. Using the native driver
      3. Interpolate animated values
      4. Getting to know the advanced options of the Animated API
      5. Understanding the pros and cons of the Animated API
    4. Creating simple animations with react-native-animatable
      1. Starting with a simple example
      2. Using the native driver
      3. Working with custom animations
      4. Understanding the pros and cons of react-native-animatable
    5. Exploring Reanimated 2 – the most complete animation solution for React Native
      1. Getting to know the Reanimated API with a simple example
      2. Understanding the architecture of Reanimated 2
      3. Understanding the pros and cons of Reanimated
    6. Using Lottie animations in React Native
      1. Starting with a simple example
      2. Combining Lottie animations with the React Native Animated API
      3. Finding or creating Lottie animations
      4. Understanding the pros and cons of Reanimated
    7. Summary
  14. Chapter 7: Handling Gestures in React Native
    1. Technical requirements
    2. Using built-in components to respond to user gestures
      1. Using components to respond to simple taps
      2. Working with ScrollView
    3. Working with the gesture responder system and PanResponder
      1. Becoming a responder
      2. Handling touches
      3. Using PanResponder
    4. Understanding React Native Gesture Handler
    5. Summary
  15. Chapter 8: JavaScript Engines and Hermes
    1. Technical requirements
    2. Understanding JavaScript engines
      1. Using JavaScriptCore
      2. Using V8
    3. Getting to know the Hermes engine
    4. Comparing key metrics
      1. Understanding important metrics
      2. Comparing JavaScriptCore and Hermes on Android
      3. Comparing JSC and Hermes on iOS
    5. Summary
  16. Chapter 9: Essential Tools for Improving React Native Development
    1. Technical requirements
    2. Improving code quality with type safety, linters, and code formatters
      1. Ensuring type safety with TypeScript or Flow
      2. Getting rid of the most common bugs with linters
      3. Enforcing a common code style with prettier
    3. Using boilerplate solutions
      1. Using the React Native TypeScript template
      2. Using React Native Boilerplate by thecodingmachine
      3. Using React Native Starter Kit by mcnamee
      4. Working with Ignite CLI
    4. Finding and using high-quality UI libraries
      1. Working with React Native Paper
      2. Working with NativeBase
    5. Using Storybook for React Native
    6. Summary
  17. Part 3: React Native in Large-Scale Projects and Organizations
  18. Chapter 10: Structuring Large-Scale, Multi-Platform Projects
    1. Technical requirements
    2. Setting up an app architecture that works for large-scale enterprise projects
      1. Adapting our example project structure
    3. Using React Native to deploy to different platforms
      1. Using react-native-web to create a clone for web
      2. Working with .native and .web file endings
      3. Working with multiple packages in a monorepo
    4. Reusing code with your own libraries
      1. Using react-native-builder-bob to write, maintain, and publish our own libraries
      2. Setting access restrictions on libraries
    5. Summary
  19. Chapter 11: Creating and Automating Workflows
    1. Technical requirements
    2. Understanding integration/delivery workflow automation
    3. Creating a collaborative development workflow
    4. Creating useful CI pipelines for the development process
    5. Understanding workflow automation and CD for build and release
    6. Summary
  20. Chapter 12: Automated Testing for React Native Apps
    1. Technical requirements
    2. Understanding automated testing
    3. Working with unit and integration tests in React Native
    4. Working with component tests
    5. Understanding end-to-end tests
      1. Understanding the role of end-to-end testing
      2. Writing end-to-end tests with Detox
      3. Understanding Appium and AWS Device Farm
    6. Summary
  21. Chapter 13: Tips and Outlook
    1. Technical requirements
    2. Understanding the most important things to make your React Native project a success
      1. Tip 1 – Find a process you never have to work around
      2. Tip 2 – Plan to be as flexible as possible with strategies to update without store releases
      3. Tip 3 – Always be aware of what’s happening in your app with stability monitoring tools
      4. Tip 4 – Let the user test with A/B testing
      5. Tip 5 – Use TypeScript as a single language stack
      6. Tip 6 – Keep your code simple and clean
    3. Understanding the bright future of React Native
      1. Reason 1 – The new architecture has finally landed
      2. Reason 2 – React Native Skia
      3. Reason 3 – The community
      4. Reason 4 – TypeScript and React
    4. Summary
  22. Index
    1. Why subscribe?
  23. Other Books You May Enjoy
    1. Packt is searching for authors like you
    2. Share Your Thoughts

Product information

  • Title: Professional React Native
  • Author(s): Alexander Benedikt Kuttig
  • Release date: October 2022
  • Publisher(s): Packt Publishing
  • ISBN: 9781800563681