React Tutorial Needs Updating

[TWebSrDev]

[Enter feedback here]
The "React on Windows for beginners" tutorial is woefully out-of-date. It teaches React development using classes and component lifecycle methods, when it should be teaching React dev with functional components and hooks. For the last few years, there has been a major shift in React towards functional components and Hooks, and this tutorial needs to updated to reflect modern React app architecture and development techniques. This tutorial is akin to teaching web development using VB and web forms.

Document Details

⚠ Do not edit this section. It is required for docs.microsoft.com ➟ GitHub issue linking.

• ID: 945dd697-a98b-1d9b-28b0-6f81b5122cf3
• Version Independent ID: ff53c8e3-ac95-d022-a9d5-cab9b933960e
• Content: Tutorial on React for beginners
• Content Source: hub/dev-environment/javascript/react-beginners-tutorial.md
• Product: dev-environment
• Technology: windows-javascript
• GitHub Login: @mattwojo
• Microsoft Alias: mattwoj

[mattwojo]

Thanks for filing @TWebSrDev. Agree, this should be updated. Does everything look ok to you up to the "Try using React with an API" section?
https://docs.microsoft.com/en-us/windows/dev-environment/javascript/react-beginners-tutorial#try-using-react-with-an-api

I'll set aside some time soon to try a re-write, but I'm also no React expert... if you'd like to take a crack at a re-write, please feel welcome to submit as a PR. Otherwise I'll link my commit once I have a chance to take a crack at it.

[TWebSrDev]

Thanks for the response @mattwojo!
Ha! I'm no React expert either, but know my way around it a bit. 😀

Yes, what I read up to that point looked good. In fact, I really liked the doc, and think that it's a great beginner's tutorial because it actually teaches something immediately applicable to "real world", as opposed to the typical "Todo List"-type tutorial.

I would have loved to take a crack at it, but unfortunately, I'm truly swamped right now (as we ALL are, I'm sure?). Which is why I can truly appreciate the time and effort that goes into writing and maintaining the great documentation over there on the MSDocs site. And, although I can't contribute at the moment, I'll [Edit: be] thinking about what an updated doc might look like, and if you get to it before I get a chance to submit something, I'll definitely be happy to share my thoughts, and maybe at some point, even offer some additions to the doc.

Thanks again Matt!

[vimode]

Hello,

Is this issue being worked on? I would like to help re-write this(React) section of the dev docs.
A lot of it is outdated. create-react-app is replaced by Vite even in the official React docs which also reduces the number of tools listed in the dev docs for the full stack react toolchain, some of the installation steps need re-work and probably some new additions, functional components and hooks (as the issue mentions) are the recommended way to build React projects etc

I am not an expert but with some guidance I can help with the re-write. Let me know if this is still an open issue or if someone is already working on it and needs some help with it. I am willing to help.

Thank you

[vimode]

Sorry to bump this and tag you @mattwojo but I guess this being an old open issue it could be lost in your notifications. I was wondering if you had time to look into this?

[mattwojo]

Hi @vimode - So sorry, yes, this issue did get buried in the loads of other feedback... and I'm just now seeing it again while I'm combing through old issues to try to catch up. If you would like to help update / re-write the React on Windows docs, that would be awesome! I had been asked several years ago to write some basic "Get started with ..." docs just to help folks get up and running with some popular workloads on Windows, but I've since been bumped to focus on other things... and I've not done a good job of keeping up on the latest going on with React... but if you want to take a crack, that would be great!
You can always file a Pull Request to contribute updates to any docs on learn.microsoft.com... there's a whole long contributor guide about how to do so here: https://learn.microsoft.com/en-us/contribute/content/how-to-write-overview
But if that feels like too much overhead, I'd also be happy to connect in another way and just work on something via a Word doc, email, or whatever is easiest for you.

[vimode]

Hey @mattwojo Thank you for replying.
The contributors guide seems pretty straightforward, I just need to setup the Learn Authoring Pack and I am good to go.

Quick questions, do I need to setup the Learn Training AI assistant to edit the documentation? Is it necessary?
And do I need to have my github account linked with my microsoft account to contribute? I probably have a different email associated with my github account.

Either way, I will get started with it and open a pr or a draft PR soon, is it okay to tag you in the PR if I need any guidance about any additions/removals in the edits?