JavaScript

11 June 2025 15:04

🌲 PSA: Beware of End-of-Life Node.js Versions

Matteo Collina notes the Node.js ecosystem is “at a critical juncture”, with v18 and earlier now ‘End-of-Life’. He breaks down what that really means for users of legacy versions, and why you should skip Active LTS v20 and leap straight to v22 for maximum future-proofing. If you have to stay on older versions, though, Matteo shares an option to consider.

Matteo Collina

JavaScript

10 June 2025 08:30

CHALLENGE

const products = [
  { id: 1, name: 'Laptop', price: 1200, category: 'Electronics' },
  { id: 2, name: 'Headphones', price: 100, category: 'Electronics' },
  { id: 3, name: 'Book', price: 15, category: 'Books' },
  { id: 4, name: 'Shirt', price: 25, category: 'Clothing' },
  { id: 5, name: 'Coffee Mug', price: 10, category: 'Kitchen' }
];

const result = products
  .filter(p => p.price > 20)
  .map(p => ({ name: p.name, value: p.price * 0.9 }))
  .reduce((acc, item) => {
    acc.names.push(item.name);
    acc.total += item.value;
    return acc;
  }, { names: [], total: 0 });

console.log(result);

JavaScript

09 June 2025 08:33

CHALLENGE

function createCounter() {
  let count = 0;
  return {
    increment: () => ++count,
    getCount: () => count
  };
}

function compose(...fns) {
  return (x) => fns.reduceRight((acc, fn) => fn(acc), x);
}

const counter = createCounter();
const double = x => x * 2;
const addOne = x => x + 1;

const incrementAndProcess = compose(double, addOne, counter.increment);

counter.increment();
const result = incrementAndProcess();
console.log(result);

JavaScript

07 June 2025 08:30

CHALLENGE

const user = {
  details: {
    name: 'Alex',
    contact: null,
    preferences: {
      theme: 'dark'
    }
  },
  getInfo() {
    return this?.details?.contact?.email || 
           this?.details?.preferences?.theme || 
           this?.details?.name || 
           'Unknown';
  }
};

console.log(user.getInfo());

JavaScript

06 June 2025 08:31

CHALLENGE

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const result = numbers
  .filter(num => num % 2 === 0)
  .map(num => num * 2)
  .reduce((acc, num, index, array) => {
    if (index === array.length - 1) {
      return (acc + num) / array.length;
    }
    return acc + num;
  }, 0);

console.log(result);

JavaScript

05 June 2025 08:31

CHALLENGE

class EventEmitter {
  constructor() {
    this.events = {};
  }
  
  on(event, listener) {
    if (!this.events[event]) {
      this.events[event] = [];
    }
    this.events[event].push(listener);
    return () => this.off(event, listener);
  }
  
  off(event, listener) {
    if (!this.events[event]) return;
    this.events[event] = this.events[event].filter(l => l !== listener);
  }
  
  emit(event, ...args) {
    if (!this.events[event]) return false;
    this.events[event].forEach(listener => listener(...args));
    return true;
  }
}

const emitter = new EventEmitter();
const unsubscribe = emitter.on('message', data => console.log(data));
emitter.emit('message', 'Hello');
emitter.emit('message', 'World');
unsubscribe();
emitter.emit('message', 'Ignored');
console.log(emitter.emit('message', 'Still ignored'));

JavaScript

04 June 2025 08:30

CHALLENGE

function curry(fn) {
  return function curried(...args) {
    if (args.length >= fn.length) {
      return fn.apply(this, args);
    }
    return function(...moreArgs) {
      return curried.apply(this, [...args, ...moreArgs]);
    };
  };
}

const multiply = curry((a, b, c) => a * b * c);
const double = multiply(2);
const result = double(3)(4);

console.log(result);

JavaScript

02 June 2025 15:04

🟠 Svelte Flow 1.0: Create Node-Based UIs and Diagrams in Svelte

From the creators of the similar React Flow comes a customizable Svelte component for building node-based editors and interactive diagrams. Want examples?

webkid GmbH

JavaScript

01 June 2025 15:03

🤩 Wake Up, Remix! Everything's Changing..

Big news from the Remix camp this week. About a year ago, Remix and React Router merged together reflecting their shared goals and code, but now it’s all change again. React Router is now basically what Remix originally intended to be, and so ‘Remix’ is rebooting as a model-first, low-dependency, Web API-centric full-stack framework built on Preact. It’ll no longer be a 'React framework' per se.

Michael Jackson and Ryan Florence

JavaScript

31 May 2025 15:01

😭 Matteo Collina has unveiled php-node, a way to run PHP apps within the same process as Node.js. Run WordPress with a Next.js frontend? Sure.

JavaScript

30 May 2025 08:30

CHALLENGE

function* counter() {
  let i = 1;
  while (true) {
    const reset = yield i++;
    if (reset) {
      i = 1;
    }
  }
}

const gen = counter();
console.log(gen.next().value);
console.log(gen.next().value);
console.log(gen.next(true).value);
console.log(gen.next().value);

JavaScript

28 May 2025 08:33

CHALLENGE

function compose(...funcs) {
  return function(x) {
    return funcs.reduceRight((acc, fn) => fn(acc), x);
  };
}

const add10 = x => x + 10;
const multiply2 = x => x * 2;
const toString = x => `Result: ${x}`;

const composed = compose(toString, multiply2, add10);
console.log(composed(5));

JavaScript

26 May 2025 15:04

📸 😉 What's New in Angular

Two members of the Angular team presented a session at this week’s Google I/O event on the latest updates to the Angular framework in anticipation of the eventual release of Angular 20 next Thursday.

Chasanoff and Thompson (Google)

JavaScript

25 May 2025 15:00

Node.js Next 10 Survey closes one week from today 🐢

JavaScript

24 May 2025 15:44

✌️ A Brief History of JavaScript

JavaScript (originally named LiveScript) turns thirty years old this year and the Deno team has put together a fantastic timeline-based tour of how much things have progressed from its first appearance in Netscape Navigator, through offshoots like JScript, standardization, and the introduction of Node.js, all the way through to the modern day.

The Deno Team

JavaScript

11 June 2025 08:34

CHALLENGE

const person = {
  name: 'Alice',
  greet() {
    return `Hello, I'm ${this.name}`;
  },
  farewell: () => `Goodbye from ${this.name}`
};

const greetFn = person.greet;
const farewellFn = person.farewell;

console.log(person.greet());
console.log(greetFn());
console.log(farewellFn());

JavaScript

10 June 2025 00:25

TypeScript 5.5 introduces support for new ECMAScript methods on the Set object: union, intersection, difference, and symmetricDifference. These methods allow for more intuitive and readable operations on sets.

JavaScript

07 June 2025 19:42

🌲 Monorepo: From Hate to Love

A monorepo is like a BMW: it requires constant maintenance and attention. You can’t just set it up once and expect it to work smoothly for the next five years.

nairihar

JavaScript

06 June 2025 20:34

🍊 Google Gen AI SDK for TypeScript and JavaScript v1

Why let Python developers have all the fun? Now you can harness the full power of Google’s Gemini API (and Vertex platform) from Node too. v1.0 landed a few days ago, but today we also get v1.1 which includes CommonJS support. The Gemini docs and examples now use it too (if you select JavaScript).

Google

JavaScript

05 June 2025 15:04

🫡 qnm: A CLI Tool to Look Into node_modules

If you’ve ever been overwhelmed by what’s in node_modules, this tool lets you dig around with some guidance as to what is what. You can use fuzzy search to find specific things as well as see which modules are using the most space (you can try it right now with `npx qnm doctor`).

Ran Yitzhaki

JavaScript

04 June 2025 15:05

😭 php-node: A New Way to Bring PHP and Node Together

I bet some readers have strong feelings about the idea of mixing PHP and Node.js, but this is a neat project. php-node is a native module for Node that enables the running of PHP apps within the Node environment. Why? For migrating legacy apps, building hybrid PHP/JS apps, or Node apps that simply need to call out to PHP for some reason (WordPress, maybe, as we see in this post).

Matteo Collina et al.

JavaScript

03 June 2025 08:30

CHALLENGE

const target = { a: 1, b: 2 };
const handler = {
  get(obj, prop) {
    return prop in obj ? obj[prop] * 2 : 'not found';
  },
  set(obj, prop, value) {
    if (typeof value !== 'number') {
      return false;
    }
    obj[prop] = value + 10;
    return true;
  }
};

const proxy = new Proxy(target, handler);
proxy.c = '5';
proxy.d = 5;

console.log(JSON.stringify({
  a: proxy.a,
  b: proxy.b,
  c: proxy.c,
  d: target.d,
  hasC: Reflect.has(target, 'c')
}));

JavaScript

02 June 2025 08:30

CHALLENGE

const team = {
  lead: { name: 'Alice', projects: ['Alpha', 'Beta'] },
  dev: { name: 'Bob', projects: ['Gamma'] },
  tester: { name: 'Charlie', projects: [] }
};

const { 
  lead: { projects: [leadProject] },
  dev: { projects: [devProject = 'Delta'] },
  tester: { projects: [testerProject = 'Epsilon'] }
} = team;

console.log(`${leadProject}-${devProject}-${testerProject}`);

JavaScript

01 June 2025 08:30

CHALLENGE

class ShoppingCart {
  constructor() {
    if (ShoppingCart.instance) {
      return ShoppingCart.instance;
    }
    
    this.items = [];
    ShoppingCart.instance = this;
  }
  
  addItem(item) {
    this.items.push(item);
  }
  
  getItems() {
    return [...this.items];
  }
}

const cart1 = new ShoppingCart();
const cart2 = new ShoppingCart();

cart1.addItem('Book');
cart2.addItem('Laptop');

console.log(cart1.getItems());

JavaScript

31 May 2025 08:30

CHALLENGE

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

const userScores = new WeakMap();

// Set scores for users
userScores.set(users[0], 95);
userScores.set(users[1], 80);

// Remove reference to Bob
users[1] = null;

let sum = 0;
for (const user of users) {
  if (user && userScores.has(user)) {
    sum += userScores.get(user);
  }
}

console.log(sum);

JavaScript

29 May 2025 08:33

CHALLENGE

try {
  try {
    // Creating a custom error type
    class CustomError extends Error {
      constructor(message) {
        super(message);
        this.name = "CustomError";
      }
    }
    
    const fn = () => {
      throw new CustomError("Something went wrong");
    };
    
    try {
      fn();
    } catch (e) {
      throw new TypeError("Type error occurred");
    }
  } catch (e) {
    console.log(e instanceof Error, e.name, e instanceof TypeError);
  }
} catch (e) {
  console.log("Outer catch", e.message);
}

JavaScript

27 May 2025 08:31

CHALLENGE

function mystery() {
  try {
    throw new Error('Oops');
    return 'A';
  } catch (err) {
    return 'B';
  } finally {
    return 'C';
  }
}

function wrapper() {
  try {
    return mystery();
  } finally {
    console.log('D');
  }
}

console.log(wrapper());

JavaScript

26 May 2025 08:31

CHALLENGE

const user = { id: 1, name: 'Alice' };
const userData = new WeakMap();

userData.set(user, { lastLogin: '2023-01-01' });
const clone = { ...user };

const originalData = userData.get(user);
const cloneData = userData.get(clone);

console.log(originalData, cloneData);

JavaScript

25 May 2025 08:30

CHALLENGE

function analyze(...items) {
  const [first, ...rest] = items;
  const { length } = [...rest, 'bonus'];
  const result = {
    ...first,
    count: length,
  };
  
  console.log(result);
}

analyze({ id: 42, name: 'Item' }, 'a', 'b');

JavaScript

24 May 2025 08:32

CHALLENGE

const target = { a: 1, b: 2 };
const handler = {
  get(obj, prop) {
    return prop in obj ? obj[prop] * 2 : 'Not found';
  }
};

const proxy = new Proxy(target, handler);

// Add property to original object
target.c = 3;

// Modify existing property directly on proxy
proxy.a = 10;

// Use Reflect.get instead of direct property access
const result = Reflect.get(proxy, 'd', { custom: true });

console.log(proxy.a, proxy.b, proxy.c, result);