Free Online Courses for Software Developers - MrBool

Click here to login

If you don't have a registration, click here to register

Mrbool Courses

Online course

Programming in HTML5 with JavaScript and CSS3 Exam 70-480 Training

In this course, we will be programming in HTML 5, supporting our logic with JavaScript, and enhancing the display using CSS3. We will structure the UI using semantic markup (like section, article, nav, and header). We will also explore HTML 5 API, such as storage API, AppCache API, and Geolocation API. On the JavaScript side, we will work with object and variable scope, implement objects and methods, raise and handle events, implement callbacks, create web worker processes, validate user input, comsume JSON data, and serialize and deserialize data. In CSS3, we will apply transforms, style HTML box properties, create a flexible content layout, use CSS selectors, and create an animated and adaptive UI. What is different about this course is that it will be in the format of exercises and exam questions. Most of the material we are discussing apply to all browsers, but many subjects will be IE specific. The reason is that by the time you are done with this course, you should be ready for the Microsoft 70-480 exam.

  • Introduction

    • 1


      In this lesson, we will kick off our HTML 5/JavaScript/CSS3 course. I will show you the course coverage and what items we will be discussing. Watch this video
    • 2

      Starting With Variables

      In this video, we will start our discussion with variables. First, I need to remind you that there are many tools available to write your code (plnkr, jsFiffle, Visual Studio, Sublime Text…) and there are many browsers to preview the results. Watch this video
  • JavaScript

    • 4

      JavaScript functions

      In this lesson, we will talk about JavaScript functions. We will see that functions are the core of JavaScript. We will create and call functions, and see that functions always return a value. Watch this video
    • 6

      Scope Callbacks

      In this article we will talk about Scope Callbacks. We will create couple of functions and pass a function as a parameter to another. Watch this video
    • 7

      Declaring variables within a block

      In this lesson, we will complete our discussion on scope. I will explore other examples that show the variables with global scope and those with function scope. Then, I will show you that declaring a variables within a block. Watch this video
    • 8

      Working With Objects

      In this lesson, we will talk about objects. We can create objects in JavaScript using the curly braces ({}). We add properties into the objects using a key value pairs separated with commas. Watch this video
    • 9

      Working With Arrays

      In this lesson, we will continue our discussion on arrays. We started our discussion in the previous lesson by mentioning that arrays are declared using square brackets ([]). Watch this video
    • 10

      Functions with Arrays

      In this lesson, we will wrap up our discussion on arrays. We will explore all the different functions we can use with arrays. We will see that we can concatenate arrays, and find the index of elements. Watch this video
    • 11

      Working With SVG

      In this lesson, I will shift our discussion to HTML 5 and specifically Scalable Vector Graphics (SVG). Here we will see how to use SVG to draw simple and complex shapes. Watch this video
    • 12

      Grid and Append Child

      In this lesson, we will talk about two subjects: grid and appending child elements in JavaScript. The first part will discuss creating the grid. Then, we will discuss how we can dynamically add child elements to existing ones. Watch this video
    • 13

      Gradient and Video

      In this lesson, we will gradients and videos. Starting with the gradients, we will see that we can create a linear gradient and a radial gradient. Then, we will see how easy to create a video tag and load a video with controls. Watch this video
  • HTML 5, JavaScript, CSS3

    • 14

      Working With 3D Transform

      In this lesson, we will talk about CSS3 3D transforms. We will start with creating simple divs. Then, we will create a box CSS class that will change the height, width, and perspective of the outer divs, in addition to the display and the margin Watch this video
    • 15

      Working With Ajax

      In this lesson, we will talk about Ajax calls. We will be using the $.ajax jQuery function to retrieve some weather information. When it comes to Ajax calls, it is important for us to understand the concept of ‘now’ and ‘later’. Watch this video
    • 16

      Working With Comparison and Display Style

      In this lesson, we will discuss the comparison operator and the display style. We will take a look at the difference between the == and === operators. === is almost always the operator that you need to use because it compares the content and the Watch this video
    • 17

      Working With Canvas And Columns

      In this lesson, we will discuss canvas and columns. For the canvas illustration, I will using an existing example from the MSDN site that contains the information that we need to be ready to draw in a canvas and answer the test questions. Watch this video
    • 18

      Working With Background Image and Border

      In this lesson, we will discuss the background image and border. It is important to note that when setting the background image in CSS3, it will repeat by default. You can notice that clearer when you set a width and height of the div you are wo Watch this video
    • 19

      Working With Anchor And Animation

      In this lesson, we will talk about links and animation. We all know links and how to work with them. But an important factor for the test is the order of the pseudo classes. This order is: link -> visited -> hover -> active. Watch this video
    • 20

      Working With First Letter and Do While

      In this lesson, we will discuss how we can manipulate the style of the first letter in each paragraph and how to handle the do-while loop. Changing the style of the first letter is simple. We will create few paragraphs in different articles. Watch this video
    • 21

      Working With Flexbox And Important

      In this lesson, we will learn how to work with –ms-flexbox and the important property. First, we will start with creating few divs within a parent div. We will set the basic properties for the inner divs, then work with the flexbox properties on Watch this video
    • 22

      Working With Events

      In this lesson, we will discuss events. You can handle events using jQuery as well as pure JavaScript. Today, we will use the latter approach. We will create a simple form that contains a name and an email address. Watch this video
    • 23

      Working With Errors

      In this lesson, we will discuss errors and try/catch blocks. We will start with a quick introduction about IIFE (Immediately Invoked Function Expression). Then, we will create outer and inner try/catch blocks. Watch this video
    • 24

      Working With DOM Methods

      In this lesson, we will talk about how to work with pure JavaScript functions that manipulates the DOM. We are not using jQuery. We will create buttons that allow us to create elements on the fly and append them to other elements. Watch this video
    • 26

      Working With Positioning

      In this lesson, we will learn how to work with element positioning. We start with some HTML and manipulate the properties of an aside element. We will see how the fixed, relative, absolute, and static position values impact the display. Watch this video
    • 28

      Working With Forms

      In this lesson, we will learn how to work forms. Specifically, we will see how to serialize the data after the submit takes place. Watch this video
    • 31

      Working With Switch And Spacing

      In this lesson, we will learn about the switch statement and spacing. We will start with switch and see how to create a function that provides us the type of object that we pass as a parameter. Watch this video