I’m not a creative guy so these projects already have me in a rut.
Is it bad if I stick to what I learned in just FCC lessons? I know it wasn’t recommended but I took a quick peek at other codes for these projects (the “simpler” looking pages) and even those seem to use a lot of stuff that wasn’t touched upon in the prior FCC lessons.
Should I take a look at other online courses for more HTML and CSS stuff or should I just tackle the projects with just FCC knowledge and come back to it later?
And will the HTML and CSS stuff I’ve learned in FCC be enough for future projects or am I expected to be learning more CSS and HTML stuff outside of it?
Sorry if this was already asked before, I’m just feeling a bit overwhelmed.
Don’t worry,I was in the exact same position as you. I got to the tribute page and just drew a blank, then once I had cobbled something together for the tribute, the portfolio page sent me into meltdown!
I know there are a lot of resources on this board, but the one that I found most helpful was Colt Steele’s web developer boot camp on udemy (I’m on my phone so can’t link). I paid 15AUD for it using a discount code (there are plenty about, let me know if you need one), and his modules on html, css, and bootstrap pretty much cover off all of that content.
the other alternative would be to start googling about bootstrap, html elements, and CSS and begin trawling the documentation. personally, I struggle with this method, but it might work for you
I think it’s totally fine to copy exactly the style and look that the examples use. It is important to be able to copy something exactly, and that doesn’t require much creativity. And it still is very good practice to try to precisely copy something.
And yes, you will have to learn a lot of stuff outside of the tutorials on this site. Especially later on, they barely teach you things at all. But personally I prefer it that way and I think you will too, cus googling stuff and understanding documentation is extremely important as a programmer. I mean say you don’t know or don’t remember how to make something specific, pretend it’s a certain type of navigation menu. You could go through tutorials for an hour and still not learn how to do exactly what you are looking to do. Or you could know how to use the docs (the documentation) and learn exactly what you are looking for in 2 minutes.
That’s exactly where I am now. I am returning to the curriculum after a long absence, and after having redone the FCC challenges up through the tribute page, I have hit a wall with the portfolio page. So I have very nearly the same question as the OP.
I know this isn’t kind, but many of the portfolio pages I see are awful. Many are designed more to show off trickery than to convey information. Prospective employers aren’t going to want to mouseover or click a bunch of things to get the information about you. Keep it clean and simple.
Copying and pasting the sample code from the above and then experimenting with it helped me the most. As mentioned, most of that stuff is only touched upon in FCC, so I’ve used https://www.udemy.com/the-web-developer-bootcamp/learn/v4/overview to help fill in the blanks, as like yourself, I started then stopped and forgot most of the learning.
I’m pretty sure there’d be youtube tutorials for how to use Bootstrap etc if you didn’t want to go down the Udemy route.
Cannot agree more with this advice. HIGHLY recommend. Instead of learning how to do a lot of stuff in one app that you slowly build in FCC, Colt Steele’s tutorials teach you a few concepts that you then apply to building a really simple webpage. Then you learn a few more things and build another simple page. Learning that way has made the Tribute Page challenge way less overwhelming for me now that I’ve come back to it.
I would recommend also going through the udacity basic html/css
While I think that the course has its flaws, inherently linked to how you could teach html/css that require I think a direct feedback (unlike python for instance)
It gives you a good first understanding of how bootsrap works and more importantly about some best pratices in web design, which could help a lot.
I am green green in html (started about 2 - 3 weeks ago) and the course gave me some best practices that help a lot. Portfolio still in progress though. So I too need to read and learn a lot outside FCC
Especially the use of jQuery for this project for instance.
If you aren’t creative, look at similar projects to get a sense of what pages look like. Then draw on a paper the sections you want, and how they should be laid out: like columns, images… It helps to have a visual idea of the finished product before starting to code.
Also, watching a lot of tutorials may keep you in a state of “beginner”. I advise you to get started. You may know more than you think. As you practice, you will remember classes and basic CSS.
And you can always refine the pages as you learn more.
For my tribute page and portfolio, I played a lot with images. You can have a look here:
I have been working steadily on my tribute page for the past couple days. I’ve avoided looking at other people’s code specifically to challenge myself. My particular question: Near the end of the YouTube video explaining how to complete the challenge, it says it should be basically all HTML, but I’ve got quite a bit of CSS already loaded. Is that bad
In this case, with the demo in the video, that should translate to “there’s a ton of CSS, but Bootstrap is doing all of it for me, and I’m just adding the right classes in the HTML.” And no, I don’t think it would be bad for completion of this project to write your own CSS, just that you could lean on Bootstrap if you wanted. (Also, distinction: if you mean you have Bootstrap loaded into Codepen, great. That means Bootstrap is then providing rather extensive CSS. You could also write any additional CSS rules you wanted for personal customization.)
Also, you should know: freeCodeCamp is in the midst of a complete overhaul of the course of study. In the new curriculum, Bootstrap is taught way after this project, and there’s a lot more emphasis on how to do CSS yourself instead of relying on Bootstrap.
Personally, I would encourage you to look at other people’s code. If you see a site that you like or has a cool widget… etc. Inspect it to try to understand how the effect/widget is made. For me, it is one of the best ways to learn. Never feel ashamed to look at others code. Just don’t copy it, without attribution. OR even better, if you are going to duplicate an effect or snippet, always write it from scratch, never copy and paste.
Also, don’t be afraid of adding your own CSS. That is how you make any project yours. However, if you are using a CSS framework such as Bootstrap it is best not to reinvent the wheel. It is likely that Bootstrap already has some CSS for the element you are trying to style so only minimal CSS will be needed to tweak the elements to your liking.
I tried the tribute page, it’s not horrible but I plan to rework it. After that I decided to work on the algorithm challenges first, ands save my portfolio page as the last thing I do before finishing front end. I will be better prepared (links to other FCC projects instead of placeholders) and will have more of a body of knowledge on page design than I did when trying to cobble together a tribute page.
I would not even have the simple tribute page that I ended up with if it were not for reading the documentation at the bootstrap site. My biggest limiting factor was trying to find a picture of a subject that wasn’t going to unintentionally violate someone’s copyright by using it.