A complete JavaScript learning hub.

This page is designed for your students: every topic gives why it matters, clear explanation, multiple examples, common mistakes, a mini-checklist, and practice prompts. Then they practice instantly in your embedded editor.

Basics

Functions

Closures

Promises

Async/Await

fetch()

DOM & Events

Window APIs

Storage

Modules

Classes

Errors

Recommended learning flow

Basics → Control → Loops → Functions

Arrays/Objects → DOM → Events

Promises → async/await → fetch

Window APIs → Storage → Modules/Classes

Embedded editor

https://www.learnwithchampak.live/2026/01/programmers-picnic-javascript-editor.html

Tip: If iframe is blocked (security headers), students should use Editor in New Tab.

=======

Learn JavaScript by doing — with depth.

Roadmap → Notes → Prompts → Practice in the embedded editor.

Basics

Functions

Promises

Async/Await

fetch & APIs

DOM

Events

Window APIs

Storage

Classes

Modules

Errors

Dates & Intl

Canvas (intro)

Workers (intro)

How to use

Pick a topic from the left → read Notes & Prompts.
Scroll down to the embedded editor and try the prompts.
Open the editor in a new tab for full space.

Embedded editor

https://www.learnwithchampak.live/2026/01/programmers-picnic-javascript-editor.html

Pick a topic from the left

Notes + practice prompts will appear here.

Quick Notes

Select a topic to load notes.

Practice Prompts

Select a topic to load prompts.

>>>>>>> 968e403a11ccd6b7436d35cc2696f3407d5fafae

<<<<<<< HEAD

Pick a topic from the left

Deep notes + examples + prompts appear here.

Welcome

Start here

Choose a topic from the left. Each topic includes: Importance, Explanation, Examples, Common Mistakes, Checklist and Practice Prompts. Then scroll down and try it in the embedded editor.

Embedded JavaScript Editor

Students: keep this page open on the left, editor on the right (split screen) or open editor in a new tab.

=======

Embedded JavaScript Editor

If the iframe is blocked by security headers, use “Editor in New Tab”.