Goodies
Resources, utilities and snippets for devs
Snippets
(38)Ready-to-use code fragments you can copy, adapt and paste: React patterns, TypeScript helpers, frontend logic and functions I reuse constantly. The goal is to have an organized place to find quick solutions without reinventing the wheel every time.
groupBy
Group array items by a key into an object of arrays.
retry
Retry an async operation with exponential backoff on failure.
chunk
Split an array into smaller arrays of a specified size.
uniqueBy
Remove duplicates from an array based on a key selector function.
debounce
Limit function execution rate by delaying until calls stop.
throttle
Limit function execution to at most once per interval.
CSS Tricks
(21)Small CSS tricks to handle interface details: layouts, subtle effects, simple animations and micro-interactions. These examples are meant to make it easy to grasp the pattern, adapt it to your design and keep your visual code clean and consistent.
Fluid Sizing with clamp()
Smooth responsive sizes without media queries. One line of CSS that scales between min and max values.
Animate Height with Grid
Finally animate to auto height! Use grid-template-rows from 0fr to 1fr for smooth accordion animations.
Motion Path Animation
Animate elements along custom curves and SVG paths without JavaScript.
Container Queries
Components that respond to their container's size, not the viewport. Perfect for reusable UI.
Avoid Universal Selector Resets
Why * { margin: 0 } hurts performance and what to use instead.
Circle: border-radius vs clip-path
Two ways to make circles, but only clip-path gives you a circular click area.
Useful Links
(80)A curated selection of links I actually use: solid documentation, design references, frontend resources and online tools that make daily work easier. Less noise, more sites that add real value when you're building something serious.
Awesome AI Devtools
Curated list of AI tools to accelerate your development workflow.
OpenAI Cookbook
Practical examples for integrating OpenAI models into your projects.
Awesome Cursor Rules
Collection of .cursorrules to tune Cursor as your code copilot.
Cursor Rules Repo
Advanced Cursor rules focused on agents, TypeScript and AI workflows.
Animate.css
Collection of ready-to-use CSS animations with simple classes.
Framer Motion
Declarative animations for React with integrated gestures, layout and drag.
GSAP
JS animation engine with powerful timelines and SVG/scroll support.
Motion One
Lightweight library based on Web Animations API with modern syntax.
AutoAnimate
Add automatic animations to DOM changes with a single line of code.
MDN Web Docs
Central reference for HTML, CSS, JavaScript and modern web APIs.
TypeScript Docs
Official TypeScript documentation, from basics to advanced types.
Astro Docs
Official guide for building fast, content-driven sites with Astro.