Languages / Beginner → intermediate

JavaScript for modern applications

JavaScript fundamentals, DOM events, modules, async/await, fetch, validation, and browser security boundaries.

javascriptdomasyncfetchbrowser

01Browser mental model

JavaScript runs event-driven code in the browser. The DOM is the document interface, events represent user/browser actions, and promises represent work that finishes later. Avoid blocking the main thread with heavy computation.

javascriptFetch with explicit error handling

async function loadProjects() {
  const response = await fetch('/api/projects', {
    headers: { Accept: 'application/json' }
  });
  if (!response.ok) throw new Error(`HTTP ${response.status}`);

  const data = await response.json();
  return data.projects;
}

02Safe DOM updates

javascriptPrefer textContent for untrusted text

const status = document.querySelector('#status');
status.textContent = userProvidedText; // text, not HTML

03Maintainable JavaScript

Keep modules small and purpose-specific.
Use const by default and let only when reassignment is needed.
Handle rejected promises.
Use AbortController for cancellable network requests when appropriate.
Keep security headers such as CSP enforced by the server.