JavaScript
31.4K subscribers
1.2K photos
10 videos
33 files
871 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
πŸ€– Eve: A Next.js-Style Framework for Building Agents

A new framework from Vercel that provides Next.js-esque structure for building AI-powered agents using TypeScript and Markdown. It's quite Vercel-flavored by default, but I found you can run it entirely independently of Vercel with a few settings tweaks and your own keys. Project homepage.

Vercel
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘7❀6πŸ”₯3
CHALLENGE

function makeCounter(start = 0, step = 1) {
let count = start;
const history = [];

return {
increment() {
count += step;
history.push(count);
return this;
},
decrement() {
count -= step;
history.push(count);
return this;
},
getHistory: () => history,
getCount: () => count,
};
}

const counter = makeCounter(10, 3);
counter.increment().increment().decrement();

console.log(counter.getCount());
console.log(counter.getHistory());
❀5πŸ‘3πŸ”₯2
πŸ’» Desktop Apps With deno desktop

Deno 2.9 (or the 'canary' build now) can turn JavaScript projects into self-contained apps on macOS, Windows, and Linux. Unlike Electron, you can opt to use the default OS WebView or a bundled Chromium backend, plus you get cross-compilation and automatic support for apps built on frameworks like Next.js and SvelteKit.

The Deno Project
Please open Telegram to view this post
VIEW IN TELEGRAM
❀7πŸ‘6πŸ”₯2
CHALLENGE

const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

async function processQueue(items) {
const results = [];

await items.reduce(async (prevPromise, item) => {
await prevPromise;
await delay(0);
results.push(item * 2);
}, Promise.resolve());

return results;
}

processQueue([1, 2, 3, 4])
.then((data) => console.log("Result:", data))
.catch((err) => console.log("Error:", err.message));

Promise.resolve()
.then(() => console.log("Microtask A"))
.then(() => console.log("Microtask B"));
❀5
πŸ˜‚
Please open Telegram to view this post
VIEW IN TELEGRAM
🀣35πŸ‘2πŸ”₯2❀1
CHALLENGE

function highlight(strings, ...values) {
return strings.reduce((result, str, i) => {
const value = values[i - 1];
const formatted =
typeof value === "number"
? `[${value.toFixed(2)}]`
: `<${String(value).toUpperCase()}>`;
return result + formatted + str;
});
}

const item = "sword";
const qty = 3;
const price = 9.5;

const output = highlight`You bought ${qty} ${item}s for $${price} each.`;
console.log(output);
❀6
πŸ˜ƒ A developer code-golfed a signal implementation to just 33 bytes (above). I had to stare at it for a solid minute before it clicked, but mercifully, a Redditor breaks down exactly what's going on.
Please open Telegram to view this post
VIEW IN TELEGRAM
❀3πŸ‘2
πŸ€– Read more
Please open Telegram to view this post
VIEW IN TELEGRAM
🀣10πŸ‘2πŸ”₯2
πŸ—“ FullCalendar 7.0: A Full Sized JavaScript Calendar

A Google Calendar-style experience for your own apps. Works with React, Vue and Angular (v7.0 adds Angular 22 support), but can be used with plain JavaScript. Here’s a demo where you can play with the themes and styling approaches. MIT licensed with commercial extensions.

FullCalendar LLC
Please open Telegram to view this post
VIEW IN TELEGRAM
❀6πŸ‘6
CHALLENGE

const inventory = [
{ name: "sword", type: "weapon", power: 85 },
{ name: "shield", type: "armor", power: 60 },
{ name: "bow", type: "weapon", power: 72 },
{ name: "helmet", type: "armor", power: 45 },
{ name: "dagger", type: "weapon", power: 91 },
];

const result = inventory
.filter(item => item.type === "weapon")
.map(item => ({ ...item, power: item.power * 1.1 }))
.sort((a, b) => b.power - a.power)
.reduce((acc, item, index) => {
acc[index === 0 ? "best" : "rest"] ??= [];
if (index === 0) acc.best = item.name;
else acc.rest.push(item.name);
return acc;
}, {});

console.log(result.best, result.rest);
❀2
πŸ˜‚
Please open Telegram to view this post
VIEW IN TELEGRAM
🀣14❀4πŸ‘3πŸ”₯2
CHALLENGE


const handler = {
get(target, prop, receiver) {
if (prop in target) {
return Reflect.get(target, prop, receiver) * 2;
}
return `missing:${prop}`;
},
set(target, prop, value) {
if (typeof value !== "number") {
throw new TypeError("Only numbers allowed");
}
return Reflect.set(target, prop, value * 10);
},
has(target, prop) {
return prop.startsWith("x") ? false : prop in target;
},
};

const store = new Proxy({ xRay: 5, score: 3 }, handler);

store.level = 4;

console.log(store.xRay);
console.log(store.score);
console.log(store.level);
console.log("xRay" in store);
console.log("score" in store);
console.log(store.missing);
πŸ‘3❀2πŸ”₯1
πŸ˜†
Please open Telegram to view this post
VIEW IN TELEGRAM
🀣11🀩5❀4
CHALLENGE

const inventory = {
warehouse: {
shelves: [
{ id: 'A1', items: ['bolts', 'nuts', 'washers'] },
{ id: 'B2', items: ['hammers', 'wrenches'] },
],
manager: { name: 'Carlos', shift: 'night' },
},
};

const {
warehouse: {
shelves: [{ items: [firstItem, , thirdItem] }, { id: shelfId }],
manager: { name, shift = 'day' },
},
} = inventory;

console.log(`${name} | ${shift} | ${shelfId} | ${firstItem} | ${thirdItem}`);
🀣4❀2πŸ‘1
CHALLENGE

async function fetchData(id) {
if (id <= 0) throw new Error("Invalid ID");
return { id, value: id * 10 };
}

async function process() {
const results = await Promise.allSettled([
fetchData(1),
fetchData(-1),
fetchData(3),
]);

results.forEach(({ status, value, reason }) => {
if (status === "fulfilled") {
console.log(`βœ… ${value.id}: ${value.value}`);
} else {
console.log(`❌ ${reason.message}`);
}
});
}

process();
❀5πŸ”₯1