Frontend Development

HTML and CSS

|  JavaScript

|   JavaScript Projects

Fundamentals of JavaScript

Folders and Files
Adding JavaScript to web pages

Efficiently adding JavaScript code to a web page, and working with the JavaScript Console in your browser’s DevTools.

Take the quiz

View Tutorial  ➜
Web Hosting on GitHub
Variables and literals

Working with string, numeric and boolean variables, assigning values to variables, and using template literals.

Take the quiz

View Tutorial  ➜
Working with Props
Variable operations

Performing basic operations on variables in JavaScript, including string manipulation, arithmetic, and more.

Take the quiz

View Tutorial  ➜

Functions, conditionals, and weirdness

Working with CSS
Function declarations

Creating a function declaration, passing arguments to its parameters, and returning values.

Take the quiz

View Tutorial  ➜
Folders and Files
Making decisions with if

Create conditional decision-making structures in JavaScript with if, else if and else code blocks.

Take the quiz

View Tutorial  ➜
Folders and Files
Testing for weird values

Understanding type coercion, working with undefined, null and NaN, and truthy and falsy values.

Take the quiz

View Tutorial  ➜

Working with the DOM

Responsive Design
Generating HTML

Using JavaScript to create new HTML elements, add content and attributes to them, and append them to a web page.

Take the quiz

View Tutorial  ➜
Responsive Design
Modifying HTML

Using JavaScript to select existing HTML elements and modify their content, styles, and CSS classes.

Take the quiz

View Tutorial  ➜
Responsive Design
Interacting with the DOM

Handling user events with buttons, reading data from form inputs, and validating user data.

Take the quiz

View Tutorial  ➜

Structured datasets - objects and arrays

Responsive Design
Introduction to objects

Understanding objects, creating and accessing object properties, and working with object methods.

Take the quiz

View Tutorial  ➜
Responsive Design
Introduction to arrays

Creating and populating arrays, counting array elements, and destructuring elements to variables.

Take the quiz

View Tutorial  ➜
Responsive Design
Arrays of objects

Working with arrays of objects, and outputting structured data in the browser console.

Take the quiz

View Tutorial  ➜

Callbacks with Anonymous and Arrow Functions

Responsive Design
Anonymous functions

Creating a function whose output is stored in a variable, passing arguments and returning values, and invoking it immediately.

Take the quiz

View Tutorial  ➜
Custom Properties and Text
Arrow functions

Creating a single-statement arrow function, passing values, working with implicit and explicit returns, and invoking it immediately.

Take the quiz

View Tutorial  ➜
Custom Properties and Text
Callback functions

Passing functions as parameters to another function, in named, anonymous and arrow function formats.

Take the quiz

View Tutorial  ➜
Custom Properties and Text
Introduction to events

Understanding JavaScript events, event listeners, event delegation, and event bubbling.

Take the quiz

View Tutorial  ➜

Asychronous JavaScript

Installing and customising Visual Studio Code for web designers
Introduction to the Fetch API

Using the Promise and Response objects of the Fetch API and get plain-text and JSON formatted data from web servers.

View Tutorial
Installing and customising Visual Studio Code for web designers
Installing Node.js

Installing Node.js and the Node Package Manager (npm) on your local machine.

View Tutorial
Installing and customising Visual Studio Code for web designers
Introduction to Express

Building a basic Express app runnng on a Node.js server that can serve a response to a GET request from a web browser.

View Tutorial