Introduction to state: Update 3rd assignment to make it easier for learners to understand.

[kahmoh]

Because

When reading, it took me a little bit of extra looking around to remember where the colour changing code was (the lesson or an external link).

This PR

• Add extra explanation to the start of the 3rd assignment explanation, to make it more clear where the example is.

Issue

Closes #XXXXX

Additional Information

Pull Request Requirements

• [x] I have thoroughly read and understand The Odin Project curriculum contributing guide
• [x] The title of this PR follows the location of change: brief description of change format, e.g. Intro to HTML and CSS lesson: Fix link text
• [x] The Because section summarizes the reason for this PR
• [x] The This PR section has a bullet point list describing the changes in this PR
• [x] If this PR addresses an open issue, it is linked in the Issue section
• [x] If any lesson files are included in this PR, they have been previewed with the Markdown preview tool to ensure it is formatted correctly
• [x] If any lesson files are included in this PR, they follow the Layout Style Guide

[kahmoh]

Another suggestion that I think ties into this one, is it expected for learners to be able to edit the codesandbox? If so, I was unable to. I had to copy the code into my own editor. If this isn't intended, it would be a good change to explain to users how to use codesandbox to edit the code.

[MaoShizhong]

@kahmoh I completely missed your comment because I already had a fork of the codesandbox and accidentally opened my fork, allowing me to edit without issues.

Can you open a new PR that adds to the 3rd assignment step that you'll need to fork the codesandbox? That can be done by clicking Open Editor in the top right of the codesandbox embed, then in the opened editor, forking it (should be top right again). You'll need an account (can login with github) as you might expect.

[kahmoh]

@MaoShizhong Hi, sorry for the slow reply. Yeah I'm happy to add that. I'll get to it tomorrow.