Does FCC Skip Fundamentals About HTML/CSS?

Hi everyone, I have started to follow tutorials on FCC. But it is not my first time on web development, I did some basic stuff on HTML/CSS+Express for a few homework projects before.

I have finished HTML+CSS+Bootstrap+JQuery part, but something took my attention. Why FCC doesn’t use “html, head, body” structure? And why it jumps to Bootstrap too fast? I was expecting more time allowed to practice for CSS and HTML itself.I know that I can/should follow more sources on the web and I am, but I’m thinking like someone starts to learning web-development from right here.

And as a beginner,is it okay to skip “head,body” structure and start to styling with Bootstrap without practicing CSS itself?

1 Like

I guess they want you to get used to using bootstrap, one thing I really think it should do is show you, container, container-fluid, and the differences. Back to your main question, I do think freeCodeCamp will take some research for completely new coders(and experienced programmers).

2 Likes

Yes, you may skip these. To earn certification you have to only do challenges marked with *****, but it highly recommended that you at-least review others, you might learn some good practices.

Freecodecamp challenges/road map is designed to keep in view the very basic learner, so no doubt, some of the challenges maybe time consuming to one who already does occasional web development.

1 Like

Why FCC doesn’t use “html, head, body” structure?

If you’re in codepen, it takes care of all of that for you. If you are building locally, you should put those things in. But these are fairly quick and easy things to learn

And why it jumps to Bootstrap too fast? I was expecting more time allowed to practice for CSS and HTML …

Yes, FCC moves rather quickly. It’s understood that you will investigate things on which you need more work, and that you will have to research things as you build your projects.

Every course needs to find a balance between breadth and depth. If FCC tried to teach you everthing about HTML and CSS before moving onto libraries, then it would take years for many people. The point is to get you coding and worry about filling in the gaps later.

And as a beginner,is it okay to skip “head,body” structure and start to styling with Bootstrap without practicing CSS itself?

I guess I am not understanding. How is “head/body structure” mutually exclusive from Bootstrap? And Bootstrap is CSS, just a CSS library. And it doesn’t prevent you from using CSS in other ways.

2 Likes

Yes, I’m doing for practice, although certification is great, I don’t want to get an empty certificate.

I got it, but I don’t like that “abstraction”, I mean if someone don’t get used to these things before, it could be hard to learn correct one later, but I guess I exaggerated a little, because it is not a big deal to notice these tags on someone else’s code and why we should use them.

I just referenced CSS+HTML tutorial together, I wanted to say, for instance if you don’t use body tag in your html, probably you will not touch it on CSS also. Is it nice to jump into pre-defined container styles before playing a little with basic tags.
But eventually I understood the whole concept from the answers, I just surprised very after I finished the tutorial, but now it’s past, I’ okay :slight_smile:

if someone don’t get used to these things before [document structure with body tags, etc.], it could be hard to learn correct one later,

I think it takes a few minutes to learn.

A basic principle of teaching is that you withhold information until the student is ready. When you take your first chemistry class, they teach you Bohr’s model of the atom. They know it is wrong (or at least not the best explanation) but you are not ready for quantum mechanics. People need to be eased into subjects. Information has to be withheld until the student is ready. Knowledge is digested in small bites. If you overload the student in the beginning, many will fail. Students aren’t ready for quantum mechanics on the first day, even if that is the more accurate description.

Advantages of Codeped:

  • It removes an element of complexity that allows students to learn gradually, more comfortably.
  • Students don’t have to search for a code editor and deal with directory structures.
  • Students are working in a uniform environment, making it easier to share information.
  • Students don’t have to have separate browsers open to run examples - everything is in the same window.
  • Students can easily share their code by linking to pens.
  • Other students can easily see, run, and even edit to try things out in the environment

This last one is a huge one for me. I can’t tell you the number of times I’ve seen people ask for help in the forum and I want to help, but they have only provided the JS and I don’t have the time or energy recreate their HTML and CSS to see what they’re seeing so I just skip over them. Even if they provide their HTML and CSS, I still need to create the file structure to run it. Sometimes they’re linking to external JS libraries and I have to guess what they are. It is sooooooo much easier to help someone with a link to a pen. So much easier.

Disadvantages of Codepen

  • When graduating to local development, you’ll have to take a few minutes to understand file/folder structure and what a text editor is (if you don’t know already).
  • You have to take a few minutes to learn how to encase everything in body tags and what html and head tags do. But the student now knows what html tags are so this is not a difficult step at that point.
  • The student doesn’t get to join in with the cool kids in the “I hate Codepen” club (closely related to the “JQuery is for losers” club). It’s very popular to complain about Codepen.

I think the advantages for a beginner far outweigh the disadvantages. Codepen is great training wheels for a beginner. Of course, eventually the student needs to break away from it, like all learning tools. I do all of my writing locally. But I still use Codepen occasionally, just to test small things out quickly.

If I had my way, Codepen would be the required tool for the front end stuff. It just makes life so much easier and makes it so much easier for students to share and get help. But it’s not my decision. I would agree that maybe FCC needs a better tutorial or video on how to transition from codepen to the “real world”. Maybe there is and I just haven’t seen it. It took me about 5 minutes (if that) to figure it out, but others might struggle.

3 Likes

Ahah. I liked that.

Keep also in mind, @mbmert, that you are free to use whatever you wish to create your projects (as long as the result and code are accessible).

Just as an example, if you want a more “classic” approach to file structure, you can use Plunker. It has all the advantages of Codepen, all the tags (!!), you can make private projects and it lets you add multiple files to your projects from the get go (while Codepen requires a Pro account to have more than one “project” with multiple files).

Still, for beginners, Codepen seems the more “user-friendly” choice, as @ksjazzguitar already perfectly explained.

1 Like

Okay guys don’t hit me I’m dead :slight_smile: I understood the whole thing( I hope). I’ve never blamed codepen btw, I find it very useful.