Blog Post Articles

This time we get into very smooth starts and stops for infinite animations using CSS. One of the tricks is layering on a transition on top of an animation.

The job is creating dependable applications in production. Not just “a developer who uses LLMs”, but an engineer in a constant evaluation and improvement loop.

We look at designing callout UI elements using CSS, incorporating leader lines and text boxes. It details setting up the HTML structure, utilizing CSS properties like offset-path and borders.

We look at a couple of ways to essentially draw a little square dot in a slightly larger area and let it repeat, giving us a nice dotted background effect.

Something like manipulating the speed of an animation isn’t a big deal, but it’s harder when the animation is *already running*. We got tricks.

Let’s try a fresh take on animating focus rings around a page. Flying focus, as it were. Only instead of measuring where elements are ourselves, we’ll let View Transitions figure it out.

:nth-child supports the keyword `of` in the argument which can be super useful on it’s own. Combo that with a :has() selector to do some pretty wild stuff!

TanStack Form offers a powerful solution for handling form complexity in React. It emphasizes strong typing, performance, and detail management.

While AI for codegen is manageable, integrating AI into team workflows presents more challenges, such as maintaining quality long term and managing technical debt.

Let’s acknowledge that gap in AI-generated code between code that works and code that is production-ready. It’s you.