Posts

Showing posts from June, 2023

Tricks which ES6 feature should we use in javascript promises vs async await?

  Asynchronous programming is crucial for efficient web development, and JavaScript provides two popular approaches: Promises and Async/Await. In this blog post, we'll explore the differences between Promises and Async/Await and guide you on when to use each technique. By understanding their strengths, you'll be able to make informed decisions and write more maintainable code. 1. Understanding Promises: Promises are a core feature of JavaScript, enabling elegant handling of asynchronous operations. They represent the eventual completion or failure of an asynchronous task and offer methods like .then() , .catch() , and .finally() for handling results. Promises have three states: Pending : The initial state when a promise is created and hasn't been resolved or rejected. Fulfilled : The state when a promise is successfully resolved with a value. Rejected : The state when a promise fails to fulfill its intended operation, typically accompanied by a reason for rejection. Creati...

React Lifecycle in Functional Components with useEffect

Image
Hello learners, We will explore the lifecycle of a React functional component using the useEffect hook. The useEffect hook is a fundamental part of React's functional component lifecycle. In this blog post , We will understand how it can be leveraged to handle side effects and perform actions at specific points in the component's lifecycle. 1. Introduction to the useEffect Hook: Syntax: useEffect(() => { }, []); The useEffect hook allows you to perform side effects, such as data fetching, subscriptions, or manually manipulating the DOM, within a functional component. It combines the functionalities of different lifecycle methods, such as componentDidMount , componentDidUpdate , and componentWillUnmount , into a single declarative API. 2. Executing Effects on Mount ( componentDidMount ): To execute an effect only when the component mounts, you can provide an empty dependency array ( [] ) as the second argument to useEffect . This ensures that the effect is run only...