Learn React Hooks

The Post component

We have already thought about which elements a post has when creating the mock-up. A post should have a title, content, and an author (the user who wrote the post).

Let's implement the Post component now:

1. First, we create a new file: src/post/Post.js
2. Then, we import React, and define our function component, accepting three props: title, content, and author:

import React from 'react'export default function Post ({ title, content, author }) {

3. Next, we render all props in a way that resembles the mock-up:

    return (        <div>            <h3>{title}</h3>            <div>{content}</div>            <br />            <i>Written by <b>{author}</b></i>        </div>    )}

4. As always, we can test our component by editing the src/App.js file:

import React from 'react'import Post from ...