JavaScript
31.9K subscribers
1.01K photos
9 videos
33 files
693 links
A resourceful newsletter featuring the latest and most important news, articles, books and updates in the world of #javascript πŸš€ Don't miss our Quizzes!

Let's chat: @nairihar
Download Telegram
🀨 Anime.js 4.0: A JS Animation Library for the Web

If you’re tired of Web animations, maybe Anime.js will refresh your appetite. This is a major upgrade to a mature library for animating CSS properties, SVGs, the DOM, and JS objects. It’s smooth, well-built, and now complete with fresh documentation.

Julian Garner
Please open Telegram to view this post
VIEW IN TELEGRAM
❀6πŸ‘5πŸ”₯4
CHALLENGE

const p1 = Promise.resolve(1);
const p2 = new Promise(resolve => resolve(2));
const p3 = new Promise(resolve => setTimeout(() => resolve(3), 0));
const p4 = Promise.reject(4).catch(err => err);

Promise.all([p1, p2, p3, p4])
.then(values => {
const result = values.reduce((acc, val) => {
return acc + val;
}, 0);
console.log(result);
})
.catch(err => console.log('Error:', err));
❀5πŸ‘1
❀7πŸ€”5πŸ‘2
CHALLENGE

const obj = {
[Symbol('a')]: 'hidden',
[Symbol.for('b')]: 'registered',
c: 'normal'
};

const symbols = Object.getOwnPropertySymbols(obj);
const keys = Object.keys(obj);
const allProps = Reflect.ownKeys(obj);

console.log(symbols.length, keys.length, allProps.length);
πŸ‘3❀2
What is the output?
Anonymous Quiz
26%
2 3 5
42%
2 1 3
21%
3 1 3
11%
0 1 1
πŸ‘8❀5πŸ”₯2🀣2πŸ€”1
🀟 Node.js Testing Best Practices

A detailed guide to modern testing in Node from a group of developers who know all about it. It’s on GitHub but is essentially written like a free book covering over 50 battle-tested tips covering areas as diverse as the β€˜Testing Diamond’, testing microservices, checking contracts, verifying OpenAPI correctness, and simulating flaky network conditions.

Goldberg, Salomon, and Gluskin
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘9πŸ”₯3❀2
CHALLENGE

function createCounter() {
let count = 0;

return function() {
count++;
return count;
};
}

const counter1 = createCounter();
const counter2 = createCounter();

counter1();
counter1();
counter2();

const result = counter1() + counter2();
console.log(result);
πŸ‘8πŸ€”8❀4
What is the output?
Anonymous Quiz
24%
3 + 2
38%
5
29%
3
8%
4
πŸ€”10
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘6πŸ€”4❀2
CHALLENGE

// What will be logged when this code runs?
const counter = (() => {
let count = 0;

return {
increment() {
count += 1;
return this;
},
reset() {
count = 0;
return this;
},
get value() {
return count;
}
};
})();

const { increment, value } = counter;

increment();
counter.increment();

console.log(value);
🀣11πŸ‘7❀6πŸ€”3
What is the output?
Anonymous Quiz
25%
undefined
36%
2
23%
0
16%
1
πŸ‘8πŸ€”8🀣2
CHALLENGE

function processConfig(config) {
const defaultPort = 8080;
const defaultTimeout = 5000;

const port = config?.port ?? defaultPort;
const timeout = config?.timeout ?? defaultTimeout;
const debug = config?.debug ?? false;

return {
summary: `Port: ${port}, Timeout: ${timeout}, Debug: ${debug ? 'enabled' : 'disabled'}`,
isUsingDefaults: port === defaultPort && timeout === defaultTimeout
};
}

const result = processConfig({ port: 0, timeout: null });
console.log(result.summary);
πŸ€”4πŸ‘3❀2πŸ”₯1
πŸ€– Firebase Studio: Google's New Agentic AI-Powered Development Environment

Buzzing from the success of Gemini 2.5 Pro for dev tasks, Google’s Firebase team gets in on the AI development action with a Cursor/v0/Lovable-a-like of its own for building apps in the browser.

Google
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘8πŸ”₯4❀1
CHALLENGE

function processUserData(data) {
const settings = {
theme: data.preferences?.theme ?? 'light',
notifications: data.preferences?.notifications ?? true,
fontSize: data.preferences?.fontSize ?? 16
};

let status = data.status ?? 'active';
let reputation = data.reputation ?? 0;

console.log(reputation || 'No reputation yet');
return settings;
}

processUserData({ status: '', reputation: 0 });
❀3πŸ‘3πŸ€”1
What is the output?
Anonymous Quiz
28%
0
28%
undefined
40%
No reputation yet
5%
null
❀5πŸ‘4πŸ€”4πŸ”₯1
🀩 Comparing Tauri and Electron for Building Desktop Apps

Electron is a natural choice for building JS and HTML-powered cross-platform desktop apps but numerous alternatives have appeared like Neutralinojs and the Rust-based Tauri. This post does a good job of quickly showing how Tauri differs and why you might choose it.

Costa Alexoglou
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘4πŸ”₯2❀1
CHALLENGE

type User = {
id: number;
name: string;
email?: string;
};

function processUser<T extends User>(user: T): T & { processed: boolean } {
return { ...user, processed: true };
}

const partialUser = { id: 1, name: 'Alice' };
const result = processUser(partialUser);

console.log(typeof result.email);
πŸ‘8πŸ”₯3❀1
❀4πŸ‘2πŸ”₯2🀩1
πŸ˜† Vibe coding Tax has become a real thing!

Cursor's new "pay as you go" strategy with better models drives 20-30% more code generation than you would typically do. For all of the "vibe coders" out there, this is becoming an exponential "coding tax" for products because more code equals more token consumption, which generates more code...

Tigran Bayburtsyan
Please open Telegram to view this post
VIEW IN TELEGRAM
🀣17πŸ‘4❀3πŸ€”1