The complete beginner JavaScript ES5, ES6 and JQuery Course

Learn javascript from the scratch, and build your own applications using Jquery, JSON, Ajax, ES6.

4.30 (685 reviews)
Udemy
platform
English
language
Web Development
category
The complete beginner JavaScript ES5, ES6 and JQuery Course
13,695
students
22.5 hours
content
Feb 2019
last update
$49.99
regular price

What you will learn

Use JavaScript to create websites and applications.

Description

Master JavaScript and start building rich webpages and applications.

JavaScript is the most used language in the world to build Web-Pages and applications. Today the most popular frameworks and MVC'S are JavaScript based, so you need to master javascript to create a project with today's standards.

In this course...

We will start from the very beginning. From "..I Don't know what JavaScript is..." to actually build a few applications and debug code. We will divide this journey together in different modules, where we are going to be increasing the difficulty as we advance through the course.

After each module we will do some exercises and then together we will review how I solved the exercises

Since I believe that the best way to learn its by coding, at the end of the course, we will create three real life applications from the very start, and as we advance in time, I will be adding more project so can practice something new.

To sum everything you will learn in this course, we will learn:

  • .The very basics of javascript. Variables, Operators, Array, Objects, Functions, Loops, Control structures.
  • We will learn how to manipulate the screen with the DOM, Events, Listeners, creating elements, Inserting elements and more.
  • When we hit the advanced sections, we are gonna go deep intro Array, Objects, Prototypes, Functions so you can code like the professional do.
  • We will do exercises and at the end we will put everything in practice to build three real life applications.
  • And of course we will cover bonus features like Requests, other frameworks like Jquery, we will talk about some third party libraries we can use to make our code better.
  • ES6, we will talk about most of the tools and updated ES6 provides.

What about the instructor experience ?

Well I've been around for 10 years now, built lots of applications for small projects and big companies like Citi,Fox, Dysney and a lot more.

Today I work as developer for a major company developing applications in React or Angular mostly, but I like to teach in my spare time.

What are the requirements?

  • Knowing a little bit about HTML and CSS, nothing else.


How about the target audience?

  • This course is for everyone, if you know HTML and CSS
  • If you want to be profesional, this is the course for you. 

Content

Starting with JS

Introduction
IDE selection
Projects of the course overview
How you should use take this course

ES5: Learning the basics

Run JS: Inline or by import
Variables
Variable Types
If statements
Switch
Operators
Operators continued.
The "for" loop
More on the "for" loop
While loop
Functions
More on functions
Exercise one
Exercise two
Exercise three
Exercise four

Master of the DOM

The DOM and the document
More on the DOM
Selecting elements
Create and insert
Remove elements
Events
Propagation

ES5: Arrays and functions

Creating and modifying arrays
Splice, index of and slice
Concat and Join
Map, foreach and filter
IIF
Build in functions
SetTimeout, clear and set intervals
Math built in functions

ES5: Objects and Requests

Using objects
The this keyword
Proptypes
The Constructor
The constructor continued
Finishing with the constructor
Making requests

ES5: Practice project one

Creating the markup
Creating the cards
Adding cards
Adding cards continued
Deleting cards

ES5: Practice project 2

Creating the markup
Adding applicants
Adding applicants 2
Showing names
Deleting names
Getting the looser
Finishing project

ES5: Practice project 3

Creating the markup
Making the requests
Showing the bocks

JQUERY

What is JQUERY
Loading JQUERY
Selecting elements, classes and ID's
Selecting other elements
Childrens
Parents, prev and next
The EQ helper
First, Last, Filter and Not
Append, prepend, after and before
Replacing and removing
Accessing element data
Working with classes
Working with styles
Data attributes
Events
Mouse events
keyboard events
Other events
Form events
Transitions: show, hide and toggle
Fading transitions
Slide transitions
Animating
Animating continued..
Stop animations
Timing animations
Ajax Load
Ajax get and post

JQUERY: Practice widget - tabs

Creating the markup
Creating the JS

JQUERY: Practice widget - Slider

Intro and markup
Creating the main functions and the prev
Finishing the slider

JQUERY: Practice widget - Overlay

Intro and markup
Adding the JS

JQUERY: practice project - Quizzer

Intro and adding markup
Starting the Quiz js
Showing options
Moving to the next quiz
Showing progress and values

JQUERY: Practice project - RSons

Installing NODE - MAC OS
Node project with express and json server
Creating the server
Adding header
Home slider
Finishing slider
Fetching home albums
Home events
Finishing home events
Subscribe widget
Subscribe widget continued
Finishing the subscribe widget
Image gallery
Image gallery continued
Finishing image gallery
Contact form
Adding validation to contact
Finishing application

ES6 ( ECMAScript 2016 )

Introduction to ES6
Scope with Const and Let
Template Strings

ES6 - Using Helpers

Helpers
Foreach Helper
Foreach Helper - Example 1
Foreach Helper - Example 2
Foreach Helper - Exercise
Foreach Helper - Exercise Solution
Map Helper
Map Helper - Example 1
Map Helper - Exercise one
Map Helper - Exercise one solution
Map Helper - Exercise Two
Map Helper - Exercise two solution
Filter Helper
Filter Helper - Example
Filter Helper - Exercise one
Filter Helper - Exercise one solution
Filter Helper - Exercise two
Filter Helper - Exercise two solution
Find Helper
Find Helper - Example one
Find Helper - Example two
Every and Some Helper
Reduce Helper
Reduce Helper -Example two

ES6 - Functions and Objects

Arrow Functions
Arrow functions continued
Object Literals
Object Literals continued
Default Arguments
Rest Operator
Spread Operator

ES6 - Classes

Using Classes
Using Classes 2
Using Classes 3
Using Classes 4

ES6 - Destructuring

Destructuring Objects
Destructuring Arrays
More on Destructuring
Destructuring function arguments

Jquery UI

What is jquery UI
Draggable
Droppable
Resizable
Selectable
Sorteable
Accordion
Datepicker
Autocomplete
Slider
More widgets
AddClass and RemoveClass
Effects
Toggle
Switch Class

Reviews

William
March 2, 2023
!!! WARNING !!! This course is FULL OF BUGS! Nobody who is allowed to publish a course should be making these mistakes. I bought this course as a refresher and wasted a lot of time cleaning up code, and fixing bugs. This guys approach can be found in many low budget, out of date books...NOBODY USES THE 'VAR' KEYWORD ANYMORE! Using 'var' is a big NO NO!!!! I wanted my money back, but unfortunately had gone too far before frustration got the best of me. Oh well...
Cletus
February 24, 2023
I really learned a lot as a beginner and i hope to re-study it again because it will help me. But I also expected a readable version as speech-to-text couldn't register the words accurately. Thanks, hope to get more training from you
Buğra
September 4, 2022
That course was enough for me. I learned basics of JavaScript on ES5 and ES6. I was expecting that there should be challenges on this course. Francis writes all codes and never let you think on some. Ofcourse you can code it by yourself, If you get the point of each lesson. Mostly, I switched on subtitles for better understanding. But sometimes Francis writes his codes on buttom of screen and this is kind of confusing because of overlapping. I switched off subtitles many times. Thanks for everything.
Jaspreet
July 30, 2022
Yes, This is amazing course to learn . Instructor making every thing clear with examples and his method of teaching is excellent . I recommends this course to everyone who is just learning JavaScript as beginner
Preetam
March 12, 2021
SIR, YOUR TEACHING STYLE IS BEST . YOU PUT CONFUSIONS AWAY. YOUR JQUERY AND JAVASCRIPT PROJECT ARE FABULOUS
Adam
December 28, 2020
It was a good experience and made me excited to see how I was able to the very beginning seeps of JavaScript.
Anthony
June 21, 2020
Course Has shown new styles and scripts Iam a New be to javascript and jquery but its been intresting so far Anthony
Sergio
June 21, 2020
I'm still halfway with the course, but so far it's been great, I've learned a lot about JavaScript, I'm still relatively new to JavaScript but have some previous experience and this course it's been a real help to understand and learn a lot of things, the practice parts are great, I definitely recomend this course for those who are starting with JavaScript.
Milan
August 28, 2017
Ok, that's fine :) Edit: Content is good, and you got it covered pretty nice. There is one slight issue I can't wrap my head around. It's when you compare two values and say "x is equal then y". It's very odd to hear it because you can say something is equal and use "then" to compare them. Please, for future courses say it properly - "x is equal to y" and so on. Otherwise, all good :)
Eric
August 14, 2017
Best course I have done on Javascript by far, the instructor is excellent in explaining on how things work in a simple way that is easy to understand. Highly recommend anyone who is interested in learning or brushing up their skills with JS.
Stas
August 11, 2017
As far as practical knowledge the instructor is very good at showing how to write code. But the explanations are not very deep and detailed in a sense that you understand a concept in your mind, you just get the practical knowledge of how to do it. It's a very good course but I would combine it with another one that goes in-depth into very small details and explanations in a case where there is no prior knowledge in programming such languages.
Vinod
August 9, 2017
His teaching is very easy to understand, and he is a cool javascript instructor. I am learning a lot from this course.
Jejomar
August 8, 2017
Very informative course. You will never get bored specially in the part where you will build projects.
Hauke
July 31, 2017
My first ever udemy course. The lecturer explains well, the speed is good to follow. A minor downside: It takes a lot of CSS as given knowledge. The lecturer does not explain those parts, for example how the bootstrap framework is used.
Muhammad
July 22, 2017
the course is looking awesome but for some experienced learner there should be a video for the syntax of js so that it only learn about that and go ahead. Means being a experienced developer i know much of the things about programming so while taking basics video getting little bit bore.

Charts

Price

The complete beginner JavaScript ES5, ES6 and JQuery Course - Price chart

Rating

The complete beginner JavaScript ES5, ES6 and JQuery Course - Ratings chart

Enrollment distribution

The complete beginner JavaScript ES5, ES6 and JQuery Course - Distribution chart

Related Topics

1260288
udemy ID
6/19/2017
course created date
3/10/2019
course indexed date
Bot
course submited by