Learn React Hooks

Defining links to the posts

We start by shortening the post content in the list, and defining links from the PostList to the corresponding post pages. To do so, we have to define static links from the PostList on the home page to the specific post pages.

Let's define those links now:

1. Edit src/post/Post.js, and import the Link component from react-navi:

import { Link } from 'react-navi'

2. Then, we are going to add two new props to the Post component: id and short, which will be set to true when we want to display the shortened version of the post. Later, we are going to set short to true in the PostList component:

function Post ({ id, title, content, author, short = false }) {

3. Next, we are going to add some logic to trim the post content ...