Adding Context in React Native to Reuse Components Across Multiple Screens, for Example a Loader

Adding Context in React Native to Reuse Components Across Multiple Screens, for Example a Loader

Tiempo de lectura: 2 minutos Reading Time: 2 minutes Hello, today we are going to learn how to add a context in React Native to reuse components across multiple screens without repeating the component. The first thing we need to do is create our component, in this case, it’s a loader: Folder: components/loader.js import React from “react”; import { View, … Read more

Error launching your React Native application locally

Error launching your React Native application locally

Tiempo de lectura: 2 minutos Reading Time: 2 minutes Good morning, in today’s tutorial, I’m going to show you how I solved an error that occurred to me a couple of times and I couldn’t figure out how to fix. When running the application on my mobile device locally or on any mobile device, it is done with the following … Read more

Test in React Native using Jest

Test in React Native using Jest

Tiempo de lectura: 2 minutos Reading time: 2 minutes Hello, today we are going to learn how to perform testing using Jest in React Native and Expo. Let’s assume you have a login component called LoginScreen that contains user input fields for username and password, as well as a login button. First, make sure you have Jest configured in your … Read more

Unit testing with React Native and Mocha

Unit testing with React Native and Mocha

Tiempo de lectura: 2 minutos Reading time: 2 minutes Hello, today we are going to see how we can perform Unit Tests using Mocha in React Native. The first thing we need to do is install the dependencies for testing: npm install –save-dev mocha chai sinon nyc istanbul-lib-coverage istanbul-reports npm install –save-dev mocha-junit-reporter npm install –save-dev @babel/core @babel/register @babel/preset-env Create … Read more

Crear un contenedor de Expo (EAS) con Docker para generar Build Android para React Native

Crear un contenedor de Expo (EAS) con Docker para generar Build Android para React Native

Tiempo de lectura: 2 minutos Reading time: 3 minutes Hello, today we are going to see how we can create a Docker container that generates Android Builds (APKs) locally using React Native. First, we are going to generate our docker-compose.yml file as follows: version: “3.1” services: react_native_dev: build: context: ./Dockerfile dockerfile: react_native restart: unless-stopped container_name: react_native_dev environment: EXPO_CLI_NO_PROMPT: 1 EXPO_TOKEN: … Read more

Refreshing Screen on Return in React Native

Refreshing Screen on Return in React Native

Tiempo de lectura: < 1 minuto Reading time: < 1 minute If we want to refresh a screen when returning from another screen using React Native, we have to do the following: First, we import react-navigation import { useFocusEffect } from '@react-navigation/native'; Then, we add it in our render: useFocusEffect( React.useCallback(() => { }, []) ); Inside the React.useCallback block, we … Read more

PWA vs Flutter vs React Native vs Ionic: Which Technology to Use for Mobile Development?

PWA vs Flutter vs React Native vs Ionic: Which Technology to Use for Mobile Development?

Tiempo de lectura: 3 minutos Reading time: 4 minutes PWA (Progressive Web Apps), Flutter, React Native, and Ionic are mobile development technologies that have different advantages and disadvantages in terms of performance, user experience, platform support, learning curve, maintenance and scalability, and cost. PWA It is a technology that allows creating web applications with features similar to native applications, using … Read more

Creating a Simple Game Using React Native

Creating a Simple Game Using React Native

Tiempo de lectura: 3 minutos Reading time: 3 minutes Before we begin, it’s important to note that React Native is a JavaScript library that allows you to create mobile applications for iOS and Android using syntax similar to React, the popular JavaScript library for building web applications. Next, I will provide you with an example of code for a basic … Read more

Create an App with Expo (React Native)

Create an App with Expo (React Native)

Tiempo de lectura: 2 minutos Reading time: 2 minutes Hello! In this tutorial, I will show you how to create a mobile application with Expo. Expo is a mobile app development platform that allows developers to quickly create mobile applications using React Native. Expo provides tools to simplify mobile app development, such as a set of pre-built components, an API … Read more

Get data from webview using React Native

Get data from webview using React Native

Tiempo de lectura: 2 minutos Reading time: 2 minutes Today I’m going to show you how you can communicate a web page with React Native directly using JavaScript and a webview. The first thing you need to do is install the webview dependency in React Native: npm install react-native-webview Now let’s create two components: one will be the React Native … Read more