Actually, my previous advice is for someone much further behind than you currently are.
I just looked up your current portfolio on Codepen and you have the right idea, you just need to read your code carefully for errors and tweak some of the formatting a bit.
Some tools that will help you debug your work are the chrome developer tools (specifically the error console). In Chrome, pressing
Ctrl+Shift+I will bring up the developer tools and you can select
Console to see any errors your work might be throwing. This will point you in the right direction about what to Google.
Another set of tools that are great are the code analysers built into Codepen.
For example, in the HTML panel, click the caret menu toggle in the top left corner and select
Analyze HTML and it will report on your code for you. It won’t necessarily tell you why something is a problem, but at least if gives you enough info to frame a question to ask on here.
Another thing to be aware of is that Codepen is a little non-standard compared to developing entirely on your own computer. For example, in your portfolio, you include
<script> tags. These are not necessary (or advised) on Codepen, since the CSS and JS panels are automatically included. Simply write plain ol’ HTML in the HTML panel, and CSS and JS in their appropriate panels, and Codepen will link it all up for you.
When you start developing on your own system without Codepen, those
<head> tags etc will be appropriate.
It’s also worth noting that the resistance you are feeling to coding is totally normal. Everyone experiences it. Even really experienced devs get bogged on issues that take them ages to resolve and a tonne of Googling, Stack-Overflowing, and head-banging.