In this screencast I cover the absolute bare minimum setup for utilizing jQuery on a “real” website. We have an index.html file with the basic HTML5 structure stubbed out. jQuery is included as a <script>
and then we perform a super simple jQuery task. The entire file looks like this:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Learning jQuery</title>
</head>
<body>
<h1>Hello, World!</h1>
<script src="js/jquery-2.0.3.js"></script>
<script>
$("h1").css("color", "red");
</script>
</body>
</html>
I wanted to cover that right away so that you can experience how easy using jQuery can be. And also because we’ll be using CodePen for a lot of live coding for the rest of the series. CodePen just gives us a testing / demonstration environment that is easy to work with and great for screencasts. What it is doing behind the scenes is essentially the same as what we just did here. I wanted that to be understood – so you don’t think using CodePen is some strange/magical place that is different from how you would write code.
The same exact thing as we did with the index.html file is like this on CodePen:
See the Pen 7e6827079ef62ec19ed37ea763ef79a1 by Chris Coyier (@chriscoyier) on CodePen
This is awesome, thank you for posting this course!