Fixing error Could not find Ninja on PATH or in SDK CMake bin folders in React Native with Expo

Fixing error Could not find Ninja on PATH or in SDK CMake bin folders in React Native with Expo

Tiempo de lectura: < 1 minuto Today we are going to solve the following error: A problem occurred evaluating project ‘expo’. A problem occurred configuring project ‘expo-modules-core’. [CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders. This error occurs when we try to generate the development build with Expo: npx run:android To solve this error, we need … Read more

SDK Location Not Found Error in React Native

SDK Location Not Found Error in React Native

Tiempo de lectura: < 1 minuto If we encounter this error while trying to generate an apk of a React Native application SDK location not found Define a valid SDK location with an ANDROID_HOME environment variable or by setting the sdk.dir path in your project’s local properties file, we need to do the following to fix it. Now we will create … Read more

General Options and Styling Configuration for a React Native App

Tiempo de lectura: < 1 minuto Let’s see how to set up the general styles for an application developed in React Native. To do this, on the screen where the different screens and routes are established, within the StackNavigator, we will add the screenOptions. The screenOptions is an object that contains the style and layout options for the screens in navigation. … Read more

Communicating a React Web with a React Native WebView using postMessage()

Communicating a React Web with a React Native WebView using postMessage()

Tiempo de lectura: < 1 minuto Today we are going to learn how we can communicate a web app created with React with a WebView in React Native, and also use the postMessage() function of JavaScript. This is very useful for creating interfaces with web content and implementing them within a mobile app. React Native We will use the library react-native-webview … Read more

Fix error: Unknown compiler option ‘allowImportingTsExtensions’. Using Sonarqube with React and TypeScript

Fix error: Unknown compiler option ‘allowImportingTsExtensions’. Using Sonarqube with React and TypeScript

Tiempo de lectura: < 1 minuto Today we are going to solve the error Unknown compiler option ‘allowImportingTsExtensions’ that appears when trying to analyze a TypeScript project with SonarQube and React. The error is found in tsconfig.json of the React project, it is fixed by removing the following line: allowImportingTsExtensions”: true, DevCodeLightdevcodelight.com

Fix error Argument for ‘–moduleResolution’ option must be: ‘node’, ‘classic’, ‘node16’, ‘nodenext’.; in SonarQube with React TypeScript

Fix error Argument for ‘–moduleResolution’ option must be: ‘node’, ‘classic’, ‘node16’, ‘nodenext’.; in SonarQube with React TypeScript

Tiempo de lectura: < 1 minuto Today we are going to learn how to solve the error Argument for ‘–moduleResolution’ option must be: ‘node’, ‘classic’, ‘node16’, ‘nodenext’.; when trying to analyze a React project with TypeScript using Sonarqube. This error is located in the tsconfig.json file, as it includes: “moduleResolution”: “bundle”, To fix it, we will set: “moduleResolution”: “node”, DevCodeLightdevcodelight.com

Setting up ESLint for React or React Native project with JavaScript or TypeScript

Setting up ESLint for React or React Native project with JavaScript or TypeScript

Tiempo de lectura: 2 minutos Today we are going to learn how we can set up ESLint for a project that uses React and React Native with JavaScript or TypeScript. This will allow us to recognize errors that appear in our code and configure the type of error we want. First of all, we need to install ESLint: npm install … Read more

Adding GDPR European Ad Consent Message with React Native Google Mobile Ads (ADMOB) with Expo

Adding GDPR European Ad Consent Message with React Native Google Mobile Ads (ADMOB) with Expo

Tiempo de lectura: 2 minutos Today we are going to learn how we can add the mandatory ad consent message to comply with GDPR. The first thing we need to do is to have our message set up: https://devcodelight.com/mensaje-consentimiento-conforme-rgpd-para-admob/ NOTE: I am using version 12.2.0 of react-native-google-mobile-ads at least (https://github.com/invertase/react-native-google-mobile-ads) Once configured, let’s go to android/app/proguard-rules.pro and add: -keep class … Read more

Implementing Google Consent for GDPR with React Native

Implementing Google Consent for GDPR with React Native

Tiempo de lectura: 2 minutos Today we are going to learn how we can implement the GDPR consent message with React Native. Let’s install the following library (https://www.npmjs.com/package/@ulangi/react-native-ad-consent) npm install @ulangi/react-native-ad-consent –save Now let’s add this key in info.plist of iOS: <key>GADDelayAppMeasurementInit</key> <true/> Now we open AndroidManifest.xml in case of Android. And add: <meta-data android:name=”com.google.android.gms.ads.DELAY_APP_MEASUREMENT_INIT” android:value=”true”/> <uses-library android:name=”org.apache.http.legacy” android:required=”false”/> And … Read more

Connect a React Native Application to a WebSocket

Connect a React Native Application to a WebSocket

Tiempo de lectura: 2 minutos Today we will learn how to connect our React Native application to a WebSocket using the https://www.npmjs.com/package/react-native-websocket library Setting up React Native Application Create a New React Native Project: Create a new React Native project using react-native-cli: npx react-native init MyReactNativeApp cd MyReactNativeApp Install WebSocket Dependencies: Install the react-native-websocket library to handle WebSocket connections in … Read more