Dominik Hryshaiev

TIL: backdrop-filter creates a new containing block for descendants with position: fixed. I had buttons in my <header /> that should've been fixed to the bottom of the viewport on mobile. But they kept sticking to the top instead — right under the navbar.

HeroUI's Navbar in my app had backdrop-filter property set on the <nav />, trapping my fixed <div /> inside it. In the end, I fixed the issue by dropping that backdrop-filter value. The issue wasn't the position all along.

TIL: backdrop-filter creates a new containing block for descendants with position: fixed. I had buttons in my <header /> that should've been fixed to the bottom of the viewport on mobile. But they kept sticking to the top instead — right under the navbar.

I kept debugging and inspecting every ancestor of the buttons for position values, made sure that all were static. But the buttons still sticked to the header instead of the bottom of the page on mobile.

A small UX detail I like to implement in every app with tooltips: smart delays without flickers. First hover → normal delay (e. g. 500ms) Moving between adjacent buttons → instant Leave and return → delay resets 30 second demo + the React hook that makes it work 👇

Usage is clean - just spread the props onto your tooltip components and add onMouseLeave to the container.

A small UX detail I like to implement in every app with tooltips: smart delays without flickers. First hover → normal delay (e. g. 500ms) Moving between adjacent buttons → instant Leave and return → delay resets 30 second demo + the React hook that makes it work 👇

Just read this article on working with AI agents using Steven Johnson's framework (Seven Patterns of Innovation). As someone unfamiliar with webhooks, I asked Claude to walk me through streak calculation in my habit-tracking app instead, using this mindset: sunilpai.dev/posts/seven-...

Refactored my Supabase client setup into a Singleton. Now there's a single source of truth, safe test behavior, and early error handling for misconfig. One client across the app, no accidental re-creates — a clean, practical use of the pattern.

Have a JavaScript-heavy project that uses @supabase.com and wish you could lint your migrations and seeds like you do with ESLint? I just set up SQLFluff in my app using Docker, Husky, lint-staged, and GitHub Actions to achieve consistency in my SQL code. Sharing my setup here in case it helps ↓

Lastly, SQLFluff isn’t perfect — I’ve hit walls with parsing Postgres functions (especially with plpgsql). I also had to learn how -- noqa works to ignore specific lines. E.g. -- noqa: CV10 next to a line disables rule on quoted literals for it. Still worth it. Would do again. Hope this helped!

Have a JavaScript-heavy project that uses @supabase.com and wish you could lint your migrations and seeds like you do with ESLint? I just set up SQLFluff in my app using Docker, Husky, lint-staged, and GitHub Actions to achieve consistency in my SQL code. Sharing my setup here in case it helps ↓

I use Husky to run SQLFluff in pre-commit hooks with lint-staged. Here's my lint-staged.config.js. There's also a fix to transform the absolute paths to relative ones since when we run the command inside the Docker container, the paths are relative to the mounted volume, not our local file system.

Have a JavaScript-heavy project that uses @supabase.com and wish you could lint your migrations and seeds like you do with ESLint? I just set up SQLFluff in my app using Docker, Husky, lint-staged, and GitHub Actions to achieve consistency in my SQL code. Sharing my setup here in case it helps ↓

SQLFluff is a linter & formatter for SQL, customizable and dialect-aware (Postgres in the case of Supabase). You can run it via Docker (they provide an official image) or install it globally via pip/brew. It reads from .sqlfluff config file in the root of your app. Here’s what mine looks like.

10 years (+1 week, totally forgot to post on the exact anniversary 😅) ago, as a CS sophomore, I signed up on Codecademy & got hooked on JS, HTML & CSS. Spent nights solving exercises—now I’m a Full-Stack Engineer, still just as excited about coding as I was back in my tiny dorm room. Time flies! 🚀

PSN might be down, but it’s given me a moment to really appreciate the physical collection I’ve gathered. Owning discs means you can dive into your favourite worlds notwithstanding network issues. There's something timeless about having these gems on the shelf. Stay patient out there, gamers! 💿 🎮

I kept finding myself running the same repetitive Git commands each time I merged a pull request: switching to main, pulling changes, and deleting the branch. It got tedious, so I decided to automate it. I wrote a small shell script that handles it all for me: gist.github.com/domhhv/be466...

While I came here to post about dev (and to escape x ofc:), algos & my love for games had other plans 😅 So, I’m going 2-fold: dev & gaming! My fav: TLOU GoW Returnal Cyberpunk 2077 High on Life Spider-Man Hogwarts Legacy Stray Stellar Blade GTA V NFS Ratchet & Clank Sackboy Astro It Takes Two

A few weeks ago, I used ES6 generators for the first time in my career. First of, it felt amazing (hoping Symbols get their turn!). Secondly, I wanted to share a practical use case in the context of a React app.

I didn't like having such a long function in my React component, but I didn't know how to extract it since I needed to sequentially update the status state upon each async step complete. And then I remembered about generators.

A few weeks ago, I used ES6 generators for the first time in my career. First of, it felt amazing (hoping Symbols get their turn!). Secondly, I wanted to share a practical use case in the context of a React app.

I was implementing a complex flow where a user provides a prompt in the UI, then I programmatically enhance it and attach some context, and then start a long-running process where I feed this data to an LLM, wait for the response, then feed it to another LLM (potentially changing it), and so forth.