Tag: React JS & Next.js
-
Claude AI Skills Every Frontend Developer Should Know & Master
A deep, practical guide to using Claude AI as a frontend developer — from smarter prompting and code generation to debugging, UI design, accessibility audits, and building full components faster.
-
Build a Vanilla JS Slider From Scratch — Plus a Reusable React Carousel Component
Build a fully responsive vanilla JavaScript slider and carousel — no jQuery, no SwiperJS, zero dependencies. We cover the complete HTML/CSS/JS implementation with swipe support, keyboard navigation, autoplay, and dot indicators. Then we go further with a clean reusable React slider component built with hooks.
-
Building a Financial Dashboard with Next.js
This project is ideal for anyone looking to get started with Next.js 15 or anyone building a personal finance management tool.
-
Use the useReducer Hook in Next.js for Better State Management
Discover how to build a shopping cart application in Next.js using the useReducer hook for efficient state management. This tutorial covers adding products to the cart, removing them, updating quantities, and calculating the total price, making it ideal for e-commerce websites.
-
Mastering React Context API: A Beginner’s Guide
Learn how to use the React Context API to manage global state in your app with this step-by-step beginner’s guide.
-
A Step-by-Step Tutorial: Building a “Guess the Number” Game with Next.js
Learn how to build a Guess the Number game with Next.js in this step-by-step tutorial. Improve your React skills today!
-
React Router v6 – A Simple Introductory Guide
Learn how to set up React Router in your React app with this easy-to-follow tutorial. Explore key features like smooth navigation, nested routes, & dynamic routing to create a seamless user experience in modern web development.
-
The Ultimate Guide to State Management in React (2025)
State management is a crucial aspect of any React application. Whether you choose to use React’s built-in hooks, the React Context API, or third-party libraries like Redux or Recoil, the right approach depends on the scale and complexity of your app.
-
Adding Animated Transition To React Router
In this article, we will learn to animate route transitions using React Router Transition package.
-
Beginner’s Guide to React Router
React Router is a client-side routing to build a single-page application (SPA) that allows navigation between different pages without refreshing the browser. In this article we will shows you how to build a simple single-page application (SPA) using React Router.
-
Multiline Text Truncation with Ellipsis & Read More Button
Learn how to truncate overflowing text with ellipsis and add a ‘Read More’ button using JavaScript and CSS’s line-clamp property. Improve content display and user experience on your website.
-
React For Absolute Beginners – Part 3
Learn some of the advanced JSX knowledge and common errors to avoid when you’re writing your first React Component!
-
React For Absolute Beginners – Part 2
Learn to render JSX element on screen using ReactDOM.render() method. And also learn what is the Virtual DOM & how it helps in boosting the performance.
-
React For Absolute Beginners – Part 1
Learn to understand the basic of JSX & learn to write JSX expression.
-
How to Debounce Scroll Events for Faster, Smoother Pages — jQuery, Vanilla JS & React
Every pixel you scroll can fire 100+ events per second. Left unchecked, your scroll handlers wreck frame rates, spike CPU usage, and destroy the user experience. This guide shows you how to fix it — in every major approach.