Docs: Rewrite tutorial to show hooks as the primary API

[markerikson]

We're now at a point where I'm comfortable teaching our hooks API first (which I'm also doing right now as I work on the new "Quick Start" Redux core tutorial page).

Given that, it would be nice to convert the React-Redux tutorial over. Would still be helpful to have the connect intro somehow as well, albeit secondary.

[jerrybuks]

@markerikson is there any way I can help out with this?

[markerikson]

Sure! No one's volunteered to tackle it yet, so it's up for grabs if you'd like to work on it.

For reference, here's the new "Redux Essentials" core docs tutorial where I covered use of the hooks as the default:

https://redux.js.org/tutorials/essentials/part-1-overview-concepts

I'd suggest looking through that and the React-Redux tutorial, coming up with a suggested plan / outline for a rework, and then post that here and we can discuss it.

[jerrybuks]

Okay, will jump on this and get back to you

[markerikson]

Related to this, we need more details on what useDispatch even is and how to use it:

https://www.reddit.com/r/reactjs/comments/cc9ehv/need_help_with_new_redux_hooks/etmedoh/

[markerikson]

It occurs to me that a good approach here might just be to copy-paste/port the "UI and React" page from the "Redux Fundamentals" tutorial I wrote for the core docs:

https://redux.js.org/tutorials/fundamentals/part-5-ui-react

[markerikson]

A couple people have indicated interest in doing this, but no one has actually done so yet. Still interested in having someone tackle this!

[ligabloo]

I'm interested in doing that :)

[wjohnso-insight]

I'm interested in doing that :)

I'd be happy to work with you on that as well. I've worked through the essentials and fundamentals tutorials very recently so the conventions and style are still pretty fresh.

[markerikson]

@ligabloo , @wjohnso-insight : Cool :)

Per my tweets and my comment above, I think that the best (and hopefully easiest) approach is to start by copying the content from that "Redux Fundamentals: UI and React" page.

We'd need to make updates to the content to:

• Supply introductory context (what the todo app example is, existing app structure)
• Replace links to other Redux core docs pages
• Add some additional bits of info that are listed later in the "Fundamentals" tutorial, like dispatching using action creators, and using memoized selectors

But I do think that reusing that page gives us 90% of the content we need without having to rewrite it from scratch.

As much as I love the work that @wgao19 did on the existing connect tutorial, I think it's probably time to retire it. Or, perhaps we add a new "Tutorials" category, move both tutorials under that in the sidebar, but link the hooks tutorial as "Tutorial" in the navbar.

One other issue: right now, the React-Redux docs have this annoying "versioned docs" setup, which makes working on docs content a lot more complicated. Per #1693 , I actually want to drop that versioning setup.

I may try to tackle that myself tomorrow to help make it simpler to work on this.

[wjohnso-insight]

Sounds like a plan. I like the idea of reusing sections from the existing docs.

@markerikson Would you recommend reading up on Docusarus versioning just to get a feel for the terrain and for some context or is that overkill?

[markerikson]

It's probably overkill for now. Really, there's a good chance that I may have it turned off completely by this time tomorrow :)

The short version is that the /docs folder actually becomes the "Next" version on the docs site: https://react-redux.js.org/next/introduction/quick-start

Meanwhile, the "Current (7.2)" version is actually located under /website/versioned_docs/7.2/, and there's also other versioned folders as well. So, if you edit a file under /docs, it won't show up in one of the default visible pages like https://react-redux.js.org/api/hooks - only if you specifically select the "Next" version from the dropdown. This has repeatedly resulted in people submitting docs PRs that don't actually show up on the site by default, and we have to keep saying "please also edit the duplicate files in the versioned folders!"

I'd say just create a new /docs/tutorials/ folder and create a hooks.md file in there or something, work on the content, and we'll deal with the versioning bit later.