Introduction to Web Programming with JavaScript, HTML & CSS

Enquire Now
X Close


This is a beginners course in web application development. No specific web experience is required but an understanding of general programming concepts is expected.

Course Overview

Day 1- Web application development primer:

This module will introduce web application development and will introduce the tools that will be used during the course. Each of the three technologies (HTML5, CSS3 and Javascript) will be introduced and some simple websites / web applications will be created.

By the end of the day each participant will be confident in their ability to create a web application, deploy it to a web server and test and debug it.

Day 2 - Technology Deep Dive:

More detail on the technologies we are using. This day is split into 3 distinct modules where we do a deeper dive into each of the 3 technologies. By the end of this day the participants will be confident in their knowledge of HTML, CSS and Javascript.

HTML5 Deep Dive

History of HTML

HTML5 tags

Semantic markup

Coding conventions


When to use tables


CSS Deep Dive

Using CSS for styling

CSS Selectors

CSS properties

CSS resets

CSS layouts

Cross browser concerns

Which CSS features can I use

Media queries

Fonts, text styling

Javascript Deep Dive

Javascript syntax

Variables, types, numbers, strings, dates

Functions, function parameters, return values

Programming constructs - loops, conditionals

Object oriented Javascript

Anonymous functions

Callback functions

Debugging techniques

Day 3 - Javascript in action:

A lot more detail on how to really use Javascript in a web application. The use of Javascript frameworks. Communicating with the server using AJAX. Using jQuery to make AJAX calls. Making advanced ui interactions like an in-placed edit. Creating a simple grid which allows in-place editing and has a dialog.

Javascript Frameworks

Introducing JQuery



In place editing

JQuery UI

Creating a web application that has a grid and a dialog

Day 4 - CSS in action:

CSS is really important for web application development so this module is a fairly advanced look at CSS and how it is used in the web applications of today. We will look at using CSS for layouts and explore traditional and modern layout methods. We will talk about mobile first as a design paradigm and do real world examples with responsive and reactive designs.

Some advanced CSS concepts

Using CSS for layout

Traditional CSS layout using floating divs

CSS layout using flexbox

Responsive Design

Reactive Design

Day 5 - Real world Javascript and best practices:

How Javascript libraries, frameworks and controls are used in real-world applications. There are many Javascript libraries and this module is designed to give participants a good view of what is available. The majority of these are free and open source.


jQuery plugins



The frameworks / libraries used can be tailored to suit individual technology stacks.

Best practices / coding standards

What are key issues that you need to be aware of when developing web applications. How usable will your application be to general users? How will it behave for users with assistive technologies? What can you do to facilitate the translation of your application into other languages?




HTML coding standard suggestions

CSS coding standard suggestions

Javascript coding standard suggestions

You might also be interested in:

Start Date
Price PP
No items found.