The latest articles on DEV Community by Arman Hossain Atunu (@armanhossainatunu). https://dev.to/armanhossainatunu https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1133713%2Ff0dadc1b-7c76-437c-99c1-6e664471f7ee.jpeg https://dev.to/armanhossainatunu en Arman Hossain Atunu Thu, 05 Feb 2026 19:19:44 +0000 https://dev.to/armanhossainatunu/react-context-ekttaa-sundr-duhsbpn-pee https://dev.to/armanhossainatunu/react-context-ekttaa-sundr-duhsbpn-pee <p>React Context প্রথমবার ব্যবহার করলে মনে হয়—<br> ওয়াও! আর prop drilling নেই, কোড কত পরিষ্কার!</p> <p>কিন্তু কিছুদিন পর হঠাৎ মনে হয়—<br> <strong>“এইটা আমি কী করলাম?”</strong></p> <p>React Context এমন একটা টুল যা ঠিকভাবে ব্যবহার করলে অসাধারণ,<br> আর ভুলভাবে ব্যবহার করলে ধীরে ধীরে একটা সুন্দর দুঃস্বপ্নে পরিণত হয়।</p> <p><strong>কেন React Context এত পছন্দের?</strong></p> <p>React Context মূলত একটি সমস্যার সমাধান করে—<br> কম্পোনেন্টের গভীরে গভীরে props পাঠানোর ঝামেলা।</p> <p>এটা খুব ভালো কাজ করে যখন:</p> <p>Authentication data (user, token)</p> <p>Theme (dark / light mode)</p> <p>Language বা app-level config</p> <p>এই জায়গাগুলোতে Context ব্যবহার করলে কোড হয় পরিষ্কার, readable এবং maintainable।</p> <p><strong>দুঃস্বপ্নটা শুরু হয় যেখান থেকে</strong><br> সমস্যা শুরু হয় যখন আমরা Context-কে<br> <strong>সব কিছুর জন্য ব্যবহার করা শুরু করি।</strong></p> <p>সাধারণ কিছু ভুল:</p> <p>একটা Context-এ খুব বেশি data রাখা</p> <p>ঘনঘন update হওয়া state Context-এ রাখা</p> <p>Business logic বা complex state Context দিয়ে handle করা</p> <p>ফলাফল?</p> <p>অপ্রয়োজনীয় re-render</p> <p>পারফরম্যান্স সমস্যা</p> <p>Debug করা কঠিন হয়ে যায়</p> <p>যেটা একসময় সুন্দর লাগছিল, সেটাই ভাঙা মনে হতে শুরু করে।</p> <p><strong>Context কোনো State Manager না</strong></p> <p>এটাই সবচেয়ে গুরুত্বপূর্ণ বিষয়।</p> <p>React Context আসলে একটি state sharing mechanism,<br> পূর্ণাঙ্গ state management solution নয়।</p> <p>আপনার অ্যাপে যদি থাকে:</p> <p>Complex state logic</p> <p>অনেক জায়গায় state update</p> <p>বড় scale data flow</p> <p>তাহলে Redux, Zustand, Jotai, React Query—<br> এই টুলগুলো অনেক ভালো সিদ্ধান্ত হতে পারে।</p> <p><strong>React Context সঠিকভাবে ব্যবহার করার কিছু নিয়ম</strong></p> <p>ভালো অভ্যাসগুলো:</p> <p>Context ছোট ও focused রাখুন</p> <p>একটাই বড় Context না বানিয়ে আলাদা আলাদা Context ব্যবহার করুন</p> <p>Frequently changing state Context-এ রাখবেন না</p> <p>Local state + Context একসাথে ব্যবহার করুন</p> <p>এই নিয়মগুলো মানলে Context আবার সুন্দর হয়ে ওঠে।</p> <p><strong>শেষ কথা</strong></p> <p>React Context খারাপ কিছু না।<br> এটা শক্তিশালী।</p> <p>কিন্তু সীমা না জানলে শক্তিই সমস্যার কারণ হয়।</p> <p>ঠিকভাবে ব্যবহার করলে—<br> React Context সত্যিই সুন্দর।</p> <p>আর বেশি ব্যবহার করলে—<br> স্বাগতম সেই সুন্দর দুঃস্বপ্নে।</p> react programming javascript webdev Arman Hossain Atunu Sun, 23 Mar 2025 19:31:09 +0000 https://dev.to/armanhossainatunu/useref-dom-myaanipuleshn-o-rephaarens-sttor-kraar-jny-3755 https://dev.to/armanhossainatunu/useref-dom-myaanipuleshn-o-rephaarens-sttor-kraar-jny-3755 <p><strong>useRef</strong> ইনপুট ফিল্ড ফোকাস করার জন্য ব্যবহৃত হয়েছে, যা সরাসরি DOM নোড এক্সেস করতে সহায়তা করে।<br> 📌<strong>_ সাধারণত useRef দুটি প্রধান কারণে ব্যবহার করা হয়:_</strong><br> 1️⃣ DOM ম্যানিপুলেশন করতে (যেমন ইনপুট ফিল্ড ফোকাস করা)।<br> 2️⃣ কম্পোনেন্ট রি-রেন্ডার ছাড়াই ভ্যালু সংরক্ষণ করতে।<br> <em><strong>🎯 কখন useRef ব্যবহার করবো?</strong></em><br> ✅ যখন DOM ম্যানিপুলেশন দরকার হয় (ইনপুট ফোকাস, স্ক্রল পজিশন ইত্যাদি)।<br> ✅ যখন রি-রেন্ডার এড়িয়ে ডাটা সংরক্ষণ করতে চাই।<br> ✅ যখন আগের ভ্যালু ট্র্যাক করতে চাই।</p> react frontend programming