Usage of Link Component in Next Js

<Link> is a React component that extends the HTML <a> element to provide prefetching and client-side navigation between routes. It is the primary way to navigate between routes in Next.js. import Link from ‘next/link’ function Home() { return ( <ul> <li> <Link href=”/”>Home</Link> </li> <li> <Link href=”/about”>About Us</Link> </li> <li> <Link href=”/blog/hello-world”>Blog Post</Link> </li> </ul> )} export default Home

How to Create a Step Progress Bar With Tailwind

The very first thing we need is the HTML structure. index.html <div class=”stepper-wrapper”> <div class=”stepper-item completed”> <div class=”step-counter”>1</div> <div class=”step-name”>First</div> </div> <div class=”stepper-item completed”> <div class=”step-counter”>2</div> <div class=”step-name”>Second</div> </div> <div class=”stepper-item active”> <div class=”step-counter”>3</div> <div class=”step-name”>Third</div> </div> <div class=”stepper-item”> <div class=”step-counter”>4</div> <div class=”step-name”>Forth</div> </div> </div> We have a wrapper that contains all of the steps.… Continue reading How to Create a Step Progress Bar With Tailwind

Get Created Date and Compare it with our Current Date and Time

We have created an extension in which order time will be stored in the Sales Order (SO). Based on the current time and the order time, we will provide an option for customers to edit an order. They can add, remove, and update items. This edit option is available on the My Account page. The… Continue reading Get Created Date and Compare it with our Current Date and Time

Identify digits within a string

function extractDigits(text) { var regex = /bd+b/g; var matches = text.match(regex); return matches ? matches : []; } // Usage var text = “Order numbers: 123, 456 and 789.”; var digits = extractDigits(text); console.log(digits); // Output: [“123”, “456”, “789”] Explanation /bd+b/g: The regex pattern to match standalone digits. b: Word boundary to ensure digits are… Continue reading Identify digits within a string

Optional Chaining Operator(?.)

What happens when we deal with – Data — Easy to traverse. Nested Data — Little difficult to traverse. More levels of Nesting in Data — Painful to traverse; More lines of code. Ahhh…. too much work ???😰 Hang in there. OPTIONAL CHAINING to your rescue !!! Optional Chaining operator has been introduced in JavaScript now and is… Continue reading Optional Chaining Operator(?.)

Callback Hell

Callbacks A callback function is a function passed into another function as an argument, which is then invoked inside the outer function to complete its action. They’re so common in JavaScript that you probably have used callbacks yourself without knowing that they’re called callbacks. A very simple example of the callback is: const numbers =… Continue reading Callback Hell

Memoization it is!

In computing, memoization is an optimization technique used primarily to speed up computer programs by storing the results of expensive function calls and returning the cached result when the same inputs occur again. – sources: Wikipedia. In a simpler words, Memoization is nothing but caching or storing the results in a memory. Without Memoization Fibonacci is the best example to illustrate the memoization… Continue reading Memoization it is!

Understanding the coding pattern called (IIFE)

Definition An IIFE is a coding pattern called an Immediately Invoked Function Expression which is a way to execute a JavaScript function immediately after it is created. Also pronounced as “iffy.” Let’s look at the traditional and more widely used syntax used to declare an IIFE. The ES6 way: (() => { /* statements */ })() The ES5 way: (function()… Continue reading Understanding the coding pattern called (IIFE)

Currying in JavaScript

In this growing world of JavaScript, where almost everything can be achieved through functions. We must be aware of the techniques such as closures, pure functions, recursion, etc. which help in making our programming lives easier. Thus in this journey of learning functional programming through JavaScript, I will be walking you through one such technique… Continue reading Currying in JavaScript