JS frameworks & libraries

Topics on JavaScript frameworks such as React, Next.js,MERN stack, and any other technology based on JavaScript

Learn the fundamentals of Typescript classes in no time

In this post, I will be discussing TypeScript classes, which is a big topic in Object-Oriented Programming. To start, I will go over the essential features of TypeScript classes. In future posts, I will delve into the topic in greater detail and cover how TypeScript implements OOP concepts such as Inheritance and Polymorphism, as well

Learn the fundamentals of Typescript classes in no time Read More »

5 common ways of Type Annotation in TypeScript

What is Type Annotation? TypeScript is a statically-typed language. Hence, Type Annotation is an essential part of TypeScript that you need to be well familiar with. Type Annotations mean different ways that you can define types of variables, parameters, and return values of functions, and properties (of objects). There are many ways to do type annotation

5 common ways of Type Annotation in TypeScript Read More »

How to create React functional components in TypeScript

TypeScript is a superset of JavaScript. Unlike JavaScript, Which is dynamically typed, it is statically typed.  This means you will know the types of variables used in your code at the compile time. This helps you as a developer to check for typed-related errors before the code is executed. If there are no compiled errors,

How to create React functional components in TypeScript Read More »

React.lazy and Suspense make code-splitting easy

React.lazy and Suspense make React developer life easy. React.lazy helps in code-splitting and Suspense backup React.lazy in loading state. Before, we go into details let’s start things simply. let’s be familiar with some background knowledge. What is Bundling? Bundling is the process of putting code in many files into one file. While bundling is essential

React.lazy and Suspense make code-splitting easy Read More »

How to use React useMemo hook to improve performance

React useMemo hook One of the ways that you can improve the performance of React apps is by using the useMemo hook. This hook prevents expensive calculations from running on every render. The React useMemo takes two arguments: a function and a dependency array. useMemo( function, dependancy_array) Now, let us see how useMemo work by an

How to use React useMemo hook to improve performance Read More »

How to implement authentication for SSR pages & API routes in Next.js

Full-stack apps built with Next.js has three aspects of authentication: client-side authentication, server-side authentication, and API route authentication. I have discussed client-side authentication in a previous post. In this post, I will be discussing Server-side & API routes authentication in NextAuth.js. How does server-side authentication work? The browser sends a request with a user session

How to implement authentication for SSR pages & API routes in Next.js Read More »

Scroll to Top