DEV Community

Donny Nguyen
Donny Nguyen

Posted on

CNN Top Stories API — Free to Use

How to Fetch CNN Top Stories with This Simple API

Need to display breaking news on your app? The CNN Top Stories API pulls the latest headlines directly from CNN's website, letting you integrate real-time news into your projects without scraping.

What This API Does

The CNN Top Stories API delivers current news articles from CNN organized by section. You can filter stories by category (like "world", "politics", "tech", or "test") and get structured data including headlines, descriptions, images, and source links. Perfect for news aggregators, dashboards, or any app that needs fresh content.

Getting Started

The main endpoint is straightforward:

GET https://cnn-top-stories-api-production.up.railway.app/api/top?section=test
Enter fullscreen mode Exit fullscreen mode

No authentication required for basic requests—hit the endpoint and start pulling stories.

Real Code Example

Here's how to fetch and display CNN stories using vanilla JavaScript:

async function getCNNStories() {
  try {
    const response = await fetch(
      'https://cnn-top-stories-api-production.up.railway.app/api/top?section=test'
    );

    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }

    const stories = await response.json();
    displayStories(stories);
  } catch (error) {
    console.error('Error fetching stories:', error);
  }
}

function displayStories(stories) {
  const container = document.getElementById('news-container');

  stories.forEach(story => {
    const article = document.createElement('div');
    article.className = 'story';
    article.innerHTML = `
      <h2>${story.title}</h2>
      <p>${story.description || 'No description available'}</p>
      ${story.image ? `<img src="${story.image}" alt="${story.title}">` : ''}
      <a href="${story.link}" target="_blank">Read more</a>
    `;
    container.appendChild(article);
  });
}

getCNNStories();
Enter fullscreen mode Exit fullscreen mode

Quick Tips

  • Change sections by modifying the section parameter: /api/top?section=politics, /api/top?section=tech, etc.
  • Handle rate limits gracefully with retry logic if you're polling frequently
  • Cache responses to reduce unnecessary requests—news doesn't change every second
  • Use the image URLs as fallbacks—some stories may not include them

Try It Now

Want to test this live? The API is available on RapidAPI—sign up for a free account and start experimenting with different sections.

The endpoint is fast, reliable, and requires zero setup. Drop this into your project today and add a news feed in minutes.

Top comments (0)