Pagination & Infinite Scroll in React
When you have to to present large number of data records in your webapp, you have two options - pagination or infinite scroll. In this post, let's see how to implement both these ways by building a sample app.
10 posts
When you have to to present large number of data records in your webapp, you have two options - pagination or infinite scroll. In this post, let's see how to implement both these ways by building a sample app.
This post explores what NextJS is, how it differs from the likes of Gatsby and CRA, and how you can perform basic tasks like Navigation, Routing, Data Fetching in NextJS. We'll also take a look at the flexibility that Next provides while choosing to prerender or server side render pages.
Recently, I ran into a problem while using setInterval in React. The function you pass to setInterval is defined once and it closes over the old value of your component state. This becomes a problem when you want to use the state to determine whether to clear the setInterval. Read on to find out the solution that worked for me.
Ever wondered what makes React so fast? When it was introduced, the killer feature of React was it's concept of "Virtual DOM", however it brought on it's own set of challenges, including how to efficiently update the DOM to be same as React's virtual DOM. Read on to find out how React solves this problem!
GradGoggles is a cross-platform Virtual Yearbook and Scribble Book App developed for the Class of 2020, which missed all the fun due to the pandemic this year. This post describes the process that went behind developing the app, the technologies used, challenges we faced, and so on.
Recently, I have been working on a ReactJS project which uses AWS services heavily, so, I chose S3 and CloudFront for hosting. However, manually building and deploying the React WebApp every time was a headache. Read on to find out how I automated the build and deploy process,
I wanted to implement a contact form on my website, which is developed using Gatsby. However, Gatsby sites are a static sites with no "backend". In this post, we will use Netlify's Lamba Functions with the SendGrid API to implement a Contact Form on static sites.
I recently redesigned this website using Gatsby. Gatsby is a static site generator based on ReactJS which you can use to make blazing fast websites like this one. Read on to find out more.
This post is a short discussion on a small project which involved building a basic Shopping Cart using ReactJS. We continue exploring ReactJS by discussing various interesting challenges faced while building a basic shopping cart and how React helps solve them efficiently.
In this post, we shall explore the ReactJS library. Starting with what ReactJS is and what is the purpose it serves, we shall also develop a basic component to display a tweet. We will then make the component reusable with the help of props, following the core philosophy of DRY (Don’t Repeat Yourself) with ReactJS.