phenomic icon indicating copy to clipboard operation
phenomic copied to clipboard

Tutorial improvement: react nodes have to be encapsulated in one container

Open RVMendoza opened this issue 8 years ago • 3 comments

https://github.com/phenomic/phenomic/blob/master/packages/preset-react-app/docs/getting-started/5.md

When we tell people to add this section to their component after the list, it creates two nodes that are not contained. It is a ul and a div.

We should somehow mention that you need to surround the two in a div before adding that extra snippet to Older Posts, because react will only load things encapsulated by a single node.

CONTEXT:

Before adding it in the query, we need to actually create a link to access next page! Let's add a link in our Home, after our list of posts

<div>
  {posts.node &&
  posts.node.hasNextPage && (
    <Link to={`/after/${posts.node.next}/`}>Older posts</Link>
  )}
</div>;

Perhaps we could show the entire snippet to show what it looks like after adding this section into it?

This is a fantastic tutorial so far. Very clear.

Just wanted to fill in the holes for people because a source of a lot of my frustrations many tutorials out there is that they assume the user knows more than they do.

RVMendoza avatar Oct 06 '17 12:10 RVMendoza

All improvements are welcome. The more it contains the clearer it will be. So I am ok to add anything you find missing! If you add anything, please also update the example https://github.com/phenomic/phenomic/tree/master/examples/react-app-getting-started ❤️

MoOx avatar Oct 06 '17 12:10 MoOx

Hello, I've made changes to the 05.md that will help with this issue. If you like to see, here is the link: link to the tutorial-document-changes branch: https://github.com/nalanirojas25/phenomic/tree/tutorial-document-changes

Direct link to 05.md file: https://github.com/nalanirojas25/phenomic/blob/tutorial-document-changes/packages/preset-react-app/docs/getting-started/05.md

Hope this made it better!
Let me know if you like the changes and I'll make a PR. Thanks a ton for this tutorial! :)

ghost avatar Feb 07 '19 18:02 ghost

@nalanirojas25 looks good to me. Just be sure to commit with the same email that you use for github to be credited properly (you can use --amend --author or something like that to edit author of a commit). Just ask if you need help.

MoOx avatar Feb 07 '19 19:02 MoOx