96 posts tagged with "React Native"

React Native tooling has changed. Older lists often recommended Flipper, Nuclide, standalone React Native Debugger, or remote Chrome debugging as the default workflow. Modern React Native apps should start with React Native DevTools, Metro, and the native tools that ship with Xcode and Android Studio.

The Async Storage is a simple key-value pair based storage system in React Native. It is used for scenarios where you want to save the user’s data on the device itself instead of using any cloud service, such as building offline apps. According to the React Native’s official documentation:

On iOS, AsyncStorage is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, AsyncStorage will use either RocksDB or SQLite based on what is available.

In this tutorial, we are taking a look at how to detect and support dark mode in React Native apps. You are going to build a small demo app that sets its appearance based on the platform OS. The platform OS will have two theme modes, dark or light. By default, when the app will start, it is going to have the theme based on the platform OS but the user is going have an option to toggle between the themes.

In this tutorial, we are going to give a quick introduction to React Native hooks. Hooks in React are available since the version 16.7.0-alpha. These functions allow us to use React state and a component’s lifecycle methods in a functional component. If you are familiar with React, you know that the functional component has been called as a functional stateless component. Not any more.

The app icon is one of the first production assets you should replace before submitting a React Native app to the Apple App Store or Google Play. It appears on the home screen, app stores, settings screens, notifications, search, and device launchers.

This guide explains how to replace icons in a React Native app with native iOS and Android projects.

In this tutorial we will build a React Native app that allows users to upload images and videos from their camera and photo library directly into a AWS S3 bucket. As AWS is the leader of cloud providers, a huge part of the React Native ecosystem is using AWS as the backend for their app. With the release of AWS Amplify, using AWS as backend for a React Native app has never been easier to implement.

An App Walkthrough Screen is a slider screen which allows the user to learn everything about the features of a mobile app when they open the application for the first time. We can implement this feature in a React Native application in multiple ways. In this React Native tutorial, we describe how we implemented the Walkthrough Screens in all of our React Native Templates so that you can speed up your app development by reusing our open source code.

Sign in with Apple is a common requirement for React Native apps that offer third-party login options such as Google, Facebook, LinkedIn, or Amazon. It also gives iOS users a privacy-friendly authentication option that works well with Firebase Authentication.

Optional imports are useful when a React Native app has platform-specific code, feature-gated screens, optional assets, or native modules that should only load in one environment. They are also easy to misuse. Metro still needs to know what files can be bundled, so arbitrary runtime strings are not a good import strategy.

Push notifications are one of the highest-leverage features in a React Native app, but they are also easy to get wrong. Firebase Cloud Messaging can deliver messages to Android and iOS, but iOS still depends on APNs, modern Android requires runtime notification permission, and every production app needs a trusted backend to send notifications.

This guide focuses on the current architecture: the mobile app requests permission and stores device tokens; Firebase owns delivery; your backend sends messages with Firebase Admin SDK or FCM HTTP v1.