CV Application: Add a short warning that mentions <React.StrictMode>

[miguelruizc]

Checks

• [X] This is not a duplicate of an existing issue (please have a look through our open issues list to make sure)
• [X] I have thoroughly read and understand The Odin Project Contributing Guide
• [X] Would you like to work on this issue?

Describe your suggestion

I suggest adding a small warning about in the "Project: CV Application" lesson to prevent confusion in the first React project of the course.

By this point in the curriculum, we have learned to create a React project using Vite, which includes the tag by default:

This causes double rendering and double mounting of components, leading to confusion and unexpected behavior. It took me several hours of debugging to finally discover what StrictMode is and how to resolve the issue.

I propose adding a small warning about StrictMode so that future students are aware of potential issues caused by it.

Path

Node / JS

Lesson Url

https://www.theodinproject.com/lessons/node-path-react-new-cv-application

(Optional) Discord Name

mRUIZ

(Optional) Additional Comments

No response

[miguelruizc]

I just realized StrictMode is mentioned in the next lesson. I still think it would be helpful to mention it one lesson earlier in case students find themselves having issues with double rendering/double mounting while working on the CV project.

[MaoShizhong]

Agreed that it wouldn't hurt to pop a note in the CV project instructions just mentioning that if you see stuff like console logs being doubled up on, it's because of React.StrictMode, and that it's intentional behaviour and will be relevant in the next lesson. Doesn't need to be much more than that, shouldn't need to explain the details of strict mode in that note.

We can use a note box at the top of the Assignment div.

Since you specified you'd like to work on this, I'll assign this to you.