Alёna Batitskaia
@abatickaya.bsky.social
Frontend developer, speaker, writer, team lead Doka.guide, GoogleDevExpert for Web, WomenTechmakers Ambassador.
London, UK
London, UK
Do we really need a framework for every damn project?
(Hint: probably not.)
🧵👇
(Hint: probably not.)
🧵👇
March 28, 2025 at 10:10 PM
Do we really need a framework for every damn project?
(Hint: probably not.)
🧵👇
(Hint: probably not.)
🧵👇
Junior starts work: here's the documentation, here's the code, here's the tasks for the week, and here's a mentor — ask if you need anything.
Senior starts work: here's the access. If something breaks, you'll find out first. Oh, and there's no documentation, you'll write it yourself.
Senior starts work: here's the access. If something breaks, you'll find out first. Oh, and there's no documentation, you'll write it yourself.
March 17, 2025 at 6:20 PM
Junior starts work: here's the documentation, here's the code, here's the tasks for the week, and here's a mentor — ask if you need anything.
Senior starts work: here's the access. If something breaks, you'll find out first. Oh, and there's no documentation, you'll write it yourself.
Senior starts work: here's the access. If something breaks, you'll find out first. Oh, and there's no documentation, you'll write it yourself.
Reposted by Alёna Batitskaia
👓 element v1.0.0 - A custom element that uses the CSS Custom Highlight API for syntax highlighting.
Code highlighting works without modification (no need to wrap each token with a element)
👀 Demo: andreruffert.github.io/syntax-highl...
ℹ️ Repo: github.com/andreruffert...
Code highlighting works without modification (no need to wrap each token with a element)
👀 Demo: andreruffert.github.io/syntax-highl...
ℹ️ Repo: github.com/andreruffert...
<syntax-highlight> element - Web Component
A <syntax-highlight> web component that uses the CSS Custom Highlight API.
andreruffert.github.io
March 13, 2025 at 7:06 AM
👓 element v1.0.0 - A custom element that uses the CSS Custom Highlight API for syntax highlighting.
Code highlighting works without modification (no need to wrap each token with a element)
👀 Demo: andreruffert.github.io/syntax-highl...
ℹ️ Repo: github.com/andreruffert...
Code highlighting works without modification (no need to wrap each token with a element)
👀 Demo: andreruffert.github.io/syntax-highl...
ℹ️ Repo: github.com/andreruffert...
We’re discussing "beautiful numbers" in chat. Everyone has their own favorites—I love multiples of 5, someone prefers 10, or better yet, 12.
But somehow, 207 was unanimously declared *ugly*.
Are you the same, or are you normal?
But somehow, 207 was unanimously declared *ugly*.
Are you the same, or are you normal?
March 10, 2025 at 2:38 PM
We’re discussing "beautiful numbers" in chat. Everyone has their own favorites—I love multiples of 5, someone prefers 10, or better yet, 12.
But somehow, 207 was unanimously declared *ugly*.
Are you the same, or are you normal?
But somehow, 207 was unanimously declared *ugly*.
Are you the same, or are you normal?
Signed a contract for a new job 🎉
March 3, 2025 at 11:24 AM
Signed a contract for a new job 🎉
Reposted by Alёna Batitskaia
🎉 Introducing my upcoming third course, Whimsical Animations!
This course will teach you how to build top-tier animations and interactions using a variety of techniques. ✨
You can join the waitlist on the course’s brand-new site, which is the most ridiculous thing I’ve built in quite some time:
This course will teach you how to build top-tier animations and interactions using a variety of techniques. ✨
You can join the waitlist on the course’s brand-new site, which is the most ridiculous thing I’ve built in quite some time:
Whimsical Animations
Learn how to create charming interactions and delightful touches using the magic of CSS, JavaScript, SVG, and Canvas. I’m sharing all my tricks in this one!
whimsy.joshwcomeau.com
February 24, 2025 at 4:32 PM
🎉 Introducing my upcoming third course, Whimsical Animations!
This course will teach you how to build top-tier animations and interactions using a variety of techniques. ✨
You can join the waitlist on the course’s brand-new site, which is the most ridiculous thing I’ve built in quite some time:
This course will teach you how to build top-tier animations and interactions using a variety of techniques. ✨
You can join the waitlist on the course’s brand-new site, which is the most ridiculous thing I’ve built in quite some time:
Reposted by Alёna Batitskaia
Every time someone publishes an article about CSS colors mentioning only rgb(), hex notation, and hsl(), an angel loses its wings.
Two angels if the article only mentions the comma-notation for rgb() and hsl().
Three angels if the article only mentions the 6-chars hex notation, rgba(), and hsla().
Two angels if the article only mentions the comma-notation for rgb() and hsl().
Three angels if the article only mentions the 6-chars hex notation, rgba(), and hsla().
February 21, 2025 at 8:12 AM
Every time someone publishes an article about CSS colors mentioning only rgb(), hex notation, and hsl(), an angel loses its wings.
Two angels if the article only mentions the comma-notation for rgb() and hsl().
Three angels if the article only mentions the 6-chars hex notation, rgba(), and hsla().
Two angels if the article only mentions the comma-notation for rgb() and hsl().
Three angels if the article only mentions the 6-chars hex notation, rgba(), and hsla().
Continuing the letter theme: the pound symbol in the Korolev font is really beautiful.
www.devicefonts.co.uk/catalogue/ko...
www.devicefonts.co.uk/catalogue/ko...
February 17, 2025 at 8:35 PM
Continuing the letter theme: the pound symbol in the Korolev font is really beautiful.
www.devicefonts.co.uk/catalogue/ko...
www.devicefonts.co.uk/catalogue/ko...
Just swapped my code editor font to Martian Mono—never going back. 🚀
A quick reminder: Martian Mono 1.1, now with coding ligatures, is out!
Grab it for free on GitHub or install via Homebrew.
Grab it for free on GitHub or install via Homebrew.
February 17, 2025 at 8:21 PM
Just swapped my code editor font to Martian Mono—never going back. 🚀
Today I learnt about the existence of branded types in TS.
Looks useful 👍
www.learningtypescript.com/articles/bra...
Looks useful 👍
www.learningtypescript.com/articles/bra...
Branded Types | Learning TypeScript
How the concept of branded types allows describing primitives more precisely than TypeScript normally allows.
www.learningtypescript.com
February 16, 2025 at 5:01 PM
Today I learnt about the existence of branded types in TS.
Looks useful 👍
www.learningtypescript.com/articles/bra...
Looks useful 👍
www.learningtypescript.com/articles/bra...
Reposted by Alёna Batitskaia
CSS Weekly #605
🚀 Optimizing The Critical Rendering Path
😶🌫️ Focus by Negation Effect
🔎 Dynamic Focus Zoom Effect
🌄 Favicon & Gif in 2025
Featuring @mattzeunert.com, @kevinpowell.co, @en.sitnik.ru, @ryantrimble.com, @geoffreygraham.bsky.social, @tahazsh.bsky.social, @jhey.dev.
cssw.io/issue-605
🚀 Optimizing The Critical Rendering Path
😶🌫️ Focus by Negation Effect
🔎 Dynamic Focus Zoom Effect
🌄 Favicon & Gif in 2025
Featuring @mattzeunert.com, @kevinpowell.co, @en.sitnik.ru, @ryantrimble.com, @geoffreygraham.bsky.social, @tahazsh.bsky.social, @jhey.dev.
cssw.io/issue-605
CSS Weekly Issue #605
Find out how to optimize the Critical Rendering Path, how to create cool-looking CSS effects, how to work with favicons and animated images in 2025, and more.
cssw.io
February 14, 2025 at 2:08 PM
CSS Weekly #605
🚀 Optimizing The Critical Rendering Path
😶🌫️ Focus by Negation Effect
🔎 Dynamic Focus Zoom Effect
🌄 Favicon & Gif in 2025
Featuring @mattzeunert.com, @kevinpowell.co, @en.sitnik.ru, @ryantrimble.com, @geoffreygraham.bsky.social, @tahazsh.bsky.social, @jhey.dev.
cssw.io/issue-605
🚀 Optimizing The Critical Rendering Path
😶🌫️ Focus by Negation Effect
🔎 Dynamic Focus Zoom Effect
🌄 Favicon & Gif in 2025
Featuring @mattzeunert.com, @kevinpowell.co, @en.sitnik.ru, @ryantrimble.com, @geoffreygraham.bsky.social, @tahazsh.bsky.social, @jhey.dev.
cssw.io/issue-605
If your website isn't aiming for mega creativity, please don’t use a custom cursor!
Where’s the "tip" of this heart? With a regular arrow, it's obvious. But this? 🤨
Where’s the "tip" of this heart? With a regular arrow, it's obvious. But this? 🤨
February 14, 2025 at 12:37 PM
If your website isn't aiming for mega creativity, please don’t use a custom cursor!
Where’s the "tip" of this heart? With a regular arrow, it's obvious. But this? 🤨
Where’s the "tip" of this heart? With a regular arrow, it's obvious. But this? 🤨
Mama said I'm a software developer 😎
Tired of forgetting about npm run dev and it eating up my memory overnight. So I wrote a little script that checks if the editor window or localhost is open, and if not, shuts down the server after 10 minutes.
Feeling proud of myself! 🙌
Tired of forgetting about npm run dev and it eating up my memory overnight. So I wrote a little script that checks if the editor window or localhost is open, and if not, shuts down the server after 10 minutes.
Feeling proud of myself! 🙌
February 12, 2025 at 1:52 PM
Mama said I'm a software developer 😎
Tired of forgetting about npm run dev and it eating up my memory overnight. So I wrote a little script that checks if the editor window or localhost is open, and if not, shuts down the server after 10 minutes.
Feeling proud of myself! 🙌
Tired of forgetting about npm run dev and it eating up my memory overnight. So I wrote a little script that checks if the editor window or localhost is open, and if not, shuts down the server after 10 minutes.
Feeling proud of myself! 🙌
> Bugs in code behave just like those in real life: they live in the darkest, dirtiest places in the code…
Immediately imagine dark corners of my codebase. And the funniest that I know exactly where they are! 😆
refactoring.guru/refactoring/...
Immediately imagine dark corners of my codebase. And the funniest that I know exactly where they are! 😆
refactoring.guru/refactoring/...
February 11, 2025 at 7:09 PM
> Bugs in code behave just like those in real life: they live in the darkest, dirtiest places in the code…
Immediately imagine dark corners of my codebase. And the funniest that I know exactly where they are! 😆
refactoring.guru/refactoring/...
Immediately imagine dark corners of my codebase. And the funniest that I know exactly where they are! 😆
refactoring.guru/refactoring/...
Reposted by Alёna Batitskaia
February 9, 2025 at 1:21 AM
Reposted by Alёna Batitskaia
[ 🔥 VS Code Quick Tip ]
Did you know that you can click on breadcrumbs in @vscode.dev and quickly navigate between folders, files, and even symbols?
Did you know that you can click on breadcrumbs in @vscode.dev and quickly navigate between folders, files, and even symbols?
February 6, 2025 at 9:34 PM
[ 🔥 VS Code Quick Tip ]
Did you know that you can click on breadcrumbs in @vscode.dev and quickly navigate between folders, files, and even symbols?
Did you know that you can click on breadcrumbs in @vscode.dev and quickly navigate between folders, files, and even symbols?
Think about this before you sleep tonight.
We’re all young and full of energy now, but that won’t always be the case.
We’re all young and full of energy now, but that won’t always be the case.
February 4, 2025 at 6:35 PM
Think about this before you sleep tonight.
We’re all young and full of energy now, but that won’t always be the case.
We’re all young and full of energy now, but that won’t always be the case.
Am I the only one tired of AI everywhere? They even brought it into dev tools…
February 3, 2025 at 9:55 PM
Am I the only one tired of AI everywhere? They even brought it into dev tools…
The interviewer didn’t show up for the interview. That’s a first! =)
February 3, 2025 at 3:19 PM
The interviewer didn’t show up for the interview. That’s a first! =)
"Imposible HTML & CSS" tread
Start here → x.com/ABatickaya/s...
Buttons are still the hardest part of UI
Netflix
Start here → x.com/ABatickaya/s...
Buttons are still the hardest part of UI
Netflix
January 31, 2025 at 7:12 PM
"Imposible HTML & CSS" tread
Start here → x.com/ABatickaya/s...
Buttons are still the hardest part of UI
Netflix
Start here → x.com/ABatickaya/s...
Buttons are still the hardest part of UI
Netflix
Great moment to cleanup 🧹
January 31, 2025 at 3:35 PM
Great moment to cleanup 🧹
Blocking first sweater not for myself, but for a friend. So excited and a bit worried about their reaction! 😅
January 30, 2025 at 9:23 PM
Blocking first sweater not for myself, but for a friend. So excited and a bit worried about their reaction! 😅
Подлодка зовёт!
С 10 по 15 февраля — шесть дней тёплых встреч, докладов и обсуждений про React: фича-тогглы, мультиязычность и другие штуки.
Если хотите присоединиться — держите промокод OBEY_REACT на скидку 500₽.
Буду рада видеть вас! 🖤
🔗 podlodka.io/reactcrew?ut...
С 10 по 15 февраля — шесть дней тёплых встреч, докладов и обсуждений про React: фича-тогглы, мультиязычность и другие штуки.
Если хотите присоединиться — держите промокод OBEY_REACT на скидку 500₽.
Буду рада видеть вас! 🖤
🔗 podlodka.io/reactcrew?ut...
Онлайн-конференция Podlodka React Crew, сезон #2
Недельное мероприятие от команды Podlodka: ежедневные интерактивные сессии в Zoom по актуальным проблемам frontend-разработки, нон-стоп общение с экспертами и звёздами индустрии, закрытое профессионал...
podlodka.io
January 30, 2025 at 5:05 PM
Подлодка зовёт!
С 10 по 15 февраля — шесть дней тёплых встреч, докладов и обсуждений про React: фича-тогглы, мультиязычность и другие штуки.
Если хотите присоединиться — держите промокод OBEY_REACT на скидку 500₽.
Буду рада видеть вас! 🖤
🔗 podlodka.io/reactcrew?ut...
С 10 по 15 февраля — шесть дней тёплых встреч, докладов и обсуждений про React: фича-тогглы, мультиязычность и другие штуки.
Если хотите присоединиться — держите промокод OBEY_REACT на скидку 500₽.
Буду рада видеть вас! 🖤
🔗 podlodka.io/reactcrew?ut...
TIL that there's an unused but reserved HTTP status:
402 Payment Required 💸
Reading HTTP status codes first thing in the morning is oddly refreshing! 😆
402 Payment Required 💸
Reading HTTP status codes first thing in the morning is oddly refreshing! 😆
January 30, 2025 at 9:31 AM
TIL that there's an unused but reserved HTTP status:
402 Payment Required 💸
Reading HTTP status codes first thing in the morning is oddly refreshing! 😆
402 Payment Required 💸
Reading HTTP status codes first thing in the morning is oddly refreshing! 😆