[Basic] Have a warning on React Functional Component about use of React.FC

[deadcoder0904]

What cheatsheet is this about? (if applicable)

Basic cheatsheet

What's your issue or idea?

I made a post on /r/reactjs.

The person said using React.FC has unintended side effects, you shouldnt use it anymore & pointed to facebook/create-react-app#8177

So I think it should be mentioned in the basics section :)

[eps1lon]

What do you think is missing from https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/function_components?

[deadcoder0904]

Oh, I see everything is there, but there can be a statement that says CRA doesn't use it for a reason mentioned in the PR facebook/create-react-app#8177 so it is not recommended a/c to CRA so people will use the 1st definition.

I went for the explicit one because I saw too many React projects with TypeScript use that although I read this cheatsheet but didn't knew the 1st one was the best way so a statement like that would have made me use the 1st one.

[eps1lon]

If CRA already copies all the reasons we mention why do we also need to mention CRA? What if they later decide to switch back? It seems to me that it makes more sense to list arguments other than "library X is doing it".

[swyxio]

i'm with eps1lon. think we cover it, but always welcome PRs to improve the wording and we can discuss wording in the PR.

[deadcoder0904]

Cool, I worded it poorly. We can just write Recommended way in front of the 1st point.

You have definitely copied everything from CRA but CRA is the industry standard for React. Anyone starting a React project knows about CRA so I mean I'd trust it more when you say CRA scaffolds Functional Component with TS like the 1st one or maybe just Recommended way is better.

[swyxio]

SGTM :)

[eps1lon]

You have definitely copied everything from CRA but CRA is the industry standard for React.

The person that proposed the change to CRA made the PR half a year earlier in this repository: #104.

If we copy text than we would've added a source.

Furthermore I'd be careful with statements such as "X is the industry standard". I'm not aware of any usage stats comparing next, gatsby and CRA. I highly doubt it since CRA doesn't even support any form of server side rendering.

We want to leave any framework recommendations out of this cheatsheet (since it's out-of-scope) and therefore we shouldn't include that it's recommended by CRA. It seems to me that by explaining typing function components without React.FC it's already apparent that we recommend it. Otherwise we'd have to prefix any sentence we write here with "recommended".

[deadcoder0904]

Furthermore I'd be careful with statements such as "X is the industry standard". I'm not aware of any usage stats comparing next, gatsby and CRA. I highly doubt it since CRA doesn't even support any form of server side rendering.

I wouldn't worry that much about it. As anyone who gets started with React definitely uses CRA first as it's in the docs. That's why I said industry-standard. Like if you use Vue, you're gonna start with vue-cli or React Native, then you'd start with CRNA.

It seems to me that by explaining typing function components without React.FC it's already apparent that we recommend it.

Cool then, I'll close this one 👍

[swyxio]

thanks for raising it and thanks for the discussion @eps1lon ! appreciate you all.