DeepLinking on React native - How to connect a React native app to other external elements and connect two elements of the same app.

The React native framework provides us with a great tool to connect our application to the outside using links. This tool is the "Linking API" which contains several connection functions inside it.

One of these connection functions is the "openURL" function, which allows us to open a URL from the web, from our app, or to use a feature of the computer.

To open a URL by touching a certain area of the app we need to have this area being sensible to touch. For this purpose, the React native framework also contains a component called "<TouchableOpacity>".

The "<TouchableOpacity>" component wraps one or more components and makes the wrapped area sensible by changing its opacity.

To connect the function "openURL" to the touching of the area we need one of the props of the "<TouchableOpacity>" component, which is called "onPress{}". By running:

 function openWebsite(websiteLink: string) {
            Linking.openURL(websiteLink)   //This is the functionality part.
        }

<TouchableOpacity onPress={() => openWebsite ("url of the website")}>

the function "onPress{}" gets executed when the area of the child components of "<TouchableOpacity>" is clicked, and this will execute the "openWebsite()" function with the URL as the parameter, which will at the end execute the "openURL()" function from the Linking API, and open the according website.

Summary:

Linking - is the API where the function "openURL()" is.

<TouchableOpacity> - makes the area of its child components sensible.

onPress{} - is a prop of the <TouchableOpacity> component which allows us to determine responses to a click on the area marked by the <TouchableOpacity> component.

By establishing the sensible area ( <TouchableOpacity> ) and then executing the function "openURL()" ( from the Linking API ) when clicking the area ( onPress{} ) we can connect our React native app with external elements or our internal elements with each other.