63 posts tagged with "Mobile Development"

In React Native WebViews enable access to any web portal in the mobile app itself. In other words, a web view allows us to open the web URLs inside the app interface. While React Native provides us with a built-it web view component, but we are going to use react-native-webview plugin in this tutorial, since it is more powerful. React Native WebView is a modern, well-supported, and cross-platform WebView for React Native.

You might have seen Google Maps in almost all the apps these days. Some mobile apps are displaying their outlet locations, track users (like Uber), showing nearby places, etc. So, it shows the importance of maps support in mobile apps. Today, we are going to integrate Google Maps in a React Native app step by step, using the popular React Native Maps package.

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.

In this article, we are going to discuss the in and outs of the React Native App Icon for both iOS and Android. The app icon is a critical component of a mobile app since it’s always exposed to users. A great app icon can improve your app install numbers and can boost daily active users if it’s attractively designed. Anyone who is building a React Native app will eventually need to solve the issue of adding a React Native app icon to their mobile apps, prior to publishing them to the app stores.

Entrepreneurs, designers, and developers tend to separate Growth aspects from the mobile app development process. They are usually perceived as completely different focus areas. After all, what does marketing have to do with app development, right? Because of this, many startups fall into the trap of building onboarding screens that are so beautiful it blows the user’s mind, but they are not optimized for Growth, hence don’t convert well.

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.

Optional imports support has been added recently in React Native.This feature requires no external library and is relatively easy to implement even with its enormous advantage to the overall code quality of your code. The major use-case of this feature is backwards compatibility which we will look right into next.

In this tutorial, you are going to build a small demo by adding the feature of a deep linking in a React Native application. To support deep linking and navigation in the app, react-navigation library is going to be used. There are use cases in which using an external URL a user is going to transit to a specific screen in your application. This URL can be provided on a web page, for instance. Navigating to the exact screen in the React Native app from an external URL is what the process of Deep Linking is about.