Build an fCC Forum Leaderboard - Build an fCC Forum Leaderboard

JavaScript
1

Tell us what’s happening:

why when iam fetching data i see only void curly brackets like this
{}
why iam not seeing the real data that i’ve succefully fetched ??
any help please

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36

Challenge Information:

Build an fCC Forum Leaderboard - Build an fCC Forum Leaderboard

2

Hi

Can you please post all your code.

When you enter a code block into a forum post, please precede it with three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add the backticks.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

3 
const forumLatest =
  'https://cdn.freecodecamp.org/curriculum/forum-latest/latest.json';
const forumTopicUrl = 'https://forum.freecodecamp.org/t/';
const forumCategoryUrl = 'https://forum.freecodecamp.org/c/';
const avatarUrl = 'https://cdn.freecodecamp.org/curriculum/forum-latest';
 
const allCategories = {
  299: { category: 'Career Advice', className: 'career' },
  409: { category: 'Project Feedback', className: 'feedback' },
  417: { category: 'freeCodeCamp Support', className: 'support' },
  421: { category: 'JavaScript', className: 'javascript' },
  423: { category: 'HTML - CSS', className: 'html-css' },
  424: { category: 'Python', className: 'python' },
  432: { category: 'You Can Do This!', className: 'motivation' },
  560: { category: 'Backend Development', className: 'backend' }
};

// timeAgo function
const timeAgo = (arg) => {
    // now date
    let nowDate = new Date().getTime()

    let passedDate = new Date(arg).getTime()
    let diffDate = nowDate - passedDate

    let diffDays = Math.floor(diffDate / (24 * 60 * 60 * 1000))

    let diffHours = Math.floor(diffDate % (24 * 60 * 60 * 1000) / (60 * 60 * 1000))

    let diffMins =  Math.abs(Math.floor(diffDate % (24 * 60 * 60 * 1000) / (60 * 1000)))


    if(diffDays >= 1) {
      return diffDays + 'd ago'
    }
    if(diffDays < 1 && diffHours >= 1) {
      return diffHours + 'h ago'
    }
    if(diffDays < 1 && diffHours < 1) {
      return diffMins + 'm ago'
    }


}

const viewCount = (views) => {
  if(views === 1000) {
    return '1k'
  }
  if(views >= 2000) {
    return '2k'
  }
  return views
}

const forumCategory = (category) => {
  let obj = allCategories[category]
  if(!obj) {
    return `<a id='${category}' class='category general' href="${forumCategoryUrl + 'general' + '/' + category}">General</a>`
  }

    return `<a id='${category}' class='category ${obj.className}' href="${forumCategoryUrl + obj.className + '/' + category}">${obj.category}</a>`
}

const avatars = (posters, users) => {
    return posters.map(poster => {
    const user = users.find(user => user.id === poster.user_id);

    if (!user) return '';
    const avatarPath = user.avatar_template.replace('{size}', 30);
    const userAvatarUrl = avatarPath.startsWith('/')
      ? `${avatarUrl}${avatarPath}`
      : avatarPath; 
    return `<img src='${userAvatarUrl}' alt='${user.name}'>`;
  }).join('');
}

const showLatestPosts = (users) => {

}

async function fetchData() {
  try {

  const response = await fetch(forumLatest)
  const data = response.json()
  console.log(data)
  }catch(err) {
    console.log(`${err}`)
  }
}

fetchData()

here is all my code my fetchData shows void curly bracketes

4

i got my fault, i forgot my second await keyword

thanks :slight_smile: