Monetize Open-Source Software With Gatsby Functions And Stripe

In this article, I’ll be explaining how I’ve used Gatsby Functions and the Stripe API to enable secure “Pay what you want” contributions that help fund my open-source project MDX Embed. Note: MDX Embed allows you to easily embed popular third-party media content such as YouTube videos, Tweets, Instagram posts, Egghead lessons, Spotify, TikTok and many...

12h

Web Quality Assurance: From User Requirements To Web Risk Management

As a chemist by trade, I received a Master's degree in Quality Management and Quality Control from Bordeaux University. My initial career was in the wine industry, ensuring the quality of the laboratory's operations and the analyses that came out of it. As a side note, the last question of my job interview as quality assurance manager of the laboratory...

1d

Reasons To Build A CRM-Powered Website For Your Business

Most businesses today rely on simple brochure websites for their online presence. These tend to be static websites with a few pages giving core information about the business and details on products and services offered. Although these are relatively cheap and less complicated to develop than a site that offers more advanced user experiences, a business...

1d

Reducing The Need For Pseudo-Elements

Per the W3C spec, “a pseudo-element represents an element not directly present in the document tree". They have been around since version 1 of the CSS specification, when ::first-letter and ::first-line were introduced. The popular ::before and ::after pseudo-elements were added in version 2 — these represent content that does not exist in the source...

2d

The Power Of Pen And Paper Sketching

Need to design something? It can be tempting to start with a computer-based tool, e.g. wireframing software like Balsamiq, or design tools like Photoshop or Figma. These have their place, but I would recommend stepping back and starting with the humble pen and paper. Sketching by hand can feel unfamiliar and uncomfortable to those who don’t feel artistically...

3d

Orchestrating Complexity With Web Animations API

There’s no middle ground between simple transitions and complex animations. You’re either fine with what CSS Transitions and Animations provide or you suddenly need all the power you can get. Web Animations API gives you a lot of tools to work with animations. But you need to know how to handle them. This article will walk you through the main points...

4d

Web Design Done Well: Excellent Editorial

A lot of web design talk concerns itself with what goes on around content. Page speed, design systems, search engine optimization, frameworks, accessibility — the list goes on and on. This gives us at Smashing Magazine plenty to write about, which is great, though it’s worth reminding ourselves what it’s all in service of. In this third edition of...

1w

Using SWR React Hooks With Next.js’ Incremental Static Regeneration (ISR)

If you’ve ever used Incremental Static Regeneration (ISR) with Next.js, you may have found yourself sending stale data to the client. This occurs when you are revalidating the page on the server. For some websites this works, but for others (such as Hack Club’s Scrapbook, a site built by @lachlanjc that I help maintain), the user expects the data to...

2w

Developer Decisions For Building Flexible Components

In the real world, content often differs vastly from the neat, perfectly fitting content presented in designs. Added to that, on the modern web, users have an ever-increasing range of options for how they access the sites we build. In this article, we’ll walk through the process of taking a seemingly simple design for a text-and-media component and...

2w

New Smashing Online Workshops on Front-End & UX

You might know it already, but perhaps not yet: we regularly run friendly online workshops around front-end and design. We have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well. All workshops sessions are broken down into 2.5h-segments across days, so you always have time to ask questions, share...

2w