Course Preview

JavaScript & jQuery Survival Guide

Learn basic yet critical skills for working with JavaScript & jQuery in the browser. By the end of this tutorial, the student will understand how to debug problems using the JavaScript console, write simple event handlers, and perform common manipulation of Document Object Model (DOM) elements. These three lessons are designed to prepare the student for typical challenges that they will face when adding or modifying interactive elements on a web page.

Course Outline

• Lesson 1: Getting Started

  In this lesson you’ll begin with a tutorial on how to install Bower, a package manager, and Gulp, a toolkit for automating common tasks in front-end development. Next, you’ll review how browser development tools — specifically the JavaScript console — are critical components of a modern development workflow. Finally, you’ll walk through a brief and important review of JavaScript expressions as a preparation for the coding in Lessons 2 and 3.

• Lesson 2: Managing Events

  Handling events is one of the most common tasks in front-end web development. In this lesson, you’ll start with a look at the basics of events and event handlers and then move on to topics including anonymous functions and event binding methods. You’ll end the lesson with an in-depth look at how to add interactivity to a form in order to improve the user experience.

• Lesson 3: DOM Manipulation with jQuery

  In this lesson, you will learn how to modify various portions of a page using jQuery. Specifically, you will explore how to dynamically modify CSS styles and how to inject HTML content into a document as well as learn basic animation techniques to enhance the UI of your page.

Prerequisites

• Basic to intermediate competency with HTML and CSS. Specifically, an understanding of how the DOM functions is helpful, as well as experience working with with complex CSS stylesheets.
• Experience with a text editor (such as Visual Studio Code, Atom, Sublime Text, etc.)
• Although not strictly required, a familiarity with our JavaScript Foundations course is highly recommended.

Requirements

• Mac or Windows desktop or laptop
• Web browser
• A text editor (We suggest Visual Studio Code, it’s free, and available for Mac, Windows, and Linux)

In addition to the requirements listed above, there are a few supporting technologies that need to be installed on your system in order to follow along with the lesson files. The instructor covers how to install these on your own system in Lesson 1, Chapter 2, but we are providing the links here for your convenience.

• Node
• Git
• Bower
• Gulp