Month: January 2022

React Native – Deep linking example for Android and IOS

Post author By Mubarak Hossain
Post date January 18, 2022

In this article I will discuses how to configure Deep Link on React Native application. React Native provides a Linking to get notified of incoming links. React Navigation can integrate with the Linking module to automatically handle deep links. Deep linking and universal links are gateway into your mobile application.

Configure Deep Link on React Native Application:

Very first, you want to specify a scheme URL for your app. If your app scheme is appname then a link to your app would be appname://

URL scheme for your app:

Open your Android app manifest android/app/src/main/AndroidManifest.xml you need to add following code between activity and queries tags section.

<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.appname">
.....................
.....................
.....................
<application
	.....
	.....
	>
	<activity
		android:name=".MainActivity"
		android:label="@string/app_name"
		android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
		android:launchMode="singleTask"
		android:windowSoftInputMode="stateAlwaysHidden|adjustPan">
			<intent-filter android:autoVerify="true">
				<action android:name="android.intent.action.MAIN" />
				<category android:name="android.intent.category.LAUNCHER" />
			</intent-filter>
			<intent-filter>
				<action android:name="android.intent.action.VIEW" />
				<category android:name="android.intent.category.DEFAULT" />
				<category android:name="android.intent.category.BROWSABLE" />
				<data android:scheme="appname" />
				<data android:scheme="https" android:host="appndomain.com" />
			</intent-filter>
	</activity>
	.........
	.........
</application>
    <queries>
        <intent>
            <action android:name="android.intent.action.VIEW" />
            <data android:scheme="https" android:host="*" />
        </intent>
    </queries>
</manifest>

Now configure the native iOS app to open based on the appname:// URI scheme. You need to add the following lines to ios/AppName/AppDelegate.m file.

// Add the header at the top of the file:
#import <React/RCTLinkingManager.h>

// Add this above `@end`:
- (BOOL)application:(UIApplication *)application
   openURL:(NSURL *)url
   options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
{
  return [RCTLinkingManager application:application openURL:url options:options];
}

After this change you need to re-build app “react-native run-android” or “react-native run-ios”

App Links Configure:

Here is configure app initial route and others screens with query params.

export const linkConfig = {
	initialRouteName: "Home",
	screens: {
		screens: {
			Home: {
				path: "Home",
			},
			Notification: {
				path: "Notification/:id?",
				parse: {
					id: (id: String) => `${id}`,
				},
			},
		}
	}
};

Configure App Linking:

const linking = {
    prefixes: ['https://yourdomin.com', 'appname://'],
    linkConfig,
    async getInitialURL() {
        // Check if app was opened from a deep link
        const url = await Linking.getInitialURL();

        if (url != null) {
            return url;
        }
    }
};

Here is full example code for setup on App screen.

import React from 'react';
import { Linking} from 'react-native';
import { NavigationContainer } from '@react-navigation/native';

export const linkConfig = {
	initialRouteName: "Home",
	screens: {
		screens: {
			Home: {
				path: "Home",
			},
			Notification: {
				path: "Notification/:id?",
				parse: {
					id: (id: String) => `${id}`,
				},
			},
		}
	}
};

const linking = {
    prefixes: ['https://yourdomin.com', 'appname://'],
    linkConfig,
    async getInitialURL() {
        // Check if app was opened from a deep link
        const url = await Linking.getInitialURL();

        if (url != null) {
            return url;
        }
    }
};

const App = ({ navigation }) => {
	return (
		<NavigationContainer linking={linking} fallback={<Text>Loading...</Text>}>
			{/* content */}
		</NavigationContainer>
	);
}

export default App;

Test Deep Linking on IOS and Android:

//Android Test:
npx uri-scheme open appname://Notification/?id=102 --android

//IOS Test:
npx uri-scheme open appname://Notification/?id=102 --ios

Tags Android, IOS, Linking, React Native

Magento 2

Magento error – Unable to apply data patch for module Magento_Theme. In Gd2.php line 72

Post author By Mubarak Hossain
Post date January 2, 2022

In PatchApplier.php line 170: Unable to apply data patch Magento\Theme\Setup\Patch\Data\RegisterThemes for module Magento_Theme. Original exception message: Wrong file

In Gd2.php line 72: Wrong file

Finally Installation is complete 100% after done following changes:

Find validateURLScheme function in vendor\magento\framework\Image\Adapter\Gd2.php file. at line 96. Replace function with this: !file_exists($filename) Please find and change validateURLScheme function like below code.

Just add && !file_exists($filename)

private function validateURLScheme(string $filename) : bool
{
	$allowed_schemes = ['ftp', 'ftps', 'http', 'https'];
	$url = parse_url($filename);
	if ($url && isset($url['scheme']) && !in_array($url['scheme'], $allowed_schemes) && !file_exists($filename)) {
		return false;
	}
	
	return true;
}

Thank you for carefully read my article If you have any query please Leave your query on following comment section or contact with us. Hope it will help you.

Tags Error, Install, Magento 2, Theme

Magento 2

Magento error – Could not validate a connection to Elasticsearch and Install using composer

Post author By Mubarak Hossain
Post date January 2, 2022

Download Magento 2

Open SSH terminal on your server and run the following command to download and create new project. Previous post how to install Magento 2 on Windows XAMPP server.

composer create-project --repository-url=https://repo.magento.com/ magento/project-community-edition public_html

Create The Database and Collect other information

Create new database and note Database name, database user name and database user password. Also site url, admin username, password, timezone and more. Run following command to install Magento 2.

Install/Setup Magento 2 by Command line

php bin/magento setup:install \
--base-url="https://www.extendfeature.com/" \
--db-host="localhost" \
--db-name="dbextendfeature" \
--db-user="root" \
--db-password="" \
--admin-firstname="admin" \
--admin-lastname="admin" \
--admin-email="admin@extendfeature.com" \
--admin-user="admin" \
--admin-password="admin@123" \
--language="en_US" \
--currency=USD \
--timezone="Asia/Dhaka" \
--use-rewrites=1

In SearchConfig.php line 81: Could not validate a connection to Elasticsearch. No alive nodes found in your cluster

If you got any error related with Elasticsearch then just disable some module related with Elasticsearch using run following command and again run install command.

//Just disable some module by command
php bin/magento module:disable {Magento_Elasticsearch,Magento_InventoryElasticsearch,Magento_Elasticsearch6,Magento_Elasticsearch7}