Free JSON API for News and Blog Articles

In this article, we are going to implement a Free News API provided by NewsAPI.org. Please provide credit to https://newsapi.org/ while using the API for non commercial use. In case you are using for commercial purpose, check their pricing.

Source Code :

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

<style>
.container{
  margin-top:20px;
  width:75%;
}
.title{
  margin-top:20px;
  margin-bottom: 20px;
}
.single-news{
  background-color:#ddd;
  padding:30px;
  margin-bottom:20px;
  margin-top:20px;
}
</style>
<div class="container">
  <h1 class="title text-center">Free News API</h1>
  <hr>
  <div class="list-wrapper">
    <?php
      if(file_exists('news.json')){
        $api_url = 'news.json';
        $newslist = json_decode(file_get_contents($api_url));
      }else{
        $news_keyword = 'politics'; //we will be fetching only sports related news
        $api_url = 'http://newsapi.org/v2/everything?q='.$news_keyword.'&from=2020-02-26&sortBy=publishedAt&apiKey=e935ddb73b0147458f29105d83c0c535';
        $newslist = file_get_contents($api_url);
        file_put_contents('news.json', $newslist);
        $newslist = json_decode($newslist);
      }
      foreach($newslist->articles as $news){?>
      <div class="row single-news">
        <div class="col-4">
          <img style="width:100%;" src="<?php echo $news->urlToImage;?>">
        </div>
        <div class="col-8">
          <h2><?php echo $news->title;?></h2>
          <small><?php echo $news->source->name;?></small>
          <?php if($news->author && $news->author!=''){ ?>
            <small>| <?php echo $news->author;?></small>
          <?php } ?>
          <p><?php echo $news->description;?></p>
          <a href="<?php echo $news->url;?>" class="btn btn-sm btn-primary" style="float:right;" target="_blank">Read More >></a>
        </div>
      </div>
    <?php } ?>
  </div>
</div>

 

We will first create a simple design for news listing using grid system provided by Bootstrap. After the design is ready, we will call the API. Remember, we wont hit API everytime. We will be storing the JSON response in our server and will be served. If we need to fetch fresh data, we will delete the JSON file in our server. If we want to fetch fresh data from API, we will delete news.json file.

You can explore and try out other parameters of the API as well

Follow this video for complete guidance :

Recommended For You

About the Author: Ritesh Ghimire

Ritesh is a Computer Engineer, Web Developer and an active cricket follower.