DEV Community: Rajan lagah

What are "Effects" in react?

Rajan lagah — Wed, 04 Feb 2026 16:51:04 +0000

Before getting to Effects, you need to be familiar with two types of logic inside React components:

Rendering code lives at the top level of your component. This is where you take the props and state, transform them, and return the JSX you want to see on the screen. Rendering code must be pure. Like a math formula, it should only calculate the result, but not do anything else.
Event handlers are nested functions inside your components that do things rather than just calculate them. An event handler might update an input field, submit an HTTP POST request to buy a product, or navigate the user to another screen. Event handlers contain “side effects” (they change the program’s state) caused by a specific user action (for example, a button click or typing).

Sometimes this isn’t enough. Consider a ChatRoom component that must connect to the chat server whenever it’s visible on the screen. Connecting to a server is not a pure calculation (it’s a side effect) so it can’t happen during rendering. However, there is no single particular event like a click that causes ChatRoom to be displayed.

Effects let you specify side effects that are caused by rendering itself, rather than by a particular event. Sending a message in the chat is an event because it is directly caused by the user clicking a specific button. However, setting up a server connection is an Effect because it should happen no matter which interaction caused the component to appear. Effects run at the end of a commit after the screen updates. This is a good time to synchronize the React components with some external system (like network or a third-party library).

Instant AI Text Enhancements in React with prompt-my-client-react

Rajan lagah — Sun, 31 Aug 2025 16:40:58 +0000

TL;DR
Add AI-powered text transformations—like polish, paraphrase, or translate—to your React app in under 5 minutes using prompt-my-client-react.

Why It’s Awesome
Ready-to-use dropdown UI or hook (usePrompt) for programmatic control
Minimal setup: just install and import
Highly customizable prompts, styling, and callbacks

Super-Easy Setup
npm install prompt-my-client-react

Option A: Use the Hook

import { usePrompt } from 'prompt-my-client-react';

const { generatePrompt, isLoading, result } = usePrompt({
  onSuccess: (response) => setText(response),
});

await generatePrompt(text, "Make this more professional");

Option B: Use the Dropdown

import { AIDropDown } from 'prompt-my-client-react';

<AIDropDown
  text={text}
  aiResponseCallback={(resp) => setText(resp)}
/>

Use Cases

Chat apps that paraphrase or translate
E-commerce product description enhancers
Internal tools: meeting note summarizers, style improvers, and more!

Final Thoughts

If you’re building in React and want AI-powered text features in a snap, check out prompt-my-client-react. Smart apps, no heavy lifting.

🚀 𝗚𝗼 𝘃𝘀. 𝗡𝗼𝗱𝗲.𝗷𝘀 – 𝗦𝘁𝗿𝗲𝘀𝘀 𝗧𝗲𝘀𝘁𝗶𝗻𝗴!

Rajan lagah — Wed, 02 Apr 2025 05:15:11 +0000

Stress Testing a Go and NodeJS Server

𝗧𝗲𝘀𝘁 𝗦𝗲𝘁𝘂𝗽
• EC2 Instance: t3.micro on AWS
• Deployment: Elastic Beanstalk
• Database: Same RDS PostgreSQL instance for both servers

Test 1: 200 users, 1000 requests
Test 2: 200 users, 5000 requests
Test 3: 1000 users, 5000 requests
Test 4: 1000 users, 7000 requests

𝗥𝗲𝘀𝘂𝗹𝘁𝘀 📊
𝗡𝗼𝗱𝗲.𝗷𝘀
• Avg. resource utilization: 5.67%
• API failures: ~300
𝗚𝗼
• Avg. resource utilization: 2.34%
• API failures: 20
watch a full comparison video https://lnkd.in/ghBaJUBj

𝗧𝗮𝗸𝗲𝗮𝘄𝗮𝘆
Go’s efficiency in handling concurrent requests really shines here, using fewer resources and reducing API failures significantly. This test reinforces why Go is a top choice for high-performance, scalable backend systems.

What’s your take on Go vs. Node.js for backend development? Let’s discuss in the comments! 👇

💡 Want to master Go and build ultra-fast web servers?
Check out my Udemy course here: 👉 https://lnkd.in/ghBaJUBj

NodeJS vs GoLang #1

Rajan lagah — Tue, 11 Mar 2025 05:58:04 +0000

Stress Testing a Nodejs and Go Server using the hey CLI tool.

📝 Case
• 1000 online users
• 2000 concurrent requests
• on a AWS t3.micro EC2 instance
• get a request with a simple Select query.
• same Postgres database on AWS RDS.

NodeJS Server
While it handled the load decently, 15 requests failed with a 502 error, and the total execution time was 2.4 seconds. All other 1985 requests pass successfully

GO Server
🔥 Go handled ALL requests with a 200 response!
⏳ Total time?𝟭.𝟮 𝘀𝗲𝗰, Less than half of what Node.js took!

This proves why Go is a powerhouse for building high-performance, scalable servers. 🚀
Check out the image for the detailed results! 📊

𝗕𝘂𝘁 𝘄𝗲’𝗿𝗲 𝗻𝗼𝘁 𝗱𝗼𝗻𝗲 𝘆𝗲𝘁!
💡 In the next round, we’ll run the test with medium-level traffic: 100 users sending 1000 requests. Also, check cases where NodeJS outperforms GO. Are you curious to see how both perform under different scenarios? Stay tuned! 𝘛𝘳𝘶𝘴𝘵 𝘮𝘦 𝘵𝘩𝘪𝘯𝘨𝘴 𝘸𝘪𝘭𝘭 𝘨𝘦𝘵 𝘤𝘳𝘢𝘻𝘪𝘦𝘳.

What are your thoughts on Go vs. Node.js for backend performance? Let’s discuss in the comments! 👇

P.S. Want to master Go and build ultra-fast web servers? Check out my Go Course on Udemy: https://www.udemy.com/course/go-web-development-create-powerful-servers-with-golang/?referralCode=EA9B71B7323D2C5D1071.

Issues with useEffect

Rajan lagah — Thu, 04 Aug 2022 17:47:02 +0000

If you are react dev you surely encounter multiple use cases for useEffect. But let me show how useEffect is tricking you all these times.

You want some function to run when component mounts

useEffect(() => ...fn() )

Everything is good here.

But now you want function to run when some specific state value is changed

 const [data, setData] = useState("");
 useEffect(() => {
    console.log("Running useEffect");
  }, [data]);

our expectation is that this function will run when data is changed.

Check this small example. Here we can see that useEffect callback ran even if I don't change data.
That is because useEffect will run at least once on component mount.

So what is fix here?
We all use this to make some api calls and do some critical work and due to this behaviour of useEffect we can face bugs or performance issue.

So to run it only when data is changed we can.

import { useState, useEffect, useRef } from "react";

export function App() {
  const isMounted = useRef(false);
  const [data, setData] = useState("");
  useEffect(() => {
    if (isMounted.current) {
      console.log("HERE");
    } else {
      isMounted.current = true;
    }
  }, [data]);
  return (
    <div>
      <input
        onChange={(e) => setData(e.target.value)}
        placeholder="First name"
      />
    </div>
  );
}

Now in the console you will not see HERE on mount.

Notice here we are using useRef specifically so that on re-render value of isMounted persist else with simple js variable it will keep reseting on every mount.

Hit like if you have learned something awesome.

Web3 connecting wallet

Rajan lagah — Sun, 29 May 2022 09:29:28 +0000

Utility function for reference

import Web3 from "web3";

const getWeb3 = () => {
  return new Promise((resolve, reject) => {
    // Wait for loading completion to avoid race conditions with web3 injection timing.
    window.addEventListener("load", async () => {
      // Modern dapp browsers...
      if (window.ethereum) {
        const web3 = new Web3(window.ethereum);
        try {
          // Request account access if needed
          await window.ethereum.enable();
          // Acccounts now exposed
          resolve(web3);
        } catch (error) {
          reject(error);
        }
      }
      // Legacy dapp browsers...
      else if (window.web3) {
        // Use Mist/MetaMask's provider.
        const web3 = window.web3;
        console.log("Injected web3 detected.");
        resolve(web3);
      }
      // Fallback to localhost; use dev console port by default...
      else {
        const provider = new Web3.providers.HttpProvider(
          "http://localhost:9545"
        );
        const web3 = new Web3(provider);
        console.log("No web3 instance injected, using Local web3.");
        resolve(web3);
      }
    });
  });
};

export { getWeb3 };

Change http://localhost:9545 if required.

Connecting to contract

const web3 = await getWeb3();
const accounts = await web3.eth.getAccounts();
const networkId = await web3.eth.net.getId();
const deployedNetwork = Multisig.networks[networkId];
const contract = new web3.eth.Contract(
        Multisig.abi,
        deployedNetwork && deployedNetwork.address,
      );

Solidity

Rajan lagah — Wed, 25 May 2022 13:14:01 +0000

Multiple deeds

pragma solidity ^0.5.0;

  contract SplitDeed {
    address payable public benificiary;
    uint256 public transferDate;
    address lawyer;`

   constructor(
        address _lawyer,
        address payable _benificiary,
        uint _transferDate
    )
        payable // Allow to send ether on creation of contract
        public
    {
        lawyer = _lawyer;
        benificiary = _benificiary;
        transferDate = _transferDate;

    }

    function withdraw() public{
        require(msg.sender == lawyer, "Lawyer only");
        require(now > transferDate, " Too early ");
        benificiary.transfer(address(this).balance);
    }
}

Escrow

pragma solidity ^0.5.2;

contract Escrow{
    address payable public dev;
    address public website;
    address public customer;
    uint public amount;

    constructor( address payable _dev, address _customer,uint _amount) public {
        dev = _dev;
        website = msg.sender;
        customer = _customer;
        amount = _amount;

    }

    function deposit() payable public{
        require(msg.sender == customer, "Only customer can add money");
        require(address(this).balance <= amount, "Money can not exceed given amount");
    }

    function sendMoney() public{
        require(msg.sender == website, "Only website can transfer money");
        require(address(this).balance == amount, "Amount not proper"); 
        dev.transfer(address(this).balance);
    }

    function getBalance() view public returns(uint){
        return address(this).balance;
    }

}