Hi. Im new to learning code and i took the basic html and css lessons. Im at the 5 final challenges and honestly i feel lost. Im looking at some other projects for the tribute page and the html code they wrote up and i dont think I know enough after doing the basic html lessons to make these projects. I wrote each lesson down, almost never had to use the get a hint or watch video button but have never had to string that much code together without much instruction. Heck looking at there code i dont even know what most of it is even there for or how to do it on my own. Any advice or help would be appreciated. Thanks.
Hey Jay,
nice to meet you!
It’s totally normal that you feel overwhelmed.
When you think about it, you’ll see that you only see the peoples’ end product.
You do not see the work and effort they put into it.
It’s like looking at the top of a mountain and only seeing the fact, that some people are standing on top of it. But you probably don’t think about the process of climbing the mountain.
I think it’s good advice to divide every project into tiny steps:
E.g. read User Story #1, try to solve it, fiddle around with it,
run the tests and be proud about the 1/10 test button.
Then read User Story #2, try to solve it, fiddle around with it,
run the tests and be proud about the 2/10 test button.
Looking forward to seeing your progress!
Honestly idk if i have the knowledge yet to complete these with such little instruction its the first coding I’ve ever learned. I’m reading the user stories and its like reading a foreign language. Are there more lessons I can take to learn some more about HTML and CSS? Looking at the Dr Norman page and html I feel like I’m looking at code I haven’t ever seen. Its just upsetting I felt I was doing so well with the lessons and actually enjoying learning coding for the first time. Spent all that time to arrive at this point of reading the first user story and feeling like this, not even knowing how to complete a tag the right way or even remembering what a <div img - div is… And I totally understand I sound like a complete baby right now. Thanks for the encouraging words I really appreciate it.
until now you have familiarized with the language.
Now it’s time to learn how to use it.
Use Read-Search-Ask method as much as you need.
The thing you should try not due is to copy and paste from an other project, try instead putting togheter the pieces yourself.
Now it’s the hard part, the one in which you don’t remember much, and have to go back to the challenges or google stuff, and maybe need to ask for help.
Note that there is not such a thing as an element “img div”, I’m pretty sure the user story wants instead img-div
id given to a specific element
You don’t need to learn more HTML and CSS, all you need to do is re-read your notes, it’s all there.
If you’re writing them on paper, you might want to move to an electronic form because that will allow you to search for keywords. Mine are currently on Evernote and I rely heavily on the search. The alternative is to re-read everything and at some point that becomes unpractical.
For instance, you don’t seem to remember about id
. I found it in my notes in the lesson called “Link to Internal Sections of a Page with Anchor Elements”. That’s not the only use for id
but that’s where it’s introduced.
At this stage, don’t look at the code of the example and don’t look at other people’s projects. People start by passing all the tests then they keep improving the project until they have something they are proud to show the rest of us. My first version was very basic then later I went back and tried to make it look nicer.
Just focus on passing the tests one at a time. You are working on a version with the test suite, right?
Thanks for the comments and support. I’m going to go ahead and make an attempt at it I don’t want to quit after all the work I did and your encouragement has helped. I wrote each lesson but also copied them into a word pad as well. Your probably right it will be faster to search through there. I believe it tells me to use the code pen link to make the project is that the test site that your talking about?
If one user story is to complex, then it’s good advice to divide it into more simple baby steps:
User Story #1:
My tribute page
should have anelement
with acorresponding
id="main"
, whichcontains all other elements
.`
- How do I create
my tribute page
? - What is an
element
and how do I create one? - What is an
id
? - How can I connect
element
withid="main"
? - How can this
element
containall other elements
?
Thanks breaking it down into pieces like that should definitley help. A question I have is when building this page do I need to go down the list of user stories like there instructions and add the first then the second etc. or should I just start then make sure I have everything there asking for? Also sfiquet you commented am I using the version with the test suite. Is that the code pen site ? Because this is what it says at the bottom this long link doesn’t open into anything. Thanks for the help everyone.
You can build your project by forking this CodePen pen. Or you can use this CDN link to run the tests in any environment you like: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
that url is the test suite url - to use it you need to import it in your project
in this pen, it’s done with this script tag:
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
you can also add the link to this part of the pen settings, " Add External Scripts/Pens", which does the same thing but you will not have it in the html box and you may avoid the risk of deleting it by mistake
if you are curious you can also open the link, it’s a whole blob of minimized JavaScript code that all together make the test suite for the many projects - if you have not started JavaScript it will not make any sense. If you know JavaScript it will make a little bit of sense, minimized code is not human readable
I’m completely lost right now do I just start my project in code pen or is that link something I need to use to make my project. code pen had a little test box I see I guess it checks your code I’m trying to complete the basic HTML Course going to attempt a tribute page Also when making your projects do you need to follow the user stories and complete them one by one or just start attempting to make the page?
So i need to leave this link At the top of the html box in codepend??? im not understanding this it says either use codepen or that link that opens a bunch of js mumbo jumbo i dont know. I entered in some code and hit test and it failed but its right is that because i left that cdn link at the top of the html section of codepen?