[docs] Make migration doc easier to follow

[siriwatknp]

Preview: https://deploy-preview-26948--material-ui.netlify.app/guides/migration-v4/.

https://github.com/siriwatknp/material-ui/blob/fix%2Fmigration-docs/docs/src/pages/guides/migration-v4/migration-v4.md

The goal of this change is to make migration doc easier to go through from top to bottom.

Here is the summary of the steps I proposed in the change

• Update React & TypeScript

• ThemeProvider Setup

• Update Material-UI

• Run Codemod

• Handling Breaking Changes

• Migrate makeStyles to emotion

• Troubleshooting

• I have followed (at least) the PR section of the contributing guide.

[mui-pr-bot]

No bundle size changes (experimental)

Generated by 🚫 dangerJS against 6bee13b

[mnajdova]

I wonder whether it will be easier if we list first the changes not supported by the codemod, and then the rest of them. For developers that would use the codemod, I don't think that they need to go through all changes already handled by the codemod, in order to decide which ones are not handled.

[siriwatknp]

I wonder whether it will be easier if we list first the changes not supported by the codemod, and then the rest of them. For developers that would use the codemod, I don't think that they need to go through all changes already handled by the codemod, in order to decide which ones are not handled.

Are you suggested to move the breaking changes that already handled by codemod into another section?

I thought about it too but I don't want to change things too much and I am still doubt if it is actually better than the current one.

[mnajdova]

Are you suggested to move the breaking changes that already handled by codemod into another section?

I am not sure either, reading trough it, I felt like I could have skipped lot of the content as it was already handled by the codemod…

[mnajdova]

Sorry for closing it 😅 wrong click :)

[oliviertassinari]

Looks great, I had a quick scan, can't notice anything specifically wrong. If you see a horizontal scrollbar issue like me on the live preview, you can rebase on HEAD, we fixed it.

[thorn0]

Sorry, didn't read through all the comments. Why is it necessary to upgrade react-scripts? Will something not work if I keep react-scripts 3.4.1?