JavaScript

[himstar-31]

const newsContainer = document.getElementById('newsContainer');

async function fetchNews() {
const apiKey = 'YOUR_NEWSAPI_KEY'; // optional for live news
const url = https://newsapi.org/v2/top-headlines?country=in&apiKey=${apiKey};
const res = await fetch(url);
const data = await res.json();

newsContainer.innerHTML = data.articles.map(article => <div class="news-card"> <img src="${article.urlToImage || 'default.jpg'}" alt=""> <h3>${article.title}</h3> <p>${article.description || ''}</p> <a href="${article.url}" target="_blank">Read More</a> </div>).join('');
}

fetchNews().catch(() => {
newsContainer.innerHTML = '

Unable to load news. Please check your API key or connection.

';
});

[ramanuj-droid]

Your JavaScript snippet has a few small syntax issues that will prevent it from running properly:

async function fetchNews() {
  const apiKey = 'YOUR_NEWSAPI_KEY'; 
  const url = `https://newsapi.org/v2/top-headlines?country=in&apiKey=${apiKey}`;
  
  const res = await fetch(url);
  const data = await res.json();

  newsContainer.innerHTML = data.articles
    .map(article => `
      <div class="news-card">
        <img src="${article.urlToImage || 'default.jpg'}" alt="">
        <h3>${article.title}</h3>
        <p>${article.description || ''}</p>
        <a href="${article.url}" target="_blank">Read More</a>
      </div>
    `)
    .join('');
}

fetchNews().catch(() => {
  newsContainer.innerHTML = `
    <p>⚠️ Unable to load news. Please check your API key or internet connection.</p>
  `;
});