Fetch Data From RSS Feed In React

fetch_data_in_react.js

class FetchDataFromRSSFeed extends Component {
  constructor() {
    super();
    this.state = {
      recentBlogPost: {
        name: '',
        url: ''
      }
    }
  }

  FetchDataFromRssFeed() {
    var request = new XMLHttpRequest();
    request.onreadystatechange = () => {
      if (request.readyState == 4 && request.status == 200) {
        var myObj = JSON.parse(request.responseText);
        for (var i = 0; i < 1; i ++) {
          this.setState({
            recentBlogPost: {
              name: myObj.items[i].title,
              url: myObj.items[i].link
            }
          });
        }
      }
    }
    request.open("GET", "https://api.rss2json.com/v1/api.json?rss_url=https%3A%2F%2Fblog.codecarrot.net%2Ffeed.xml&order_dir=desc&count=30", true);
    request.send();
  }

  componentDidMount() {
    {this.FetchDataFromRssFeed()}
  }

  render() {
    return (
      <div>
        Check out our blog: <a target="_blank" href={this.state.recentBlogPost.url}>{this.state.recentBlogPost.name}</a>
      </div>
    );
  }
}

please if the rss feed update will the converter update it too when i use it?

Hi mittalyashu, great work this is very helpful. I ran your script but I'm getting cannot read property 'name of undefined. Can you help

Hi how do you display more than one news

Hello Any one.. Please help to get the more then one website news on my react js.

hello, sorou7
Do you have a solution yet..?

@maggymoller Found an old video I created long ago https://www.youtube.com/watch?v=VlgyGFakEO8.

Hope that helps

super helpful - thanks for showing me this got an RSS working with this code help. Question is now how do I get more than 1 to show up? Just loop through items?