Of course we’ve got other good things too… in the CSS I really enjoyed the partitioning article, and over in Other Awesome I spent far too long digging through the ‘Humane By Design’ site. Not to say any of the other articles are bad - I try to include only ones I think you’ll enjoy - but those were my favorites.
KBall from ZenDev
Super fun look at the ways to create fancy borders on your elements combining box shadows, outlines, borders, and even some background clipping. It was fun to go through, and opened my mind to possibilities for drawing attention to elements on page.
Fascinating look through a variety of ways you can partition a grid, and then playing with that partitioning based on nth-child and other related specifiers. Creates a very organic feeling set of variations on ways to display content.
Interesting little sideline into the ways browser protect your security by preventing websites from doing anything that might let them determine what else you’ve seen (and lying about colors in some cases to prevent websites from figuring things out)
Interesting case-study of choosing a “utility-first” CSS approach built off of Taliwind.js. I’ve been hearing more and more about these approaches as an alternative to BEM style approaches… haven’t tried it in a serious project myself yet, but the arguments are making more and more sense. Also, if you’re interested in Tailwind specifically check out this JSParty episode with the creator!
... in case rest/spread doesn’t have meaning for you yet). In fact, if you want a quick and dirty intro check out a post I wrote last year. But if you’re already pretty comfortable with the basics, this article has some SUPER COOL tricks that you can use to extend. Love it!
The title is a little more opinionated than the article - this article is a bit of a breakdown of problems or challenges with Moment, but also a look at how different date libraries behave across various dimensions.
A great look at the various types of components that have grown up in the React ecosystem over time. What I particularly like about this article is that it gives the historical context for why all of these different component type exists, so those who haven’t been coding in React for years can better understand some of the why’s behind the variety of options they see today.
I saw someone tweet that every time Dan Abramov write a blog post half the front-end community loses 4 hours out of their day as they read and digest it. That’s a little overstated, but there is a grain of truth to it. This is a long post that will make you think a lot… and it is absolutely 100% worth it. It will improve how you’re thinking about writing components no matter what framework you’re using.
(Bias Alert: I wrote this article) In the last few years, while there has still been tremendously rapid change, and there are more front-end frameworks and packages available than ever, there has also been some consolidation of concepts into a few megatrends. This article breaks down what those megatrends are.
Short and sweet overview of what Web Components are, the 3 technologies that make up a Web component, and just a little bit about what those enable. Also the first in a series of articles (the next 2 are here and here), so if this just gets you eager for more, there is more to be had!
Fascinating set of principles for designing applications that are friendly to humans. With examples. Definitely worth some of your time to go in and click around a bit.
Neat little library for using GraphQL in React, using the Hooks API. Makes for a very nice and clean interface to GraphQL.
An interesting precautionary tale about using type=”number”. I definitely would not have thought about the negative side effects for things like account numbers, but does make it seem like one should opt out for most cases. The deep dive post referred to in the article is also fascinating, if you want to dig in a bit more detail.
That's it for this week's Friday Frontend newsletter. If you enjoyed this, you should probably follow me on Twitter or join my mailing list. Sign up to get these newsletters straight to your inbox every Friday! Sign up here: https://zendev.com/friday-frontend.html