For other newbies struggling, try this:

From a fellow newbie.

I recently completed my applied visual design but was still struggling so I decided to go back and do it all again only this time I would start with a blank coding page (see I don’t even know the name, that’s how far I am!)

This forced me to not only keep writing out the “style” elements but also the “divs” adding “ids” & “classes”.

I’ve done one so far (create the heart shape), ironically this is where I quit FCC last year, was far too complicated and now I’ve just completed it without having the original material set-up for me, I just go off the instructions on the left.

I must have spent a couple of hours trying to do it but the end result is that the pattern of creating a heart, moving shapes, adding positions, using pseudo elements has made me much more competent than before I tried this technique.

I’m sure this is old news but it helped me so if anyone feels like it’s not sinking in, go back and try this.

I plan to do most of the challenges this way. I was essentially doing the same thing with sublime text but this makes more sense.

6 Likes

What you are doing is creating all the starter code of a problem yourself. It is unclear if you are generating the starter code or if you are retyping it into your editor, either way, that method works for you. The “create a beating heart” challenge template is more advanced than the code necessary to complete the module. You learned extra. The template code is about the level of the module or more difficult. Copying down all of the template does reinforce ideas. Sometimes, it is enough to only do the code section and that is up to a user. The beating heart challenge was an example of that.
When copying templates fails to elucidate, copying some of read examples from other sources helps in understanding some concepts. I use the freeCodeCamp editor on past modules to not have to set up Redux, where there are the modules of a unit, notes, and outside examples. CodePen and replit are also used to test solutions and take notes as a place to draft before throwing onto a Pen. Below is an example of another style of not only passing the modules.
2021-04-05-react-redux-code-snippets-1-.js (codepen.io)

1 Like