Photo by Micah Williams on Unsplash

In the last few months, I have been working on Next.js applications. Although, there are many methods of implementing authentication workflows in next.js, but I didn’t find any tutorial that described implementing client side authentication logic in detail. But, with bits of information I gathered here and there and so many tries, I was able to figure it out. I have written this article to guide anyone who is interested in implementing something like this.

Implemetation

Below are the steps I took to achieve this using a higher order component, Context API and React hooks.

The first step is to use…


Photo by picjumbo.com from Pexels

It can be very tasking developing UI effects for your website. Especially when you have complex shapes, animations, and numerous images to deal with. Thankfully, some thoughtful people on the internet have built a number of tools that generate CSS codes hence, easing some of these exhausting tasks. As always, I advocate that you take some time to understand the underlying principles behind the CSS attributes used by these tools, as it would help you manipulate the generated codes easily. Here are some tools that can make writing CSS seamless.

1. CLIP PATH MAKER

Clippy is an online tool that…


Packages can be of great help but overuse should be avoided. For one obvious reason — Maintainability. The more packages you use, the more difficult it is to maintain your code base. A package update could be a huge disaster. Like I always say, If you can write the logic, you do not need a package.

Some days ago, I needed to create a counter animation effect on a website. The product owner wanted a portion of the page which had statistics to appear as if it is counting the database records in real-time.

I came across so many packages…


Lastweek was a great week for me. I finally got SonarQube to pick up my test coverage report. I would give you a step by step guide to how I achieved this. I do hope you will find this tutorial helpful.

I am making the assumption that you already use React and Jenkins but, you just want SonarQube to be able to read your test coverage reports. I have also assumed that you have already written your unit tests.

Step 1: Configure your Package.json File

The first step is to configure your package.json file. Create-React-App already comes with a package.json file and jest as the default…


Photo by Clemens van Lay on Unsplash

I used to wish the day after Monday could be Wednesday. Tuesday was that day of the week when I faced one of my biggest fears — programming classes. I was in second year and it was my first time of taking a course in programming. Before then, I had never written a line of code. The first few classes I attended sent a scary signal. I knew I had to put in extra work to be able to pull through the course. Many of the concepts seemed very abstract and by the time we got to object oriented programming…

Azeezat Raheem

I enjoy figuring things out.

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