January 13, 2020 — In this article, Yusuff Faruq will show you how to use React’s Context API which allows you to manage global application states in your React apps without resorting to props drilling. In the process you will learn what the Context API is and the problem it solves, how to create Context and consuming it in both functional and class-based components, and when to use the Context API. Let’s start! Read more…

January 10, 2020 — In a new series, Rachel Andrew breaks down the CSS Grid Layout specification. This time, we take a look at how to use the grid lines to place items. The other methods Rachel will show you in future articles are alternate ways to specify your layout, but are based on the grid created by numbered lines. But for today, here you will find pretty much all you need to know about grid lines! Read more…

January 9, 2020 — A walkthrough of creating an Angular 8 web application and a QR Code generator app completely based on Angular while hosted on Netlify. In this article, Shubham will take you into a walkthrough of creating an Angular 8 web application using the official Angular Material Design library. We will be creating a QR Code generator web application completely based on Angular while hosted on Netlify. Read more…

January 8, 2020 — No frills, or flashing neon frills with sprinklers attached? ‘Brutalist’ websites have flourished in recent years, but their guiding philosophy remains unclear. Brutalist web design has grown so quickly that there does not seem to be a clear consensus on what the style actually is. To some it means practicality, to others audacity. Love it or hate it, brutalist architecture celebrates rawness. Read more…

January 7, 2020 — Browsers’ visual display of headings nested inside <section> elements makes it look as if they are assigning a logical hierarchy to those headings. However, this is purely visual and is not communicated to assistive technologies. In this article, Bruce Lawson explains what use we have of <section> and how authors should mark up headings that are hugely important to AT users. Read more…

January 6, 2020 — Let’s make 2020… fast! An annual front-end performance checklist (PDF/Apple Pages/MS Word), with everything you need to know to create fast experiences on the web today. Updated since 2016. Kindly supported by our dear friends at LogRocket, a frontend performance monitoring solution that helps reproduce bugs and fix issues faster. Read more…

January 3, 2020 — In a new series, Rachel Andrew breaks down the CSS Grid Layout specification. This time, we take a detailed look at what happens when you create a grid container and the various properties that can be applied to the container to shape your grid. Read more…

January 2, 2020 — Are you using sticky elements on your mobile website or PWA? If so, take a moment and ask yourself this question: Do you have anything in them besides your logo, hamburger menu or search bar? If that’s not the case, then it’s time to shake things up. Your mobile visitors are primed to take action. You just need to make it easy for them to do so — and sticky bars and elements are the perfect opportunity to do that. In this article, Suzanne Scacca is going to show you some creative uses for sticky elements in mobile design, so you can help more of your visitors to take action. Read more…

December 31, 2019 — The Smashing Team looks back at 2019. It’s been a busy year with new team members, four conferences, two books, a print magazine, and many, many articles. In this annual round-up, Rachel Anderw will share some of her thoughts and those of some of the Smashing team, as we look back on the past year as well as look forward to 2020. Read more…

December 31, 2019 — Happy 2020! Let’s welcome the new year with wallpapers created by the community for the community. Available with and without a calendar for January, they’ll help guide you through your first adventures of 2020. Read more…