All posts

Data Motion recipes My projects Odds and ends React TypeScript Typography

Guide to data tools landscape for developers

Found yourself on a data project and have no idea what they all are talking about? Feel excluded from all the fun discussions in the office kitchen? If only there were a humongous guide going over all the concepts and buzzwords...

Data

My projects

Practicing design and website rehaul

Did you know there is inverse correlation between how often author publishes new posts and how often they tinker with their website?

My projects

How I built a notebook inside Obsidian

One personal project to add callout component to Obsidian that quickly spiraled out of control. No regrets though.

My projects

Odds and ends

A short history of web bots and bot detection techniques

Did you know your favorite website can detect when you're browsing it in public transport or when you scroll it in your bed? Moreover, this info sometimes helps them to fight bots.

Odds and ends

TypeScript

6 advanced TypeScript tricks

TypeScript's type system can play DOOM. Surely we can make it do something useful for our projects too, right?

TypeScript

Typography

Features of your font you had no idea about

Different weights are cool, but the real question is whether your font can swash.

Typography

Quick guide to web typography for developers

80/20 guide on how to make your blog posts look pretty, for free.

Typography

Motion recipes

Building Swipe Actions component with React and Framer Motion

Making the useSnap hook was fun, now let's use it and build a neat Swipe Actions component, the Radix way.

Motion recipes

How to make draggable Framer Motion elements snap to breakpoints

Drag is cool, but what to do if ya need a bit of snap? In this recipe, we build a reusable hook that makes adding snap points a breeze.

Motion recipes

Animating Radix Primitives with Framer Motion

I always forgot how to properly pair Radix Primitives and Framer Motion, so I wrote this guide!

Motion recipes

Building a «hold to confirm» button with Framer Motion

If typing the project name to confirm its deletion is too boring, how about we make a confirmation button that shakes, vibrates and almost tries to run away from the user?

Motion recipes

React

Did you know you can write your own typesafe React router in 500 lines?

There are a lot of things you can do for yourself. One of them is simple type-safe React routing library. Sounds good, doesn't it?

React

Motion recipes

Direction-aware animations in Framer Motion

Carousels, multistep forms and navigation between screens – they all profit from nice direction-aware animation. In this recipe, you'll learn how you can implement some.

Motion recipes

React

Concurrency in React 18 for busy bees

Guide to concurrency, CPU- and IO-bound components, and other interesting stuff. Finally, learn wtf deferred value is.

React

Guide to React Suspense and use hook for busy bees

Suspense was introduced 5 years ago yet for a long time its sole purpose was just code splitting. Now Suspense helps you to reduce boilerplate and optimize SSR. In this guide, we'll discover how Suspense works, how to use it, and what the profits are.

React

Motion recipes

Making animated tooltip with React and Framer Motion

Learn how to avoid common pitfals when building floating component and how to easily animate them.

Motion recipes