.jpg){kind=logo}
WU-CSC340.AE1
CSC340: Javascript
Intermediate Self-paced · 1 year access
76 Hands-On LiveLabs
Practice real IT tasks in guided environments.
- Real environments
- Auto-graded
- No installation
01 / Lessons & labs
See exactly what you will learn and practice
Lessons
43 Interactive Lessons · 207 topics01 Introduction 6 topics +
- Why This Course?
- Conventions Used in This Course
- Foolish Assumptions
- Icons Used in This course
- Beyond the Course
- Where to Go from Here
02 Jumping into JavaScript 7 topics · 1 LiveLab +
- JavaScript, the Basics
- Reading and Copying JavaScript Code
- Starting Your Development Environment
- Writing Your First JavaScript Program
- Running Code in the Console
- Rerunning Commands in the Console
- Running Code in a Browser Window
1 LiveLab in this lesson — see the labs panel →
03 Filling Your JavaScript Toolbox 4 topics +
- Installing Node.js
- Configuring Visual Studio Code
- Documenting Your Code
- Coding Responsibly with Git
04 Using Data 6 topics · 2 LiveLab +
- Making Variables with let
- Making Constants with const
- Taking a Look at the Data Types
- Wrangling the Object: The Complex Data Type
- Examining the Array — a Special Kind of Object
- Getting a Handle on Scope
2 LiveLab in this lesson — see the labs panel →
05 Working with Operators and Expressions 3 topics · 3 LiveLab +
- Building Expressions
- Operators: The Lineup
- Other Operators
3 LiveLab in this lesson — see the labs panel →
06 Controlling Flow 2 topics · 6 LiveLab +
- Choosing a Path
- Making Loops
6 LiveLab in this lesson — see the labs panel →
07 Using Arrays 9 topics · 2 LiveLab +
- Introducing Arrays
- Creating Arrays
- Accessing Array Elements
- Modifying Arrays
- Deleting Array Elements
- Programming with Array Methods
- Looping with Array Methods
- Destructuring Arrays
- Spreading Arrays
2 LiveLab in this lesson — see the labs panel →
08 Making and Using Objects 6 topics · 1 LiveLab +
- Objects: The Basics
- Creating Objects
- Modifying Objects
- Comparing and Copying Objects
- Understanding Prototypes
- Deleting Object Properties
1 LiveLab in this lesson — see the labs panel →
09 Writing and Running Functions 5 topics · 3 LiveLab +
- Functions: An Introduction
- Writing Functions
- Writing Methods
- Understanding Context and this
- Chaining Functions
3 LiveLab in this lesson — see the labs panel →
10 Getting Oriented with Classes 9 topics · 2 LiveLab +
- Encapsulation
- Abstraction
- Inheritance
- Polymorphism
- Base Classes
- Derived Classes
- Constructors
- Properties and Methods
- Practicing and Becoming comfortable with Classes
2 LiveLab in this lesson — see the labs panel →
11 Making Things Happen with Events 3 topics · 3 LiveLab +
- Understanding the JavaScript Runtime Model
- The Event Loop
- Listening for Events
3 LiveLab in this lesson — see the labs panel →
12 Writing Asynchronous JavaScript 3 topics · 5 LiveLab +
- Understanding Asynchronous JavaScript
- Making Promises
- Using AJAX
5 LiveLab in this lesson — see the labs panel →
13 Using JavaScript Modules 7 topics +
- Defining Modules
- Exporting Modules
- Importing Modules
- Renaming Exports and Imports
- Importing a Module Object
- Loading Dynamic Modules
- Importing Modules into HTML
14 What a Web Browser Does 4 topics +
- Interfacing with a Browser
- Introducing the Browser Engine
- The Rendering Engine
- Networking
15 Programming the Browser 5 topics · 4 LiveLab +
- Understanding Web APIs and Interfaces
- Getting Around the Navigator
- Stealing a Glimpse Through the Window
- Introducing the HTML DOM
- Knowing Your History
4 LiveLab in this lesson — see the labs panel →
16 Getting Started with React 3 topics +
- Understanding ReactJS
- Initializing a Project with Vite
- Introducing ReactDOM and the Virtual DOM
17 Writing JSX 5 topics · 4 LiveLab +
- Learning the Fundamentals of JSX
- Using JavaScript Expressions in JSX
- Conditionally Rendering JSX
- Making a List
- Styling React Apps and Components
4 LiveLab in this lesson — see the labs panel →
18 Building React Components 7 topics · 4 LiveLab +
- Thinking in Components
- Recognizing the Two Types of Data
- Function Components
- Class Components
- The Component Lifecycle
- Using the Lifecycle in Function Components
- Composing Components
4 LiveLab in this lesson — see the labs panel →
19 Using Data and Events in React 2 topics · 2 LiveLab +
- Event Handling in React
- Making Forms with React
2 LiveLab in this lesson — see the labs panel →
20 Getting an Overview of Vue 5 topics · 2 LiveLab +
- Comparing Vue to React
- Scaffolding Your First Vue.js Application
- Mounting a Root Component
- Exploring Vue's Two Styles
- Installing Vue DevTools
2 LiveLab in this lesson — see the labs panel →
21 Introducing Vue Components 4 topics · 1 LiveLab +
- Introducing the Single-File Component
- Naming Components
- Following the Component Lifecycle
- Handling Errors in Components
1 LiveLab in this lesson — see the labs panel →
22 Making Vue Templates 7 topics · 1 LiveLab +
- Writing HTML Templates
- Using JavaScript in Templates
- Introducing Directives
- Conditional Rendering
- Rendering Lists
- Composing with Slots
- Adding Style to Components
1 LiveLab in this lesson — see the labs panel →
23 Using Data and Reactivity 6 topics · 1 LiveLab +
- Passing and Using Props
- Binding Data to Templates
- Initializing and Changing Reactive Data
- Introducing ref()
- Computing Properties
- Reacting to State Changes with Watch()
1 LiveLab in this lesson — see the labs panel →
24 Responding to Events 3 topics · 1 LiveLab +
- Setting Listeners with v-on
- Using Event Modifiers
- Binding Forms to Events and Data
1 LiveLab in this lesson — see the labs panel →
25 Getting Started with Svelte 5 topics · 1 LiveLab +
- What Makes Svelte Different?
- Building Your Scaffolding
- Getting the Svelte for VS Code Extension
- Exploring a Svelte App
- Playing with Svelte
1 LiveLab in this lesson — see the labs panel →
26 Building with Components 3 topics · 3 LiveLab +
- Writing Lean Components
- Identifying What's in a Component
- Adding Style to a Component
3 LiveLab in this lesson — see the labs panel →
27 Designing Templates 6 topics · 2 LiveLab +
- Elements Are the Building Blocks
- Documenting Svelte with Comments
- Choosing a Path
- Creating Loops
- Writing Text Expressions
- Composing with Slots
2 LiveLab in this lesson — see the labs panel →
28 Using Directives 3 topics · 1 LiveLab +
- Listening for Events with on:
- Creating Two-Way Bindings with :bind
- Using Transition Animations
1 LiveLab in this lesson — see the labs panel →
29 Using the Component Lifecycle 2 topics · 1 LiveLab +
- The Svelte Lifecycle
- Fetching Data in Svelte
1 LiveLab in this lesson — see the labs panel →
30 Advanced Svelte Reactivity 2 topics · 1 LiveLab +
- Constructing and Stocking the Store
- Getting and Setting Context
1 LiveLab in this lesson — see the labs panel →
31 Building from Scratch 5 topics · 1 LiveLab +
- Why You Need a Build Tool
- Managing Dependencies with npm
- Writing Your First Files
- Writing a dev Script
- Making Modules
1 LiveLab in this lesson — see the labs panel →
32 Optimizing and Bundling 2 topics · 1 LiveLab +
- Automating Your Build Script
- Converting to React
1 LiveLab in this lesson — see the labs panel →
33 Testing Your JavaScript 3 topics · 1 LiveLab +
- Using a Linter
- Debugging in Chrome
- Unit Testing
1 LiveLab in this lesson — see the labs panel →
34 Node.js Fundamentals 9 topics · 4 LiveLab +
- Learning What Makes Node.js Tick
- Learning the Parts of Node.js
- Introducing the Node.js Core Modules
- Recognizing What Node.js Is Good For
- Working with Node.js
- Using REPL
- Making and Using Node.js Modules
- Getting Data to Node Modules
- Node's Callback Pattern
4 LiveLab in this lesson — see the labs panel →
35 Streaming 6 topics · 3 LiveLab +
- Jumping into Streams
- Creating Readable Streams
- Creating Writable Streams
- Producing Duplex Streams
- Transforming Streams
- Chaining Streams
3 LiveLab in this lesson — see the labs panel →
36 Working with Buffers 5 topics · 2 LiveLab +
- Knowing Your Buffer Basics
- Decoding Buffers
- Creating Buffers
- Using Other Buffer Methods
- Iterating over Buffers
2 LiveLab in this lesson — see the labs panel →
37 Accessing the File System 5 topics · 2 LiveLab +
- Importing the fs module
- Reading Files
- Writing Files
- Using Paths
- Getting File and Directory Information
2 LiveLab in this lesson — see the labs panel →
38 Networking with Node 2 topics · 1 LiveLab +
- A Note about Security
- Making a Web Server
1 LiveLab in this lesson — see the labs panel →
39 Using Events 4 topics · 2 LiveLab +
- Introducing EventEmitter
- Understanding and Using maxListeners
- Removing Listeners
- Emitting Once
2 LiveLab in this lesson — see the labs panel →
40 Error Handling and Debugging 5 topics · 2 LiveLab +
- Knowing the Types of Errors
- Understanding Node.js's Error Object
- Exceptions versus Errors
- Handling Exceptions
- Debugging Node.js Programs
2 LiveLab in this lesson — see the labs panel →
41 Accessing Databases 4 topics · 1 LiveLab +
- Getting Started with MongoDB
- Starting MongoDB
- Using Mongosh
- Using MongoDB from Node.js
1 LiveLab in this lesson — see the labs panel →
42 Riding on the Express Train 6 topics · 2 LiveLab +
- Installing Express
- Server-Side Routing with Express
- Using Express Middleware
- Analyzing a Complete Express Server
- Serving a View
- Using the Express Application Generator
2 LiveLab in this lesson — see the labs panel →
43 Registration and Authentication 9 topics · 1 LiveLab +
- Making and Configuring the Directory
- Adding the App and Server Modules
- Making Some Basic Routes
- Testing Your Routes
- Making a Schema with Mongoose
- Implementing User Registration
- Handling Authentication
- Generating and Using Tokens
- Finishing the Login Route
1 LiveLab in this lesson — see the labs panel →
Hands-On Labs Our edge
76 LiveLabs- Creating an HTML Page Using JavaScript
- Using Primitive Data Types
- Using Special Characters
- Using Comparison Operators
- Using Arithmetic Operators
- Using Logical Operators
- Using Conditional Statements
- Using the Ternary Operator
- Using the switch Statement
- Using the break Statement
- Using Loops
- Using the continue Statement
- Generating an HTML List from an Array
- Creating a Shallow Copy of an Array
- Printing the Properties of an Object
- Using Pass By Reference
- Creating a Movie Picker App
- Creating a Bookstore App
- Overriding a Method
- Accessing the static Member of a Class
- Setting an Event Listener
- Using Event Bubbling
- Firing a Built-in Event
- Creating an Asynchronous User Interface
- Creating a Synchronous User Interface
- Creating an Asynchronous Function
- Creating a Promise Chain
- Creating a Promise
- Using the Navigator userAgent Property
- Using the getElementById() Method
- Using the querySelectorAll() Method
- Creating and Appending Element Nodes
- Creating a React Component
- Performing Conditional Rendering Using the Logical && Operator
- Performing Conditional Rendering Using the Conditional Operator
- Performing Conditional Rendering Using the Element Variable
- Using State
- Using props in a Class Component
- Using Props in a Function Component
- Creating a Class Component
- Handling an Event in React
- Creating a Form in React
- Creating a Vue Component Using the Composition API
- Creating a Vue Component Using the Options API
- Using the setup Attribute
- Creating a Custom Directive
- Using Props in Vue
- Handling Events in Vue
- Creating a Svelte Component
- Creating a Svelte Counter Component
- Creating a Prop in Svelte
- Using Reactive Statements in Svelte
- Performing Conditional Rendering in Svelte
- Creating a Loop in Svelte
- Creating Transition in Svelte
- Using the tick() Method
- Creating a Store in Svelte
- Using the os Module
- Creating a Web Server in Node.js
- Creating ES Modules
- Creating CommonJS Modules
- Working with a Stream in the Paused Mode
- Working with a Stream in the Flowing Mode
- Creating a Streaming Counter
- Creating a Buffer
- Iterating over a Buffer
- Reading Data from a File
- Writing Data to a File
- Creating a Web Server that Returns Information about Each Server Request
- Creating an Instance of EventEmitter
- Finding the Default Number of Listeners for an Emitter
- Creating an Error Object and Displaying its Properties
- Handling an Exception
- Creating a Collection in MongoDB
- Creating an Express Application
- Handling Route Parameters in Express
Labs run in your browser — nothing to install.
02 / FAQs
Questions before you start
Keep going
You might also like
Prepare for CSC340: Javascript
One-time payment. Full access for 1 year. Start with a free trial if you want to look around first.
- 1 year of full access
- 76 LiveLab included
- Certificate of completion
No credit card required