September 22, 2020 — All pages of a Shopify online store can adopt CSS Grid, but one obvious touchpoint of any e-commerce site that can benefit from a robust and clean grid layout is the collection page. In this article, Liam Griffin will be looking at how to set up a grid layout for products on your collection pages, and how to use Shopify’s section settings to create customizable options in the online store editor. Read more…

September 22, 2020 — We’re talking about RedwoodJS. What exactly does it mean to be a full-stack Jamstack framework? Drew McLellan talks to community champion Anthony Campolo to find out. Read more…

September 21, 2020 — Building positive relationships with your clients is the secret ingredient to delivering better work, earning more money, and creating lasting partnerships. In this article, Matt Saunders is going to teach some strategies for managing client communication and processes that have helped him to run less stressful projects and achieve better results, as well as draw upon some best practices to help you manage the business side of your work. Read more…

September 18, 2020 — There’s a lot of information out there — that’s a fact. In these monthly editions, Smashing’s senior editor Iris brings it all in one place because we know how hard it can be to stay on top of things. So with no further ado, here’s what was, what is, and what will be! Read more…

September 17, 2020 — Among others, Next.js has dubbed itself: The React Framework for Static Websites. But just like every other framework whose goal is to help you build what matters by abstracting common, redundant tasks, you’re often required to learn something new and opinionated. With Next.js, one of the things you need to know is how to integrate different CSS methods with its API, and that is the focus of this tutorial. Read more…

September 16, 2020 — In this article, we will take a closer look at GraphQL and how we can integrate it into a Gatsby website by building and implementing advanced data sourcing and transformation in Gatsby. Read more…

September 15, 2020 — We must effectively design to gain and hold users’ attention in order to have them use our digital products. In this article, Victor Yocco covers specific tactics with supporting research that are bound to help you design for attention. He also discusses the need to understand why we want to gain users’ attention as well as what our users’ needs are. Read more…

September 14, 2020 — GreenSock Animation Platform (GSAP) is a set JavaScript functions that let you tween a value/attribute/CSS property over time and insert these tweens into a timeline for more complex animations. In this article, Blessing explains how GSAP plays well with the React library by integrating its functions into a React component in building an example landing page with a variety of animations. Read more…

September 11, 2020 — This week we celebrate the 14th birthday of Smashing Magazine. We didn’t quite have the year that we planned though! I took a look back at some memories from this year and previous years — with the help of the team and some Smashing friends. Read more…

September 11, 2020 — Being able to run Google’s Lighthouse analysis suite programmatically provides a lot of advantages, especially for larger or more complex web applications. Using Lighthouse programmatically allows engineers to set up quality monitoring for sites that need more customization than straightforward applications of Lighthouse (such as Lighthouse CI) allow. This article contains a brief introduction to Lighthouse, discusses the advantages of running it programmatically, and walks through a basic configuration. Read more…