@keithjgrant@front-end.social
@keithjgrant@front-end.social avatar

keithjgrant

@keithjgrant@front-end.social

๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป Front end developer working primarily in React. Currently at Red Hat working on Ansible Controller. Author of CSS in Depth.

๐ŸŒŽ I live in the great Pacific Northwest. I care about people and believe in the open web.

โœจ Iโ€™m married to a literary nerd and have two fantastic children and two ridiculous cats. I enjoy fine cocktails and cooking. And running, when Iโ€™m in the habit. #JavaScript โ€ข #CSS โ€ข #ReactJS โ€ข #WebDev โ€ข #UX โ€ข #IndieWeb โ€ข #guitar โ€ข #PNW โ€ข searchable

This profile is from a federated server and may be incomplete. Browse more on the original instance.

jensimmons, to random
@jensimmons@front-end.social avatar

Dear people who make websites,

Do you ever block your users from being able to paste into a text field?

Why?

Do you need this ability for a good reason? Whatโ€™s that reason?

Or, as a user, would you like to see it go away? Perhaps you encounter sites that prevent you from pasting your super complex password from your password manager into a password field, and wonder why they can do so?

What might be the downside of removing support of disallowing pasting from the web?

keithjgrant,
@keithjgrant@front-end.social avatar

@jensimmons I hate it when paste is disabled. I also hate it when I have to type username, hit enter, then password on a second screen (very rarely doable with a PW manager)

chriscoyier, to random
@chriscoyier@front-end.social avatar

jQuery plugins depended on jQuery, and when jQuery went out of favor, they ended up in the junkyard.

There is all sorts of componentry built exclusively on React, limiting it to React-based sites. As React goes out of favor, they will end up in the junkyard. (Same with any framework-specific extension.)

But with Web Components... it seems like the story will end differently. If they are built without dependencies, they might just live as long as the web does.

keithjgrant,
@keithjgrant@front-end.social avatar

@davatron5000 @chriscoyier @nicolaschevobbe yeah thatโ€™s key I think. I have some old school js on my blog for comments. I looked into converting to wc and the code was worse that way; longer and more obtuse. I need the same benefits I get from JSX to make wc palatable

keithjgrant, to random
@keithjgrant@front-end.social avatar

Apple has burned so much trust through this whole mess. Iโ€™m beginning to read all this emphasis on "privacy and security" as cover for shady monopolistic business practices.

PWAs have so many security element built into them. That's why I see "install our app!" messages online as an attempt to more thoroughly violate privacy.

keithjgrant, to random
@keithjgrant@front-end.social avatar

I think this hits the nail on the head. This is precisely my issue with . It actively ignores one of the most powerful aspects of :

โ€œI think that Tailwind might be a good example of an imperative design tool. Itโ€™s only about the specific outputs. Systematic thinking is actively discouraged; instead you say exactly what you want the final pixels on the screen to be.โ€

https://adactio.com/journal/18982

keithjgrant, to random
@keithjgrant@front-end.social avatar

A common talking point of CSS & separation of concerns is the idea that you can just swap out the CSS for different CSS to have a whole new design.

Thatโ€™s neat and all, but the real-world need is the opposite: the HTML changes ALL. THE. TIME. Write your CSS so it works with changing content.

keithjgrant, (edited ) to random
@keithjgrant@front-end.social avatar

๐Ÿ“ New post: Scope vs Shadow DOM

In which I address the greatest shortcoming in our industry. ๐Ÿซฃ

https://keithjgrant.com/posts/2023/08/scope-vs-shadow-dom/

keithjgrant, to CSS
@keithjgrant@front-end.social avatar

CSS in Depth, 2nd edition is draft complete! Master the language and learn all the latest features from this updated version of one of the highest-rated books on CSS.

..and the MEAP is 40% off this week!

https://www.manning.com/books/css-in-depth-second-edition?a_aid=kjg&a_bid=a7bc24da&chan=mm_mastodon

keithjgrant, to webdev
@keithjgrant@front-end.social avatar

๐Ÿ“ New post: Web components arenโ€™t components.

โ€ฆWhere I try to make sense of thoughts that have been swirling around my head for years now

https://keithjgrant.com/posts/2023/07/web-components-arent-components/

keithjgrant, (edited ) to CSS
@keithjgrant@front-end.social avatar

Leap day, MEAP day!

All Manning early access books are 50% off today, including CSS in Depth

https://www.manning.com/books/css-in-depth-second-edition?a_aid=kjg&a_bid=a7bc24da&chan=mm_mastodon

keithjgrant, to CSS
@keithjgrant@front-end.social avatar

@scope is now live in both Chrome and Safari! This is huge for . The remaining days of BEM are numbered!

https://keithjgrant.com/posts/2023/04/scoped-css-is-back/

keithjgrant, (edited ) to CSS
@keithjgrant@front-end.social avatar

In the first edition of CSS in Depth, I have a chapter on "Modular CSS"... but I'm debating whether to rename that to "Component-based design" for 2nd edition. What do you think?

keithjgrant, to random
@keithjgrant@front-end.social avatar

"show me an example component where @scope can't just be done via a web component instead" is a really frustrating ask.

Because the answer is: every piece of every design system or web app I've ever built. Just the fact that you're asking tells me that providing an example won't actually answer your question because you're clearly coming from such a different problem space that my entire approach is foreign to you

keithjgrant, to random
@keithjgrant@front-end.social avatar

After 13 years, Chrome is finally dropping the -webkit prefix from the CSS mask properties.

keithjgrant, to random
@keithjgrant@front-end.social avatar

๐Ÿ”— What is Utility-First CSS?

โ€œUtility-first CSS is more radical. Utility-first CSS is exception-first CSS. And thatโ€™s not how exceptions work, in CSS or in general.โ€

Man, I love the Heydon snark on this one. He lays it on thick, and heโ€™s spot on.

https://heydonworks.com/article/what-is-utility-first-css/

keithjgrant, to random
@keithjgrant@front-end.social avatar

The world of front end development changes so fast... it never ceases to amaze me that Chai and Sinon have held their place for so flipping long. It's gotta be over a decade now, right?

keithjgrant, to random
@keithjgrant@front-end.social avatar

I swear most of my โ€œtop performingโ€ blog posts are the ones I give little thought to and expect very few people to be interested in

keithjgrant, to random
@keithjgrant@front-end.social avatar

๐Ÿ”— Rotten Apple

https://adactio.com/journal/20888

keithjgrant, to random
@keithjgrant@front-end.social avatar

Sometimes the right call is to simply repeat yourself in code and that's okay. Just because you _can_abstract something doesnโ€™t mean you should

keithjgrant, to random
@keithjgrant@front-end.social avatar

I meme'd

keithjgrant, to random
@keithjgrant@front-end.social avatar

๐Ÿ”— The Ultimate Ideal Bestest Base Font Size That Everyone Is Keeping a Secret Especially Chet

This is actually a really good idea. Though itโ€™s probably worth setting a large base font size for very large screens.

https://adrianroselli.com/2024/03/the-ultimate-ideal-bestest-base-font-size-that-everyone-is-keeping-a-secret-especially-chet.html

keithjgrant, to random
@keithjgrant@front-end.social avatar

Hey #indieweb friends... I've decided to let my registration of https://omnibear.com lapse (it's good til February).

If anybody is interested in taking over that project, I'm up for a domain transfer. @aciccarello has indicated some interest, so teaming up with him might be a possibility

keithjgrant, to random
@keithjgrant@front-end.social avatar

folks, do you post both shares AND bookmarks, or just one? I'm curious how folks distinguish between the two

keithjgrant, to random
@keithjgrant@front-end.social avatar

I canโ€™t even browse recipes on my phone anymore, theyโ€™re so laden with JS bloatware and ads. My phone gets warm to the touch and scrolling becomes unreliable. What a mess

keithjgrant, to random
@keithjgrant@front-end.social avatar

๐Ÿ“ New post: Weighing in on CSS Masonry

https://keithjgrant.com/posts/2024/05/weighing-in-on-css-masonry/

keithjgrant, to random
@keithjgrant@front-end.social avatar

Petition to remove Brazil nuts from cans of mixed nuts and replace them with something that actually tastes good, like pistachios

  • All
  • Subscribed
  • Moderated
  • Favorites
  • โ€ข
  • megavids
  • kavyap
  • DreamBathrooms
  • thenastyranch
  • magazineikmin
  • InstantRegret
  • GTA5RPClips
  • Youngstown
  • everett
  • slotface
  • rosin
  • osvaldo12
  • mdbf
  • ngwrru68w68
  • JUstTest
  • cubers
  • modclub
  • normalnudes
  • tester
  • khanakhh
  • Durango
  • ethstaker
  • tacticalgear
  • Leos
  • provamag3
  • anitta
  • cisconetworking
  • lostlight
  • All magazines