Andrey Okonetchnikov
okonet.dev
Andrey Okonetchnikov
@okonet.dev
UI Engineer specializing in design systems @ https://www.component-driven.dev. Author of 🚫💩 lint-staged. Also Monolisa.dev, colorsnapper.com and more.
I’ve been trying to use CSS text-box: developer.mozilla.org/en-US/docs/W... to replace capsize but was disappointed it doesn’t work well with overflow: hidden. Did anyone manage to make text truncation work with a trimmed text? Cc @markdalgleish.com
text-box - CSS: Cascading Style Sheets | MDN
The text-box CSS property is a shorthand that corresponds to the text-box-trim and text-box-edge properties, which together specify the amount of space to trim from the block-start edge and block-end ...
developer.mozilla.org
March 12, 2025 at 12:50 PM
Current AIs are good at generating a lot of non-working code with a lot of confidence.
February 8, 2025 at 11:00 AM
Reposted by Andrey Okonetchnikov
JavaScript's date object has been tricky for years, but that will change soon.

The NEW Temporal API brings,
🌍 Easily handle time zones
📆 Precise date math
🕒 Parse ISO strings without errors
⌛ Durations, date ranges, and more.

Start exploring 👇
developer.mozilla.org/en-US/blog/...
JavaScript Temporal is coming | MDN Blog
A new way to handle dates and times is being added to JavaScript. Let's take a look at Temporal, what problems it solves, the current state, and what you'll find in the new documentation about it on MDN.
developer.mozilla.org
January 27, 2025 at 5:00 PM
Kids IR controlled crane broke but I refused to throw it away. After some trial and error and with the help of AI got it integrated into my HomeKit setup 😆
January 6, 2025 at 12:07 PM
If you have upgraded to iOS 18 and hate dark icons (like I do) there is a way to change them back. Long press on the Home Screen, select Edit on top, enter Customize and choose the Light color. As a bonus, you can change the size as well.
November 30, 2024 at 4:56 PM
Reposted by Andrey Okonetchnikov
🚀 TypeScript Pro Tip: say goodbye to runtime env variable surprises!
Valibot ensures your secrets are present and correctly typed before your app even starts.
👉 if something's missing, fail fast and fail early
👉 no more typos or guessing what's available
November 21, 2024 at 8:58 AM
Reposted by Andrey Okonetchnikov
🎉 After six incredible years at Framer, it’s time for my next step.

Today, we’re spinning Framer Motion out as its own independent open-source project, to better serve the whole community.

Introducing Motion. For React, and now, for everyone.
November 12, 2024 at 2:46 PM
Reposted by Andrey Okonetchnikov
Looking for some potential distractions?

Well, Roman Komarov has just put together a list of a bunch of fantastic articles on container queries, including a great introduction of them, great use cases, some future possibilities, and cool experiments

blog.kizu.dev/recent-css-b...
Recent CSS Bookmarks 19: Container Queries
I originally wanted to write about something else today but, for some reason, did not have any motivation for it. But hey, let me then do the best thing I could do otherwise: share some other people’s...
blog.kizu.dev
November 6, 2024 at 10:27 PM
Reposted by Andrey Okonetchnikov
🔔 a reminder 🔔

I’m looking for my next client project, I'm a front-end developer and design systems consultant with almost immediate availability.

Get in touch if you’re ready to strengthen your design and dev workflows, need some gnarly front-end or Design System help!

www.alwaystwisted.com

🙏🖤
Always Twisted - Design Systems Consultant & Front-End Architect
Hi, I’m Stu Robson, a Design Systems consultant and front-end developer. I help teams build scalable, accessible, and efficient design systems and front-end codebases that enhance collaboration and st...
www.alwaystwisted.com
November 5, 2024 at 5:29 PM
Reposted by Andrey Okonetchnikov
JavaScript tip: Use Unicode regular expressions to match letters in any language.

\p{L} - Letter in any language
\p{Z} - Whitespace or invisible separator
\p{S} - Symbol
\p{N} - Number in any script
\p{P} - Punctuation

You can also match characters NOT belonging to the group by uppercasing \P
November 4, 2024 at 10:23 AM
Reposted by Andrey Okonetchnikov
🌠 For years, the #1 most requested feature in CSS was Container Queries. We wanted them so badly!

Well, they’ve arrived… and none of us are using them. 😂

I think I know why, and I just published a new blog post that will hopefully change that!

Check it out:
www.joshwcomeau.com/css/containe...
A Friendly Introduction to Container Queries • Josh W. Comeau
It’s been a couple of years since container queries started landing in browsers… so why isn’t anyone using them? It turns out that container queries are kinda tricky; they’re not as straightforward as...
www.joshwcomeau.com
November 4, 2024 at 4:36 PM
I must admit being at 🦋 now is like being on twitter a few years back before it became too toxic and too political.
November 5, 2024 at 6:52 AM
A new post about different methods of composing components in React.js https://www.component-driven.dev/articles/composition-in-react
Different methods of composition in React
Component-driven design & development for the modern web
www.component-driven.dev
May 31, 2023 at 3:50 PM