Javascript and jQuery Basics for Beginners

Learn the skills necessary to get started with Javascript and jQuery. A simple course made for beginners.

4.25 (373 reviews)
Udemy
platform
English
language
Other
category
Javascript and jQuery Basics for Beginners
8,849
students
3 hours
content
Jun 2015
last update
$19.99
regular price

What you will learn

You will acquire knowledge of DOM, events, loops, conditions, statements and many more..

You will be able to create simple webpage using Javascript and jQuery

You will have a good knowledge of Ajax

Description

Overview

JavaScript is a programming language that can be run by all modern web browsers. It is downloaded alongside the HTML code of a webpage. Unlike HTML, which can only be used to display content, JavaScript allows web designers to add functionality and interactivity to their websites.

JQuery is a popular JavaScript library that is used extensively in modern websites. This library facilitates common JavaScript tasks such as animations, event handling, manipulating HTML content, and communication with external servers. In addition to its easy-to-use features, JQuery also takes care of many cross-browser compatibility issues automatically.

What you will learn

Javascrtipt Modules...

We will begin the course by learning where to write JavaScript. We will look at writing JavaScript directly inside an HTML tag, then inside of a <script> tag, and then finally in a file separate from the HTML document. We will discuss some of the reasons for using each method.

After that, we will learn about how to manipulate some basic data types. We will learn about how to do simple arithmetic, and also look at some of JavaScript's built-in mathematical capabilities. Then, we will learn about working with words and characters, using a data type known as the "string". We will also cover the Boolean type, which is a representation of True and False inside of a programming language.

Then we will move on to more complex types. We will learn about the array, which is essentially a list. We will look at how to create arrays, how to access elements inside them, and how to modify the contents of an array. Functions will also be covered, which will allow us to organize code into simple, reusable pieces. We will also learn about objects, which are a way of grouping together data and behaviors.

We will then move on to control flow. We will look at the "if" statement, which allows the script to decide whether or not to execute a block of code based on some condition. We will also look at looping. Looping refers to repeatedly executing a block of code until some condition is met. Then, we will learn about errors, and how to handle them properly so that they do not halt execution of the script.

Next, we will look at the Document Object Model ( DOM ). This is what allows JavaScript to interact with the HTML code of a webpage. We will look at several ways of finding any particular HTML element on the page. Then we will see what information we can extract from that element (tag name, attributes,etc.). We will learn about adding and removing elements from a page. Finally, we will learn about events, which allows JavaScript to react to things like mouse clicks, mouse movement, key presses, and many others.

We will end the course with a practical exercise, in which we will build a simple JavaScript-based webpage. We will put to use most of the concepts covered in the course. We will look at how to validate user input, how to display results, and how to display meaningful error message to the user.

jQuery Modules...

We will begin the course by learning about selectors. Selectors are strings that are used to target specific HTML elements on the page. The selector syntax is highly intuitive and easy to read and understand.

We will then move on to events. The student will learn how to write code that reacts to things like mouse clicks, key presses, when the page is done loading, and a few others. These events allow programmers to create interactive user interfaces.

After that, we will move on to effects and animations. Effects are used to hide and show elements. An example would be a menu that slides open when the mouse hovers over it. JQuery has a few built-in effects that can be implemented with minimal coding. For further customization, we will look at animations, which allow programmers to animate most of the visual properties of HTML elements.

Then we will learn about changing the HTML content of a webpage. This includes adding and removing entire HTML elements, as well as modifying text and other HTML attributes programmatically. We will also learn about how to navigate the tree-like structure of an HTML document using the concept of parent-, sibling-, and child-elements.

Finally, we will end the course by looking at AJAX, which stands for Asynchronous JavaScript and XML. AJAX allows programmers to interact with external servers. To serve as our example, we will read airport data from a public web service. We will learn how to request data, how to handle the response, and how to handle errors.

Prerequisites

HTML: The student must know how to use HTML tags and attributes. Only a very basic understanding of HTML is assumed.

Google Chrome (Recommended): Google Chrome is a free web browser and it will be

used to execute all the examples in this course. Although all browsers can run JavaScript, Chrome has extensive built-in developer tools. In the course, we will be using Chrome's JavaScript console, which will allow us to run quick little examples without the need to create and edit files.

Notepad++ (Recommended): Notepad++ is a free, open-source text editor. Although JavaScript and HTML can be written using any text editor, Notepad++ is highly recommended because of features such as syntax highlighting and auto-complete.

Content

Introduction

Introduction to Javascript

Overview and Basic Setup

Course Overview
Basic Setup

Variables and Primitive Types

Numbers Demo
Variables Demo
Strings Demo
String Methods Demo

Object Types

Arrays Demo
Functions Demo
Objects Demo

Control Flow

Conditionals Demo
Looping Demo
Errors

Document Object Model (DOM)

Elements and Attributes
Events
Function Calculator Exercise

Introduction to jQuery

jQuery - Intro and Setup

Selectors, Events and Effects in jQuery

jQuery Selectors Demo
jQuery Events Demo
jQuery Effects Demo
jQuery Animations Demo

DOM in jQuery

DOM Content Demo
DOM Structure Demo
DOM Traversal Demo

AJax with jQuery

Ajax Demo Part 1
Ajax Demo Part 2

Reviews

Robert
March 25, 2021
Very straightforward, but sometimes taking a beat to lay out the functions we're going to create and why could allow for better uptake of the material. But over all very concise and well done.
Chin
July 25, 2019
Awesome! It was way better than what I expected. The explanations were crystal clear. JavaScript never been more fun to learn. I finished the course!
Stephen
June 7, 2019
It has lots of good information that you can follow along with and save examples for yourself down the road to look back on.
Robert
January 12, 2019
I really enjoyed this course. The only thing I would add to it is making it a little longer with more real-world examples.
Michael
February 7, 2016
Great beginning course on JavaScript and JQuery, has many excellent example problems and coding examples for many parts of the JS and JQ. Easy to follow along and code up example problems. Lack of closed captioned (and sound) did not hinder what teacher was showing in actual code. Awesome.
Srianjana
February 1, 2016
The course touches all the important concepts of the language and its library. The instructions are clear. A very good starting point for learning the language.
Angelo
January 10, 2016
good intro course. would be useful to go beyond the basics and show how JavaScript fits in with common web development tasks . i.e. practical purposes.
David
December 30, 2015
The information was laid out in a structured, logical, and bite sized chunks. When you need to learn this quickly, this is a solid course to employ.
Kelly
December 16, 2015
This course was very easy to follow and had good examples of basic JS and jQuery. I would recommend this for someone starting out as a good place to start, practice and learn the foundations of the language.
Daniel
December 4, 2015
I was pleased w/ this course and learned a few things along the way. Instructor talks calm and describes what he's doing along the way. Topics covered are the same that any other JS or jQuery courses has covered, but I found myself picking up a couple things that made more sense now, due to watching this tutorial. I realized that the jQuery section is a duplicate of their jQuery course. So, you can skip that by watching this tutorial. A really cool JS exercise, but the code seems a bit outdated. Overall, I enjoyed the course and it's great for absolute beginners.
Tomás
November 4, 2015
The contents are fine, but the lessons go too fast and I could use deeper explaining in some aspects.
Jonathan
October 8, 2015
Note: the first half of course (the javascript part) has the exact same videos from the 'Learn Essential JavaScript Fundamentals' course by the same instructor, so if you already took that course skip ahead to the jQuery section.
Gavin
September 17, 2015
From someone who knew nothing at all about JavaScript, I feel very well accustomed only half way through the course, excellent content! The tutor keeps you engaged with his short and informative videos.
Luz
August 26, 2015
I have taken several JS courses lately and this one had several things that I had not seen in others. It's got lectures short enough to watch on the go, but explained well enough to make sense and not feel like you are missing key information. I enjoyed it- highly recommend it!
Suzanne
July 24, 2015
The display is too small to see clearly. The text editor window needs to be larger. Ross races through each topic and doesn't give enough background to what he's doing and why.

Charts

Price

Javascript and jQuery Basics for Beginners - Price chart

Rating

Javascript and jQuery Basics for Beginners - Ratings chart

Enrollment distribution

Javascript and jQuery Basics for Beginners - Distribution chart
507064
udemy ID
5/20/2015
course created date
11/7/2020
course indexed date
Bot
course submited by