Hands-On Full-Stack Web Development with GraphQL and React

Rendering arrays from React state

Hello World! is a must for every good programming book, but this is not what we are aiming for when we use React.

A social network such as Facebook or Graphbook, which we are writing at the moment, needs a news feed and an input to post news. Let's implement this.

For the simplicity of the first chapter, we do this inside App.js.

We should work with some fake data here since we have not yet set up our GraphQL API. We can replace this later with real data.

Define a new variable above your App class like this:

const posts = [{  id: 2,  text: 'Lorem ipsum',  user: {    avatar: '/uploads/avatar1.png',    username: 'Test User'  }},{  id: 1,  text: 'Lorem ipsum',  user: {    avatar: '/uploads/avatar2.png', username: 'Test ...