Bi-Weekly Frontend News

Collective #766

Collective item image popover

Introducing the popover API

The article by Una Kravets introduces the popover API, a new set of declarative HTML APIs in browsers, simplifying the process of building popovers by handling complexities such as focus management, open/close states, and accessibility.

Check it out
Collective item image lensflare

Ultimate Lens Flare

Anderson Mancini created "Ultimate Lens Flare" for React Three Fiber. It adds the optical aberration caused by the dispersion of light entering the lens through its edges.

Check it out
Collective item image memory

Memory Allocation

In this comprehensive article, Sam Rose delves into the fundamental concept of memory allocation, explaining how programs utilize memory and the significance of effective memory management through the use of allocators, with visual representations and practical examples.

Read it
Collective item image notes


Focus is a minimalist, text-based daily planner that provides a straightforward to keep track of tasks and activities.

Check it out
Collective item image linear

Using linear() for better animation

The article discusses the use of the linear() easing function in CSS animations, transitions, and the Web Animations API, allowing for bounce, spring, and elastic effects without complex JavaScript coding.

Check it out
Collective item image css

Why we're bad at CSS

Mike Aparicio writes about the underlying reasons behind CSS struggles and shares the COOL CSS methodology for improving code quality in this insightful article.

Read it
Collective item image carl

Dropdown Descramble

Carl from Creative Coding Club shows how to code the effect seen on this two part tutorial series.

Check it out
Collective item image font

Free Font: Intel One Mono

Intel One Mono is a carefully designed monospaced font catering to the needs of developers, offering clarity, legibility, and an extensive language support, while addressing the concerns of low-vision developers.

Check it out
Collective item image GPTCodeUI

Writing my own ChatGPT Code Interpreter

Rick Lamers' blog post introduces GPT-Code UI, an open-source project he developed as a REPL integrated with ChatGPT's coding abilities, allowing users to execute code, perform tasks like file manipulation, and run Python kernels locally.

Read it
Collective item image agent


Smallville is an open-source project that allows you to create generative agents for RPG games and research purposes, providing virtual characters capable of storing memories, reacting dynamically to their environment, and making NPC interactions more realistic and dynamic.

Check it out
Collective item image windmill


An open-source developer platform to turn scripts into workflows and UIs. Windmill offers a self-hostable solution for internal tools, serving as a viable alternative to platforms like Airplane, Pipedream, Superblocks, and a simplified version of Temporal.

Check it out
Collective item image comiits


OpenCommit is a tool that automates the generation of meaningful commits using AI, with options to configure emoji and commit descriptions, and it can be set up as a GitHub Action or used via the CLI.

Check it out
Collective item image fun


Just draw something on this delightful animated pixel canvas made by Max Bittker.

Check it out
Collective item image security

File Upload Security and Malware Protection

Austin Gil discusses implementing OWASP recommendations for file upload security, including extension validation, filename sanitization, upload and download limits, file storage location, and content-type validation, as well as the use of malware scanning solutions.

Read it