Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
First jQuery challenge should mention linking to library + HEAD
See original GitHub issueChallenge Name
“Learn how Script Tags and Document Ready Work”: https://www.freecodecamp.com/challenges/learn-how-script-tags-and-document-ready-work
Issue Description
This is a text/content suggestion. The very first jQuery challenge doesn’t in any way mention that an HTML page needs to actually link to the jQuery library. Beginners really need to know/learn that all the effects don’t just come out of nowhere. This type of linking to a library (CSS) is explained in the Bootstrap introduction so why not do this for the jQuery introduction as well?
Additionally: it doesn’t mention that these particular exercises also make use of another totally different JS library. This really frustrated me when I implemented the code in SublimeText for extra testing and playing around with the basics. (In this case it also uses https://daneden.github.io/animate.css/ but that isn’t necessary to know for beginners so this doesn’t need to be addressed in this issue).
Suggestion
I would suggest to add this text to this challenge:
You can add jQuery to any page just by including it by adding the following code to the head of your HTML:
<script src="http://code.jquery.com/jquery-1.12.4.min.js" ></script>
In this case, we've already added it for you to this page behind the scenes.
This means that the concept of the <HEAD> tag needs to be explained somewhere as well! At this moment I haven’t seen any mentioning of the <head> anywhere on FCC. I know that is a separate issue though.
Example:
Here’s how the FCC Bootstrap intro does it clear enough for beginners (except for choosing the word ‘app’ instead of page): https://www.freecodecamp.com/challenges/use-responsive-design-with-bootstrap-fluid-containers
Issue Analytics
- State:
- Created 7 years ago
- Reactions:1
- Comments:12 (8 by maintainers)
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
@jolarti this seems like a subject that could be covered better in a wiki article or in a video challenge, rather than a challenge in FCC’s curriculum. The reason is this isn’t a good interactive lesson.
As you can see here, Chrome parses my raw HTML (without any of those tags you mentioned) just fine:
Yes - this is important to understand what goes in the head and what goes in the body, and that there’s a title tag (though all of these things are handled by all major web frameworks for you). Campers probably won’t encounter it early on unless they download a static HTML template.
Would you be interested in creating a wiki article explaining the structure of an HTML page, and we can look into creating a video challenge about this?
@QuincyLarson when you say “Campers probably won’t encounter it early on…” this worries me. I’m a beginner and all I do is just do the challenges, assuming it will teach me the fundamentals I need to know. I would think that most beginning campers will do and think the same.
Now I am worried if there is more that I am missing out of, when only doing the challenges. If not, there should be a disclaimer that says something like “Don’t just do the challenges, make sure to check out all introductory pages on our wiki here (+ a link to it)”