As soon as a React application starts growing in size and complexity, various problems also arise. One of those is managing module imports, especially when the codebase contains several folders, nested on multiple levels. Very often you’ll end up having very long import statements using relative paths.

Photo by Alexander Andrews on Unsplash

To use Google Fonts in a Next.js application you would typically either create a custom Document file or create a custom Head component where you would use a regular HTML link tag to download the font:

<link href="" rel="stylesheet" />

This approach worked perfectly fine, however it had one disadvantage — for every font that needed to be downloaded the browser had to make an extra round trip to fetch the font declarations at run time. There were several plugins trying to solve this issue, next-google-fonts being a popular one.

Depending on the scale and type of your project it…

Photo by Taras Shypka on Unsplash

Despite CSS evolving and CSS-in-JS solutions becoming very popular, SCSS is still a very powerful styling solution for responsive web applications, especially when paired with css-modules.

Several studies show that most of the web traffic already comes from mobile devices and this number will continue to grow. This of course varies depending on your website or web application type, however it is very likely that responsive design plays a very important role in your project.

In this post we’ll be creating a responsive SCSS mixin that you can use in any project without having to remember how to use CSS…

Photo by Xiaole Tao on Unsplash

Did you ever write some amazing code that you wanted to use in all your projects and you ended up manually copying it over ? I did. Even if I knew I could do it in a better way, I thought that the whole process of creating and publishing an npm package is very complicated. However, after doing some research I found out that it is not. It is actually quite simple.

At the end of this article, you should be able to create your own minimal JavaScript utilities library and publish it to npm so that you (and others!)…

Adrian-Gabriel Manduc

Fullstack Web Developer | UI/UX Designer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store