I’m currently working on a project that involves migrating an existing React application to Next.js. However, I have a requirement from my client to maintain the use of Material UI version 4 for the time being.

The current setup involves a standard Create React App (CRA) structure with several components styled and functioning with Material UI v4. I’m aware that Next.js has some different configurations, particularly around SSR (Server-Side Rendering) and handling of styles.

Here are the key points I’m looking for help with:

Maintaining Material UI v4: How can I ensure compatibility and smooth functioning of Material UI v4 in the Next.js environment?
Handling SSR with Material UI v4: What specific steps should I take to properly manage styles and SSR with Material UI v4 in Next.js?

If anyone has experience with a similar migration or can provide insights on handling these requirements, I would greatly appreciate your guidance. Any examples, documentation, or resources would be very helpful.

Thank you in advance for your assistance!

I haven’t tried implementing the migration yet. Currently, I am in the analysis phase, trying to determine the feasibility of this migration. I am looking for best practices and potential issues to consider before starting the migration process.