Navigate back to the homepage

React native net info example

Infinitbility
React Native
May 2nd, 2021 · 1 min read
keep affilitate

Hello Friends,

Welcome To Infinitbility!

we need to check internet connection before call api in react native and today we are going to learn how to check internet connection and if not available then show error No Internet Connection.

This article help you to manage internet connection on your react native application. here you will get code snipest to know internet available or not in user phone.

React Native provide netinfo package to handle internet but it’s now move to react native netinfo package ( https://github.com/react-native-netinfo/react-native-netinfo ).

Let’s start today topic React native net info example or handle internet connection in react native

Table of content

  1. Package details
  2. Installation
  3. netinfo internet example
  4. wifi internet example

Package details

we are going to use React Native netinfo package. full package details https://github.com/react-native-netinfo/react-native-netinfo

React Native Network Info API for Android, iOS, macOS & Windows. It allows you to get information on:

  • Connection type
  • Connection quality

Installation

  • Install package using npm
1npm install --save @react-native-community/netinfo
  • Install package using yarn
1yarn add @react-native-community/netinfo

netinfo internet connection example

Here, we create common function to check internet available or not.

Let’s understand with example

1import NetInfo from "@react-native-community/netinfo";
2
3async function isConnected() {
4
5 let netFlag = 0;
6 await NetInfo.fetch().then(state => {
7 if(state.isConnected) {
8 netFlag = 1;
9 }
10 });
11
12 return netFlag;
13}

wifi internet example

Here, we share example to use wifi is connnected or not in application.

check out below example.

1import NetInfo from "@react-native-community/netinfo";
2
3async function isWifiConnected() {
4
5 let netFlag = 0;
6 await NetInfo.fetch("wifi").then(state => {
7 if(state.isConnected) {
8 netFlag = 1;
9 }
10 });
11
12 return netFlag;
13}

Thanks for reading…

Follow me on Twitter

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

melio affilitate

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Guide book

Guidebook: The Javascript Monorepo Photoshop Guide

Tutorials

Categories

More articles from Infinitbility

integrate Mustache nodejs example

Mustache html template use for email content

May 1st, 2021 · 1 min read

Safemode in windos 7 and 10

how to go Safemode in windos 7 and 10

April 30th, 2021 · 1 min read
© 2020–2022 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]