Lists in React

Sat Nov 05 2022 12:24:51 GMT+0000 (Coordinated Universal Time)

Saved by @jayakrishna

import * as React from 'react';
const list = [
  {
    title: 'React',
    url: 'https://reactjs.org/',
    author: 'Jordan Walke',
    num_comments: 3,
    points: 4,
    objectID: 0,
}, {
    title: 'Redux',
    url: 'https://redux.js.org/',
    author: 'Dan Abramov, Andrew Clark',
    num_comments: 2,
    points: 5,
    objectID: 1,
}, ];
function App() { ... }
export default App;

Note: I used a ... here as a placeholder, to keep my code snippet small (without the App component’s implementation details) and focused on the essential parts (the list variable outside of the App component). I will use the ... throughout the rest of this learning experience as a placeholder for code blocks that I have established in previous sections. If you get lost, you can always verify your code using the CodeSandbox links I provide at the end of most sections. Each item in the list has a title, a url, an author, an identifier (objectID), points – which indicate the popularity of an item – and a count of comments (num_comments). Next, we’ll render the list within our JSX dynamically: