🔥 Daily Digest: Master Agentic AI, JavaScript Interview Challenges, and CSS Masking Techniques

Daily Issue #47

• Agentic AI: Build a Tech Research Agent

• The Most Difficult JavaScript Interview Question

• How to create Shapes with Inner Curves using CSS Mask

.shape {
  --r: 25px; /* the radius */
  --s: 40px; /* the size of the cut */
  
  --_m:/calc(2*var(--r)) calc(2*var(--r))
    radial-gradient(#000 70%,#0000 72%) no-repeat;
  mask:
    right calc(var(--s) + var(--r)) top 0 var(--_m),
    right calc(var(--s) + var(--r)) var(--_m),
    radial-gradient(var(--s) at 100% 0,#0000 99%,#000 101%) 
     calc(-1*var(--r)) var(--r) no-repeat,
    conic-gradient(at calc(100% - var(--s) - 2*var(--r)) calc(var(--s) + 2*var(--r)), #0000 25%,#000 0);
} 

• Practical Accessibility Tips You Can Apply Today

• Building LLMs from the Ground Up (A 3-hour Coding Workshop)

• logto - The better identity infrastructure for developers and the open-source alternative to Auth0

• stdf - Mobile web component library based on Svelte and Tailwind

• slider - a small library with zero dependencies that provides a light-weight, responsive content slider with multiple slide transition effects for modern browsers

• sequelize - Feature-rich ORM for modern Node.js and TypeScript, it supports PostgreSQL (with JSON and JSONB support), MySQL, MariaDB, SQLite, MS SQL Server, Snowflake, Oracle DB (v6), DB2 and DB2 for IBM i

Instantly add file uploads to your app with Pinata’s API

Pinata’s File API lets developers integrate file uploads and retrieval in just minutes. No complex setup, no configuration headaches—just fast and scalable file management.

Start building!

Act as an SVG designer

Using Common Object Methods in JavaScript

Problem: I needed to manipulate objects by accessing keys, values, and entries, as well as performing operations like merging objects and checking for property existence.

Solution: I utilized several useful built-in JavaScript object methods to achieve this, including Object.keys(), Object.values(), Object.entries(), Object.fromEntries(), Object.assign(), and hasOwnProperty()

const obj = { a: 1, b: 2, c: 3, d: 4 };

// Object.keys()
// Returns an array containing the names of the object's own enumerable properties.
Object.keys(obj); // ['a', 'b', 'c', 'd']

// Object.values()
// Returns an array containing the values of the object's own enumerable properties.
Object.values(obj); // [1, 2, 3, 4]

// Object.entries()
// Returns an array containing the [key, value] pairs of the object's own enumerable properties.
Object.entries(obj); // [['a', 1], ['b', 2], ['c', 3], ['d', 4]]

// Object.fromEntries()
// Creates an object from an array of [key, value] pairs. It's the inverse of Object.entries().
Object.fromEntries([
  ['a', 1],
  ['b', 2],
]); // { a: 1, b: 2 }

// hasOwnProperty()
// Returns a boolean indicating whether the object has the specified property as its own property.
obj.hasOwnProperty('a'); // true
obj.hasOwnProperty('fff'); // false

// Object.assign()
// Copies the values of all enumerable own properties from one or more source objects to a target object.
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const result = Object.assign(target, source); // {a: 1, b: 4, c: 5}
console.log(result); // {a: 1, b: 4, c: 5}

Keywords: JavaScript object methods, Object.keys, Object.values, Object.entries, Object.fromEntries, hasOwnProperty, Object.assign, merge objects, object manipulation in JavaScript

📣 HELP SPREAD THE WORD

🚀 Spread the Code! Love what you read? Share the newsletter with your fellow devs—every recommendation helps power up the community.

💻 Sponsor the Dev Journey! Keep the bytes flowing and the newsletter growing by becoming a sponsor. Your support helps maintain this valuable resource.

💬 Tweet the Deets! Share the latest with your code crew—let’s make this viral, not just a bug!

If you have built anything that you’d like to share with the community, get with me on X @dailysandbox_ 😀