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
Please open Telegram to view this post
VIEW IN TELEGRAM
π2π₯2β€1
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')
}));
π€6β€1π₯1
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);
π₯3
π5π₯4β€1
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.
Please open Telegram to view this post
VIEW IN TELEGRAM
π6π€4π₯3β€2
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'));
β€5π5π€4π€©2π₯1
What is the output?
Anonymous Quiz
33%
Hello World false
31%
Hello World true
21%
Hello World Ignored false
15%
Hello World Ignored true
π€8β€2π₯1
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
Please open Telegram to view this post
VIEW IN TELEGRAM
β€4π2π₯1π€©1
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);
β€3
π€£13β€1π€1
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).
Please open Telegram to view this post
VIEW IN TELEGRAM
β€12π7π₯2
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());
π9β€3
π€£10π€5π3β€2
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
Please open Telegram to view this post
VIEW IN TELEGRAM
β€10π€£3
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);
π9π₯1
π€£9π₯6β€5π2π€1
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.
π10β€4π₯4π€£1
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);
β€9π2π₯1
What is the output?
Anonymous Quiz
20%
{ names: ['Laptop', 'Headphones', 'Book', 'Shirt'], total: 1214 }
49%
{ names: ['Laptop', 'Headphones', 'Shirt'], total: 1192.5 }
16%
{ total: 1192.5, names: ['Laptop', 'Headphones', 'Shirt'] }
16%
{names: ['Laptop', 'Headphones', 'Shirt'], total: 1192.5}
π₯9π€6π5β€3π€£1