Cómo obtener dirección ip en reactjs

Hola amigos de la #nerdytud. En el día de hoy quiero compartirles una forma (de las tantas existentes) de obtener la dirección ip externa desde react.

Obtener apikey para la geolocalización

app.ipgeolocation.io

Creación del proyecto

npx create-react-app obtenerip

Instalar librería

cd obtenerip

npm i axios

Crear settings.js

const apiKey = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxx';

export default apiKey;

Modificar app.js

import { useState, useEffect } from 'react'
import axios from 'axios'
import apiKey from './settings';

function App() {
  const [data, setData] = useState('');

  useEffect(() => {
    getData();
  }, []);

  const getData = async () => {
    await axios
      .get(`https://api.ipgeolocation.io/ipgeo?apiKey=${apiKey}`)
      .then((res) => {
        setData(res.data);
      })
      .catch((err) => {
        console.error(err);
      })
  }

  return (
    <div>
      tu ip actual es {data.ip}
    </div>
  );
}

export default App;

Ejecutar aplicación

npm start

localhost:3000