# Learning REACT-Getting an IP address lesson

**URL:** <https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668>\
**Category:** Uncategorized\
**Created:** [September 17, 2023, 9:08am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668 "2023-09-17T09:08:26Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sam3](https://avatars.discourse-cdn.com/v4/letter/s/ecd19e/32.png) [@Sam3](https://forum.kirupa.com/u/Sam3)\
**Post date:** [September 17, 2023, 9:08am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/1 "2023-09-17T09:08:26Z")

</div>

Hello, I am studying React via the Kirupa Learning React second edition book that I borrowed from my Library. I have followed all of the instructions on Chapter 14 about getting IP address from [ipinfo.io/json](http://ipinfo.io/json) from page 164-174. However, after running my project, it only show 3 dots.  
Please help.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [September 18, 2023, 1:17am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/2 "2023-09-18T01:17:35Z")

</div>

Hi @Sam3 - welcome to the forums 🙂

Can you copy/paste your code in your response to my post? That may give us some clues as to what is going on.

Cheers,  
Kirupa

---

<div class="post-metadata">

**Author:** ![Sam3](https://avatars.discourse-cdn.com/v4/letter/s/ecd19e/32.png) [@Sam3](https://forum.kirupa.com/u/Sam3)\
**Post date:** [September 18, 2023, 2:53am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/3 "2023-09-18T02:53:35Z")

</div>

Dear Kirupa, please see the code for index.js, IPAddress.js, IPAddressContainer.js and index.html as follows:

```auto
index.js
import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import IPAddressContainer from "./IPAddressContainer";

var destination = document.querySelector("#container");

ReactDOM.render(
    <div>
        <IPAddressContainer/>
    </div>,
    destination
);

IPAddderss.js
import React, {Component} from "react";
import "./IPAddress.css";

class IPAddress extends Component {
    render(){
        return(
            <div>
                <h1>{this.props.ip}</h1>
                <p>( This is your IP address...probably:P)</p>
            </div>
        );
    }
}

export default IPAddress;

IPAddressContainer.js
import React, {Component} from "react";
import IPAddress from "./IPAddress";

var xhr;
class IPAddressContainer extends Component{
    constructor(props){
        super(props);

        this.state = {
            ip_address: "..."
        };
        
        this.processRequest = this.processRequest.bind(this);
    }
    componentDidMount(){
        xhr = new XMLHttpRequest();
        xhr.open("GET", "https://ipinfo.io/json", true);
        xhr.send();

        xhr.addEventListener("readystatechange", this.processRequest, false);
    }

    processRequest (){
        if (xhr.readyState === 4 && xhr.status === 200){
            var response = JSON.parse(xhr.responseText);

            this.setState({
                ip_address: response.ip
            });
        }
    }

    render(){
        return(
            <IPAddress ip={this.state.ip_address} />
        );
    }
}

export default IPAddressContainer;

index.html
<!DOCTYPE html>
<html>
    <head>
        <title>IP Address</title>
    </head>
    <body>
        <div id="container"></div>
    </body>
</html>

```

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [September 19, 2023, 3:30pm UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/4 "2023-09-19T15:30:39Z")

</div>

Sorry for the massive delay, @Sam3. When I tried your example, I am able to see the IP address. Can you please share what you see errors/warnings you see in the Console:

> **[Console Logging Basics](https://www.kirupa.com/html5/console.htm)**
>
> Go beyond silly alert statements and learn how to use the console to get a better view into what your code is doing.

---

<div class="post-metadata">

**Author:** ![Sam3](https://avatars.discourse-cdn.com/v4/letter/s/ecd19e/32.png) [@Sam3](https://forum.kirupa.com/u/Sam3)\
**Post date:** [September 19, 2023, 8:37pm UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/5 "2023-09-19T20:37:30Z")

</div>

Dear Kirupa,  
Thank you for the reply and instruction to check the console. Here are the 2 warnings I see in the Console:

**Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it’s running React 17. Learn more: [How to Upgrade to React 18 – React](https://reactjs.org/link/switch-to-createroot)**  
**printWarning @ react-dom.development.js:86**  
**[ipinfo.io/json:1](http://ipinfo.io/json:1) Failed to load resource: the server responded with a status of 429 ()**  
Best regards,

---

<div class="post-metadata">

**Author:** ![PAEz](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/paez/32/19607_2.png) [@PAEz](https://forum.kirupa.com/u/PAEz)\
**Post date:** [September 20, 2023, 4:00am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/6 "2023-09-20T04:00:15Z")

</div>

The first error about ReactDOM.render is just telling you that your using a command from the old version of reacts api and that it will use the old stuff until you make the update it asked for. This is fine and shouldnt stop your app working.  
The second one is saying that when it tried to get the json data there was an error getting it and the error was 429. 429 means there has been to many requests from your ip. So either you have done a lot of requests and it wants you to take a break for a while. Or you are using a VPN or proxy which can make it so many people are accessing the service from the same ip. So either turn off the proxy or vpn, or try turning on a vpn to change your ip.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [September 20, 2023, 5:22am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/7 "2023-09-20T05:22:28Z")

</div>

Thanks @PAEz for the great response! 🙂

@Sam3 - to work around the “too many requests” issue, use the code here for making the XHR call: [IPAddress from React book component only works w/ "on your network" - #14 by kirupa](http://forum.kirupa.com/t/ipaddress-from-react-book-component-only-works-w-on-your-network/639505/14)

🙂

---

<div class="post-metadata">

**Author:** ![Sam3](https://avatars.discourse-cdn.com/v4/letter/s/ecd19e/32.png) [@Sam3](https://forum.kirupa.com/u/Sam3)\
**Post date:** [September 21, 2023, 7:25am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/8 "2023-09-21T07:25:24Z")

</div>

@PAEz Thank you for your comments.

---

<div class="post-metadata">

**Author:** ![Sam3](https://avatars.discourse-cdn.com/v4/letter/s/ecd19e/32.png) [@Sam3](https://forum.kirupa.com/u/Sam3)\
**Post date:** [September 21, 2023, 7:35am UTC](https://forum.kirupa.com/t/learning-react-getting-an-ip-address-lesson/661668/9 "2023-09-21T07:35:19Z")

</div>

Dear Kirupa, thank you. I will try it.