CS-105: Fundamentals of JavaScript

About this course

The JavaScript engine and console.log() through scoping, type coercion, arrays and objects to closures, currying and asynchronous code with Promises and async/await, with a real-life analogy, a video, and a scenario-based Compiler Quest for every one of 15 topics across 5 modules.

This is a 6-week short course - enough depth to build real projects and a portfolio piece, without a long commitment. Learn online at your own pace. Practice the concepts with the listed assessments.

What's included

• Self-paced lessons and practice (12 estimated hours).
• Hands-on coding quests you solve inside the EchoLens browser compiler - nothing to install.
• Gems, stages and a leaderboard that keep you moving instead of grade anxiety.
• A verified certificate with a scannable QR code, ready to share on LinkedIn, when you satisfy the course requirements.
• Completely free - no fee, just create an account and start.

What you will learn

Course outline - level by level

15 leveles, each with hands-on quests you clear in the portal.

• Level 1. JS Runtime Engine & console.log() - Real-life analogy: Think of a live theatre prompter whispering each line to the actors in real time, handling backstage cues on the spot and jotting the stage status straight into the stage manager's notebook. JavaScript runs inside an engine - V8 in Chrome and Node.js, SpiderMonkey in Firefox - executing statements one after another on a single-threaded call stack. console.log() streams formatted diagnostic output to the developer console, and passing it several comma-separated arguments prints them on one line separated by spaces.
• Level 2. Variable Scoping (let, const, var) & Hoisting - Real-life analogy: Think of var as a megaphone heard across the whole floor (function-scoped), let as a conversation inside a soundproof meeting room (block-scoped), and const as a permanent engraved metal plaque. Modern JavaScript uses let (reassignable, block-scoped) and const (block-scoped, its binding fixed once assigned). var is hoisted to the top of its function and ignores { } block boundaries, which quietly leaks values across scopes and causes bugs.
• Level 3. Primitive Data Types & Type Conversion - Real-life analogy: Think of an international exchange booth: the machines turn number vouchers into text tickets and back, but hand you an empty "Rejected" slip (NaN) when the input makes no sense. JavaScript has seven primitive types: string, number, bigint, boolean, undefined, symbol and null. typeof reports a value's type, and Number(), String() and Boolean() convert explicitly between them.
• Level 4. Strict Equality (===) vs Loose Equality (==) - Real-life analogy: Think of an airport checkpoint: loose equality (==) waves you through if the boarding pass merely looks close after some auto-adjusting; strict equality (===) demands the passport identity and an exact biometric match. == coerces the two operands to a common type before comparing, so '5' == 5 is true and "0" == 0 is true. === compares type and value with no coercion, so '5' === 5 is false. Default to === everywhere.
• Level 5. Template Literals & String Methods - Real-life analogy: Think of a fill-in-the-blank invitation card where the name, the date and the RSVP link snap automatically into their pre-cut slots. Template literals use backticks and support multi-line text and ${expr} interpolation directly inside the string. Common string methods include includes(), slice(), trim() and replace() / replaceAll().
• Level 6. Iteration (for...of, for...in, while) - Real-life analogy: Think of a bookshelf: for...of walks past every physical book in turn, while for...in reads the little index tags stuck to the shelf frame itself. for...of iterates the values of an iterable (arrays, strings, sets). for...in iterates the enumerable keys of an object. while repeats its body as long as its condition stays truthy.
• Level 7. Modern Array Methods (map, filter, reduce) - Real-life analogy: Think of a car assembly line: map sprays every car the same colour, filter pulls the defective ones off the belt, and reduce adds every remaining car's value into one fleet total. Higher-order array methods build immutable pipelines: map() returns a new array with each element transformed, filter() returns a new array of the elements that pass a test, and reduce() folds the array into a single accumulated value.
• Level 8. Objects, Destructuring & Spread / Rest (...) - Real-life analogy: Think of unpacking a flat-pack furniture crate: you lift the desk top and legs straight out by name (destructuring), and sweep the leftover screws into a spare-parts bag (rest). Destructuring pulls properties or elements into their own variables (const { name, age } = user;). The spread operator ... copies or merges objects and arrays; rest ... in a parameter or pattern collects whatever is left over.
• Level 9. JSON Serialization & Deep Cloning - Real-life analogy: Think of flat-packing a wardrobe into a cardboard box to mail across the country (serialization), then building an identical wardrobe at the other end (deserialization). JSON.stringify() turns an object into a JSON string; JSON.parse() turns it back into an object. Parsing a stringified copy - or structuredClone() - gives a genuine deep copy that shares no references with the original.
• Level 10. Arrow Functions & the 'this' Keyword - Real-life analogy: Think of a regular function as an actor whose identity shifts with whatever stage they stand on, and an arrow function as a reporter who always speaks with the voice of the home office they came from. Arrow functions - const fn = (a, b) => a + b - are concise and, crucially, take this from the scope where they are defined rather than how they are called. A single-expression body has an implicit return with no braces.
• Level 11. Closures & Encapsulation (Private State) - Real-life analogy: Think of a bank teller who keeps the vault combination in their head: customers deposit and withdraw through the window and never touch the dials themselves. A closure lets an inner function keep using variables from its outer function's scope even after that outer function has returned. Returning the inner function (or an object of them) creates truly private state that outside code cannot reach directly.
• Level 12. Higher-Order Functions & Currying - Real-life analogy: Think of a build-your-own sandwich line: one station takes your bread choice, the next your protein, the next your sauce - each takes a single decision and passes the sandwich along. A higher-order function takes a function as an argument or returns one. Currying rewrites a multi-argument function f(a, b, c) as a chain of one-argument functions f(a)(b)(c), which makes partial application and composition natural.
• Level 13. Event Loop, Callbacks & the Call Stack - Real-life analogy: Think of one busy chef (the call stack). When a dish needs 20 minutes in the oven (a Web API), the chef starts it and cooks other orders, only plating the baked dish once the timer rings and the queue hands it back. JavaScript runs on one thread. Asynchronous work is handed to the browser or Node APIs, and its callbacks wait in a task queue; the event loop only pushes a queued callback onto the call stack once the stack is empty - so setTimeout(fn, 0) still runs after all the synchronous code.
• Level 14. Promises (.then, .catch, .finally) - Real-life analogy: Think of the buzzer they hand you at a burger counter. It is a promise: right now Pending, it will Resolve into a hot meal when ready, or Reject if the kitchen runs out of patties. A Promise represents a value that will arrive later. It is Pending, then either Fulfilled or Rejected. .then() handles the resolved value, .catch() handles a rejection, and .finally() runs cleanup either way.
• Level 15. Modern async / await & the Fetch API - Real-life analogy: Think of reading a book of clear step-by-step instructions top to bottom. An assistant is fetching reference notes in the background, but your reading stays linear - no tangle of nested callbacks. async/await is synchronous-looking syntax over Promises: await pauses an async function until a Promise settles, and try...catch handles failures. Promise.all() runs several async operations at once and waits for all of them.

How you submit: Coding quests solved in the built-in EchoLens compiler.

Who it's for

CS-105: Fundamentals of JavaScript suits learners at a beginner to intermediate level who want a practical, project-based route into CS-105. You need only a browser and an internet connection - all coding runs inside the EchoLens compiler, so there is nothing to set up.

Certificate

Pass every required assessment at its stated threshold to earn your verified certificate. Optional practice and watching videos do not determine eligibility. Anyone can scan its QR code to verify it on our site. You can add it to your CV or share it to LinkedIn in one click.