Solid is a reactive JavaScript library for creating user interfaces without a virtual DOM. It compiles templates down to real DOM nodes once and wraps updates in fine-grained reactions so that when state updates, only the related code runs. This way, the compiler can optimize initial render and the runtime optimizes updates. This focus on performance makes it one of the top-rated JavaScript frameworks. I got curious about it and wanted to give it a try, so I spent some ..

• 0 Comment

You can’t just do @media (prefers-reduced-data: no-preference) alone because, as Kilian Valkhof says: […] that would be false if either there was no support (since the browser wouldn’t understand the media query) or if it was supported but the user wanted to preserve data. Usually @supports is the tool for this in CSS, but that doesn’t work with @media queries. Turns out there is a solution though: @media not all and (prefers-reduced-data), (prefers-reduce..

• 0 Comment

..

• 0 Comment

I appreciated this bit of nuance from a post on Viget’s blog: There could be a whole article written about the many flavours of Tailwind, but broadly speaking those flavours are:1. Stock tailwind, ie. no changes to the configuration,2. Tailwind that heavily relies on @apply in CSS files but still follows BEM or some other component organization,3. Tailwind UI, and4. heavily customizing Tailwind’s configuration and writing custom plugins.Leo Bauza, “How does Viget C..

• 0 Comment

Frontity is a WordPress-focused React-based server-side dynamic-rendering framework (phew!) that allows us to create fast headless websites. Chris has a good introduction to Frontity. I guess you could think of it like Next.js for WordPress. And while the demand for headless WordPress sites may be a niche market at the moment, the Frontity showcase page demonstrates that there is excitement for it. Frontity’s documentation, tutorials and guides focus on creating headless..

• 0 Comment

I’ve seen this confuse more than a handful of people recently, including myself, so I’m making sure it’s written down. Let’s chuck a couple of custom properties into CSS: html { --color-1: red; --color-2: blue; } Let’s use them right away to make a background gradient: html { --color-1: red; --color-2: blue; --bg: linear-gradient(to right, var(--color-1), var(--color-2)); } Now say there is a couple of divs sitting on the page: <d..

• 0 Comment

Nuxt is a JavaScript framework that extends the existing functionality of Vue.js with features like server-side rendering, static page generation, file-based routing, and automatic code splitting among other things. I’ve been enjoying using frameworks like Nuxt and Next because they offer not only more features, but better performance and a better developer experience than the underlying libraries alone without having to learn a lot of new concepts. Because of this, many..

• 0 Comment

(This is a sponsored post.) In this article, we will discuss how we can apply schema stitching across multiple Fauna instances. We will also discuss how to combine other GraphQL services and data sources with Fauna in one graph. Get the code What is Schema Stitching? Schema stitching is the process of creating a single GraphQL API from multiple underlying GraphQL APIs. Where is it useful? While building large-scale applications, we often break down vari..

• 0 Comment

Over at the JS Party poundcast: [Kend C. Dodds]: […] ask anybody who’s done regular, old CSS and they’ll tell you that “I don’t know if it’s okay for me to change this, so I’m gonna duplicate it.” And now we’ve got – at PayPal (this is not made up) we had 90% unused CSS on the project I was using, because everybody was afraid to touch the old stuff. So we just duplicated something new and called it something else. And you might just say that we’re bad..

• 0 Comment

Have you already tried using WordPress headlessly with Gatsby? If you haven’t, you might check this article around the new Gatsby source plugin for WordPress; gatsby-source-wordpress is the official source plugin introduced in March 2021 as a part of the Gatsby 3 release. It significantly improves the integration with WordPress. Also, the WordPress plugin WPGraphQL providing the GraphQL API is now available via the official WordPress repository. With stable and maintaine..

• 0 Comment