Results summary component

Community feedback

• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have other recommendations regarding your code that I believe will be of great interest to you.

  ---

  SUGGESTION 💡:

  • To import the JSON data into your JavaScript file, you can use the import statement or simply assign the JSON data to a variable. Here's how you can do it:

  ---

  • Using the import statement (for modern JavaScript with ES6 modules). First, save your JSON data in a separate file, let's call it data.json:

  [  {    "category": "Reaction",    "score": 80,    "icon": "./assets/images/icon-reaction.svg"  },  {    "category": "Memory",    "score": 92,    "icon": "./assets/images/icon-memory.svg"  },  {    "category": "Verbal",    "score": 61,    "icon": "./assets/images/icon-verbal.svg"  },  {    "category": "Visual",    "score": 72,    "icon": "./assets/images/icon-visual.svg"  }]
  

  ---

  • In your JavaScript file (let's say result-summary.js), you can use the import statement like this:

  import jsonData from './data.json';
  
  // Now you can use jsonData as an array of objects in your component
  // For example, you can log it to the console:
  console.log(jsonData);
  

  • Make sure that both result-summary.js and data.json are in the same directory or provide the correct path to data.json in the import statement.

  ---

  • Assigning JSON data directly to a variable (for older JavaScript or non-module environments):

  ---

  • If you are not using ES6 modules or if you want to directly assign the JSON data to a variable without using import, you can do it like this:

  ---

  const jsonData = [
    {
      "category": "Reaction",
      "score": 80,
      "icon": "./assets/images/icon-reaction.svg"
    },
    {
      "category": "Memory",
      "score": 92,
      "icon": "./assets/images/icon-memory.svg"
    },
    {
      "category": "Verbal",
      "score": 61,
      "icon": "./assets/images/icon-verbal.svg"
    },
    {
      "category": "Visual",
      "score": 72,
      "icon": "./assets/images/icon-visual.svg"
    }
  ];
  
  // Now you can use jsonData as an array of objects in your component
  // For example, you can log it to the console:
  console.log(jsonData);
  

  • In both cases, you'll have the JSON data available in your JavaScript file, and you can use it in your "Result Summary" component as needed.

  ---

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  0

  ---

  

  Alok Suman•2,380

  @Alokray007Posted over 1 year ago

  @0xAbdulKhalid Thanks for your suggestion. But is there any other way to do it without Java Script.

  0

  

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted over 1 year ago

  Without JavaScript you couldn't make anything on WEB @Alokray007

  WEB is all about JavaScript!

  Marked as helpful

  1
• 

  _nehal💎•6,710

  @NehalSahu8055Posted over 1 year ago

  Hello Coder 👋.

  Congratulations on successfully completing the challenge! 🎉

  • Regarding your Query:
  • You need to use fetch API using consumers or you can use async/await to do the same .
  • Have a look at my solution for reference link

  I hope you find this helpful.

  Happy coding😄

  0

  ---

  

  Alok Suman•2,380

  @Alokray007Posted over 1 year ago

  @NehalSahu8055 Thanks for your suggestion. But is there any other way to do it without Java Script.

  0

  

  _nehal💎•6,710

  @NehalSahu8055Posted over 1 year ago

  @Alokray007

  • JSON stands for JavaScript Object Notation

  Marked as helpful

  1