Frontend Briefly - News and insights from the world of frontend development #2
A regular round-up of the most important news, articles or tweets in the world of the frontend is here! For the month of January, we've prepared 12 news that any frontend developer shouldn't miss.
1. How to create beautiful gradients
How to make nice gradients without "dead gray zones"? In this article, you'll find instructions on how to use color theory to create rich gradients. Joshua Comeau has even created a gradients generation tool that you can use in your CSS.
2. Remix vs. Next.js
Remix is a full stack web framework that says it is better than Next.js. If you want to find out more, you can read a detailed article comparing Remix and Next.js. After reading, you may find motivation to try Remix or study more about it.
3. Lodash v5.0
5. Fluid Typography
Setting the font size in a responsive design has been quite cumbersome so far. Typically, specific breakpoints are used for various wide screens in which the font size is fixed. However, using fluid typography, we can calculate the font size according to the screen size. This concept has been known for a long time, but so far we have had to use different workarounds. With the new CSS clamp function, we can easily implement fluid typography. In the article you will find a detailed explanation of the whole concept, including code samples.
font-size: clamp(2.25rem, 2vw + 1.5rem, 3.25rem);
6.Why don't developers take accessibility seriously?
Read some ideas that I hope motivate you to pay more attention to accessibility (if you haven't done it yet). That is why I try to write about this topic in my articles as well, because I consider it important. The web should be accessible to everyone.
7. How to create an accessible heading structure
The article describes in detail how to work with headlines on the web. Here are some tips and best practices not only for better accessibility, but also for SEO.
8. How to detect memory leaks
Another often overlooked topic that deserves more attention. In the article you will find the reasons why it is important to detect memory leaks, but also instructions on how to do it. This article also introduced the fuite tool for memory leak detection in SPA applications.
9. News in DevTools
In this article you can read what news came to DevTools for different browsers. I really like the Recorder that came to Chrome. Thanks to it, you can upload the entire interaction on the web and then play it back and measure performance. This novelty can have interesting use cases.
11. CSS news for 2022
You can find what news we can expect in 2022 in CSS for all available browsers from this tweet. If you want to know the details, click on this whole thread ⬇️
12. CSS Cascade Layers
You must have encountered a situation when writing CSS that styles were rewritten, for example, after adding third-party styles. Cascade Layers will help you control the specificity and order of CSS rules. You no longer have to worry about those CSS rules from another layer breaking the design on the web. However, we have to wait a while for browser support. You can read more about layers in the article, where you will find all the details.
If you liked the news overview, don't forget to subscribe to our newsletter. You can also read the news for last month, which we brought in the december Frontend Briefly.