<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: DEBOS DAS</title>
    <description>The latest articles on DEV Community by DEBOS DAS (@debos_das_9a77be9788e2d6e).</description>
    <link>https://dev.to/debos_das_9a77be9788e2d6e</link>
    <image>
      <url>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%2F1700968%2Fc4f959e5-1488-49b2-8c1b-3ae80ea70910.jpg</url>
      <title>DEV Community: DEBOS DAS</title>
      <link>https://dev.to/debos_das_9a77be9788e2d6e</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/debos_das_9a77be9788e2d6e"/>
    <language>en</language>
    <item>
      <title>what is hoisting in javascript?</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sat, 22 Feb 2025 10:50:25 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/what-is-hoisting-in-javascript-152c</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/what-is-hoisting-in-javascript-152c</guid>
      <description>&lt;ul&gt;
&lt;li&gt;Hoisting is a variable or function's default behavior before declaring in the code. example
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;getName();
console.log(x);

var x = 7;

function getName() {
    console.log("Namaste Javascript");
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
    </item>
    <item>
      <title>জাভাস্ক্রিপ্ট শেখার জন্য ১ বছরের পরিকল্পনা;</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sat, 22 Feb 2025 08:56:16 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/jaabhaaskriptt-shekhaar-jny-1-bchrer-priklpnaa-42e2</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/jaabhaaskriptt-shekhaar-jny-1-bchrer-priklpnaa-42e2</guid>
      <description>&lt;p&gt;জাভাস্ক্রিপ্ট শেখার জন্য ১ বছরের পরিকল্পনা;&lt;/p&gt;

&lt;h2&gt;
  
  
  এই PLAN (পরিকল্পনা) আপনাকে একটি শক্ত ফাউন্ডেশন  গড়ে তুলতে, ব্যবহারিক অভিজ্ঞতা অর্জন করতে এবং শেষ পর্যন্ত ভাষাটি আয়ত্ত করতে সাহায্য করবে। নিচে একটি কাঠামোগত, স্টেপ বাই স্টেপ পরিকল্পনা দেওয়া হলো যা তত্ত্ব, অনুশীলন এবং বাস্তব-বিশ্বের প্রজেক্ট গুলির মধ্যে ভারসাম্য বজায় রাখবে।
&lt;/h2&gt;

&lt;h3&gt;
  
  
  পর্ব ১: বেসিক ফাউন্ডেশন (১–৩ মাস)
&lt;/h3&gt;

&lt;p&gt;.&lt;br&gt;
লক্ষ্য: জাভাস্ক্রিপ্টের বেসিক এবং এটি কীভাবে কাজ করে তা বোঝা।&lt;/p&gt;

&lt;h4&gt;
  
  
  ১ম মাস: জাভাস্ক্রিপ্টের বেসিক:
&lt;/h4&gt;

&lt;p&gt;.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;জাভাস্ক্রিপ্ট কী? (ইতিহাস, উদ্দেশ্য এবং ব্যবহারের ক্ষেত্র)&lt;/li&gt;
&lt;li&gt;আপনার পরিবেশ সেট আপ করা (ব্রাউজার কনসোল, টেক্সট এডিটর, Node.js)&lt;/li&gt;
&lt;li&gt;ভেরিয়েবল (&lt;code&gt;let&lt;/code&gt;, &lt;code&gt;const&lt;/code&gt;, &lt;code&gt;var&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;ডেটা টাইপ (স্ট্রিং, সংখ্যা, বুলিয়ান, অবজেক্ট, অ্যারে, &lt;code&gt;null&lt;/code&gt;, &lt;code&gt;undefined&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;অপারেটর (গাণিতিক, তুলনা, লজিক্যাল)&lt;/li&gt;
&lt;li&gt;বেসিক ইনপুট/আউটপুট (&lt;code&gt;alert&lt;/code&gt;, &lt;code&gt;prompt&lt;/code&gt;, &lt;code&gt;console.log&lt;/code&gt;)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;সহজ প্রোগ্রাম লিখুন (যেমন, ক্যালকুলেটর, তাপমাত্রা কনভার্টার)।&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.freecodecamp.org/" rel="noopener noreferrer"&gt;freeCodeCamp&lt;/a&gt; বা &lt;a href="https://www.codewars.com/" rel="noopener noreferrer"&gt;Codewars&lt;/a&gt;-এর মতো প্ল্যাটফর্মে বিগিনার-লেভেল কোডিং চ্যালেঞ্জ সমাধান করুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://developer.mozilla.org/.../docs/Web/JavaScript/Guide" rel="noopener noreferrer"&gt;MDN-এ জাভাস্ক্রিপ্ট বেসিক&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;FreeCodeCamp-এর জাভাস্ক্রিপ্ট কোর্স।
#### ২য় মাস: কন্ট্রোল ফ্লো এবং ফাংশন&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;কন্ডিশনাল স্টেটমেন্ট (&lt;code&gt;if&lt;/code&gt;, &lt;code&gt;else&lt;/code&gt;, &lt;code&gt;switch&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;লুপ (&lt;code&gt;for&lt;/code&gt;, &lt;code&gt;while&lt;/code&gt;, &lt;code&gt;do...while&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;ফাংশন (ডিক্লারেশন, এক্সপ্রেশন, অ্যারো ফাংশন)&lt;/li&gt;
&lt;li&gt;স্কোপ (গ্লোবাল বনাম লোকাল)&lt;/li&gt;
&lt;li&gt;বেসিক এরর হ্যান্ডলিং (&lt;code&gt;try...catch&lt;/code&gt;)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;একটি সংখ্যা অনুমান করার গেম তৈরি করুন।&lt;/li&gt;
&lt;li&gt;ফিবোনাচি সিকোয়েন্স জেনারেট করার প্রোগ্রাম তৈরি করুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://eloquentjavascript.net/" rel="noopener noreferrer"&gt;Eloquent JavaScript (অধ্যায় ১–৩)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;JavaScript30 (প্রথম কয়েকটি চ্যালেঞ্জ)।
#### ৩য় মাস: ডেটা নিয়ে কাজ&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;অ্যারে (&lt;code&gt;push&lt;/code&gt;, &lt;code&gt;pop&lt;/code&gt;, &lt;code&gt;map&lt;/code&gt;, &lt;code&gt;filter&lt;/code&gt;, &lt;code&gt;reduce&lt;/code&gt;-এর মতো মেথড)&lt;/li&gt;
&lt;li&gt;অবজেক্ট (প্রোপার্টি, মেথড, &lt;code&gt;this&lt;/code&gt; কীওয়ার্ড)&lt;/li&gt;
&lt;li&gt;JSON (পার্সিং এবং স্ট্রিংগিফাই)&lt;/li&gt;
&lt;li&gt;বেসিক DOM ম্যানিপুলেশন (এলিমেন্ট সিলেক্ট করা, কন্টেন্ট পরিবর্তন করা, ইভেন্ট)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;একটি টু-ডু লিস্ট অ্যাপ তৈরি করুন।&lt;/li&gt;
&lt;li&gt;ডেটা ফিল্টার এবং সর্ট করার প্রোগ্রাম তৈরি করুন (যেমন, বইয়ের তালিকা)।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://javascript.info/" rel="noopener noreferrer"&gt;JavaScript.info&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
   - FreeCodeCamp-এর DOM ম্যানিপুলেশন সেকশন।
&lt;/h2&gt;

&lt;h3&gt;
  
  
  পর্ব ২: ইন্টারমিডিয়েট দক্ষতা (৪–৬ মাস)
&lt;/h3&gt;

&lt;p&gt;লক্ষ্য: জাভাস্ক্রিপ্টের গভীরে যাওয়া এবং ইন্টারঅ্যাক্টিভ প্রজেক্ট  তৈরি শুরু করা।&lt;/p&gt;

&lt;h4&gt;
  
  
  ৪র্থ মাস: অ্যাডভান্সড ফাংশন এবং ধারণা
&lt;/h4&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;ক্লোজার&lt;/li&gt;
&lt;li&gt;হায়ার-অর্ডার ফাংশন&lt;/li&gt;
&lt;li&gt;কলব্যাক&lt;/li&gt;
&lt;li&gt;Immediately Invoked Function Expressions (IIFE)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;ডায়নামিক প্রশ্ন এবং উত্তর সহ একটি কুইজ অ্যাপ তৈরি করুন।&lt;/li&gt;
&lt;li&gt;প্রাইভেট ডেটা ম্যানেজ করার জন্য ক্লোজার ব্যবহার করে একটি প্রোগ্রাম তৈরি করুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://github.com/getify/You-Dont-Know-JS" rel="noopener noreferrer"&gt;You Don’t Know JS: Scope &amp;amp; Closures&lt;/a&gt;
#### ৫ম মাস: অ্যাসিঙ্ক্রোনাস জাভাস্ক্রিপ্ট&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;কলব্যাক&lt;/li&gt;
&lt;li&gt;প্রমিস&lt;/li&gt;
&lt;li&gt;&lt;code&gt;async/await&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;Fetch API (HTTP রিকোয়েস্ট করা)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;একটি পাবলিক API ব্যবহার করে একটি ওয়েদার অ্যাপ তৈরি করুন।&lt;/li&gt;
&lt;li&gt;JSON ফাইল থেকে ডেটা ফেচ করে প্রদর্শন করার প্রোগ্রাম তৈরি করুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://javascript.info/async" rel="noopener noreferrer"&gt;JavaScript.info: Async&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;FreeCodeCamp-এর API প্রজেক্ট ।
#### ৬ষ্ঠ মাস: ES6+ ফিচার&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;let&lt;/code&gt; এবং &lt;code&gt;const&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;টেমপ্লেট লিটারাল&lt;/li&gt;
&lt;li&gt;ডেস্ট্রাকচারিং&lt;/li&gt;
&lt;li&gt;স্প্রেড/রেস্ট অপারেটর&lt;/li&gt;
&lt;li&gt;মডিউল (&lt;code&gt;import&lt;/code&gt;/&lt;code&gt;export&lt;/code&gt;)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;পুরানো প্রজেক্ট গুলি ES6+ ফিচার ব্যবহার করে রিফ্যাক্টর করুন।&lt;/li&gt;
&lt;li&gt;একটি বাজেট ট্র্যাকার অ্যাপ তৈরি করুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;h2&gt;
  
  
   - &lt;a href="https://es6.io/" rel="noopener noreferrer"&gt;ES6 for Everyone&lt;/a&gt; (Wes Bos-এর পেইড কোর্স)।
&lt;/h2&gt;

&lt;h3&gt;
  
  
  পর্ব ৩: অ্যাডভান্সড টপিক (৭–৯ মাস)
&lt;/h3&gt;

&lt;p&gt;লক্ষ্য: জাভাস্ক্রিপ্টের অ্যাডভান্সড ধারণাগুলি আয়ত্ত করা এবং বড় প্রজেক্ট ে কাজ শুরু করা।&lt;/p&gt;

&lt;h4&gt;
  
  
  ৭ম মাস: অবজেক্ট-ওরিয়েন্টেড প্রোগ্রামিং (OOP)
&lt;/h4&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;ক্লাস এবং ইনহেরিটেন্স&lt;/li&gt;
&lt;li&gt;প্রোটোটাইপ এবং প্রোটোটাইপ চেইন&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;this&lt;/code&gt; কীওয়ার্ড গভীরভাবে&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;OOP নীতিগুলি ব্যবহার করে একটি লাইব্রেরি ম্যানেজমেন্ট সিস্টেম তৈরি করুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://eloquentjavascript.net/" rel="noopener noreferrer"&gt;Eloquent JavaScript (অধ্যায় ৬)&lt;/a&gt;
#### ৮ম মাস: ফাংশনাল প্রোগ্রামিং&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;পিওর ফাংশন&lt;/li&gt;
&lt;li&gt;ইমিউটেবিলিটি&lt;/li&gt;
&lt;li&gt;রিকার্শন&lt;/li&gt;
&lt;li&gt;হায়ার-অর্ডার ফাংশন (পুনরায় দেখা)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;রিকার্শন ব্যবহার করে সমস্যা সমাধানের প্রোগ্রাম তৈরি করুন (যেমন, ফ্যাক্টোরিয়াল, ফিবোনাচি)।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.freecodecamp.org/.../functional-programming.../" rel="noopener noreferrer"&gt;জাভাস্ক্রিপ্টে ফাংশনাল প্রোগ্রামিং&lt;/a&gt;
#### ৯ম মাস: ডিবাগিং এবং টেস্টিং&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;ডিবাগিং টুল (ব্রাউজার DevTools, &lt;code&gt;console&lt;/code&gt; মেথড)&lt;/li&gt;
&lt;li&gt;ইউনিট টেস্ট লেখা (Jest, Mocha)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;পুরানো প্রজেক্ট গুলি ডিবাগ এবং রিফ্যাক্টর করুন।&lt;/li&gt;
&lt;li&gt;আপনার বিদ্যমান কোডের জন্য টেস্ট লিখুন।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;h2&gt;
  
  
   - &lt;a href="https://jestjs.io/docs/getting-started" rel="noopener noreferrer"&gt;জাভাস্ক্রিপ্ট টেস্টিং ইন্ট্রোডাকশন&lt;/a&gt;
&lt;/h2&gt;

&lt;h3&gt;
  
  
  পর্ব ৪: বাস্তব-বিশ্বের প্রজেক্ট  (১০–১২ মাস)
&lt;/h3&gt;

&lt;p&gt;লক্ষ্য: পোর্টফোলিও-যোগ্য প্রজেক্ট  তৈরি করা এবং চাকরির জন্য প্রস্তুত হওয়া।&lt;/p&gt;

&lt;h4&gt;
  
  
  ১০ম মাস: একটি ফুল-স্ট্যাক প্রজেক্ট  তৈরি করুন
&lt;/h4&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;Node.js এবং Express.js-এর বেসিক&lt;/li&gt;
&lt;li&gt;ফ্রন্টএন্ড এবং ব্যাকএন্ড সংযোগ করা&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;একটি ফুল-স্ট্যাক অ্যাপ তৈরি করুন (যেমন, একটি ব্লগ বা ই-কমার্স সাইট)।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/playlist..." rel="noopener noreferrer"&gt;The Net Ninja-এর Node.js টিউটোরিয়াল&lt;/a&gt;
#### ১১তম মাস: একটি ফ্রন্টএন্ড ফ্রেমওয়ার্ক শিখুন (React)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;যা শিখবেন:

&lt;ul&gt;
&lt;li&gt;React বেসিক (কম্পোনেন্ট, স্টেট, প্রপস)&lt;/li&gt;
&lt;li&gt;React হুক (&lt;code&gt;useState&lt;/code&gt;, &lt;code&gt;useEffect&lt;/code&gt;)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;অনুশীলন:

&lt;ul&gt;
&lt;li&gt;একটি React অ্যাপ তৈরি করুন (যেমন, একটি API ব্যবহার করে মুভি সার্চ অ্যাপ)।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://reactforbeginners.com/" rel="noopener noreferrer"&gt;React for Beginners&lt;/a&gt;
#### ১২তম মাস: পোলিশ এবং চাকরির প্রস্তুতি&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;কাজ:

&lt;ul&gt;
&lt;li&gt;আপনার পোর্টফোলিও ওয়েবসাইট পোলিশ করুন।&lt;/li&gt;
&lt;li&gt;GitHub-এ ওপেন-সোর্স প্রজেক্ট এ অবদান রাখুন।&lt;/li&gt;
&lt;li&gt;কোডিং ইন্টারভিউ প্রশ্ন অনুশীলন করুন (LeetCode, HackerRank)।&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;রিসোর্স  :

&lt;h2&gt;
  
  
   - &lt;a href="https://github.com/sudheerj/javascript-interview-questions" rel="noopener noreferrer"&gt;জাভাস্ক্রিপ্ট ইন্টারভিউ প্রিপ&lt;/a&gt;
&lt;/h2&gt;

&lt;h3&gt;
  
  
  অতিরিক্ত টিপস
&lt;/h3&gt;


&lt;/li&gt;

&lt;li&gt;সঙ্গতি: প্রতিদিন অন্তত ১–২ ঘন্টা শেখা এবং অনুশীলনের জন্য ব্যয় করুন।&lt;/li&gt;

&lt;li&gt;প্রজেক্ট : আপনার পোর্টফোলিওতে প্রদর্শনের জন্য অন্তত ৫–১০টি প্রজেক্ট  তৈরি করুন।&lt;/li&gt;

&lt;li&gt;সম্প্রদায়: Stack Overflow, Reddit, বা Discord গ্রুপে যোগ দিন সহায়তার জন্য।&lt;/li&gt;

&lt;li&gt;রিভিউ: নিয়মিত পুরানো কোড রিভিউ এবং রিফ্যাক্টর করুন শেখাকে শক্তিশালী করতে।
এই পরিকল্পনা অনুসরণ করে, আপনি জাভাস্ক্রিপ্টের একটি শক্ত ভিত্তি পাবেন এবং বাস্তব-বিশ্বের চ্যালেঞ্জ মোকাবেলা করতে বা এমনকি একজন জাভাস্ক্রিপ্ট ডেভেলপার হিসেবে চাকরি পেতে প্রস্তুত হবেন!&lt;/li&gt;

&lt;/ul&gt;

</description>
    </item>
    <item>
      <title>Javascript Function</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Thu, 20 Feb 2025 11:32:34 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/javascript-function-26h2</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/javascript-function-26h2</guid>
      <description>&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var n = 2;
function squere(ab) {
    var ans = ab * ab;
    return ans;
}
console.log(squere(2));
console.log(squere(3));
console.log(squere(5));

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;// javascript is single threaded&lt;br&gt;
// javascript is synchronous&lt;br&gt;
// javascript is dynamic&lt;br&gt;
// javascript is weakly typed&lt;br&gt;
// javascript&lt;br&gt;
// It is known as  call stack, Execution contact stack, Program Stack, Control stack, Execution stack, Run-time stack, Machine stack&lt;br&gt;
// It is a data structure which record the function call&lt;br&gt;
// It is a stack data structure&lt;br&gt;
// It is a LIFO data structure&lt;br&gt;
// It is a stack of frames&lt;br&gt;
// It is a stack of function call&lt;br&gt;
// It is a stack of execution context&lt;br&gt;
// It is a stack of execution context object&lt;br&gt;
// It is a stack of lexical environment&lt;/p&gt;

</description>
    </item>
    <item>
      <title>সফটওয়্যার ফিল্ডে জব</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sun, 15 Sep 2024 19:00:53 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/sphttoyyyaar-phildde-jb-3o2o</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/sphttoyyyaar-phildde-jb-3o2o</guid>
      <description>&lt;p&gt;যারা ইউএসএতে হায়ার স্টাডির পর সফটওয়্যার ফিল্ডে জব খুঁজে নিতে চান তাদের জন্য কিছু লেখা যায়। দুই বছর আগে আমি এই সময় সকল বড় কোম্পানিতে ইন্টারভিউ দিয়েছিলাম সফটওয়্যার ইঞ্জিনিয়ার পজিশনের জন্য। কিছু এডভাইস আমি নিজের অভিজ্ঞতা থেকে দিতে পারি:&lt;br&gt;
১) প্রথম কথা হল কি জব চাই আর কি কি পজিশন এ এপ্লাই করতে চান আগে থেকে ফিক্স করুন। মানে একই সাথে একাডেমিয়া, ইন্ডাস্ট্রি, পোস্টডক সব জবে এপ্লাই মানে হল একসাথে দুই তিন নৌকায় পা দেওয়া।&lt;br&gt;
২) যদি প্রোগ্রামিং বেইজড জবে এপ্লাই করতে চান তাহলে ইন্টারভিউতে অবশ্যই প্রোগ্রামিং প্রব্লেম সলভ করতে দেবে। তাই আগে থেকে ভাল প্রিপারেশন নিতে হবে। মোটামুটি ৬ মাস থেকে প্লান করে প্রিপারেশন নেয়া সেইফ। &lt;br&gt;
৩) প্রোগ্রামিং ইন্টারভিউ প্রাকটিসের জন্য বেশ কিছু ভাল প্লাটফর্ম আছে। সবচেয়ে পপুলার হল লিটকোড ডট কম। এখানে নিয়মিত প্রাকটিস করলে আসল ইন্টারভিউতে অনেকটা কাছাকাছি প্রশ্ন পাওয়ার সম্ভাবনা রয়েছে। এছাড়াও অনেকে ইন্টারভিউবিট, হ্যাকারর‍্যাংক ইত্যাদি থেকে প্রাকটিস করতে পারে। এগুলোও ভাল।&lt;br&gt;
৪) লিটকোড এ তিন টাইপের কাঠিন্যের প্রব্লেম আছে: ইজি, মিডিয়াম, এবং হার্ড। ইজি প্রব্লেম দিয়ে শুরু করা উচিত। ইজিতে ইজি ফিল করলে মিডিয়াম ধরা উচিত। যখন মিডিয়াম প্রব্লেম এ ইজি ফিল হবে তখন আপনি ইন্টারভিউ এর জন্য প্রস্তুত। হার্ড প্রব্লেম পরীক্ষায় অনেক কম আসে আর অনেকটা মেমরি টেস্ট হল হার্ড প্রব্লেম তাই সবার শেষ এ মোস্ট কমন কিছু হার্ড প্রব্লেম করা যেতে পারে। &lt;br&gt;
৫) ইন্টারভিউ এর জন্য টাইমিং প্রাকটিস করা খুব জরুরী। ধরুন আপনি সব প্রব্লেমই পারেন কিন্তু সময় লাগে সবসময়ই ৩০ মিনিটের বেশি তাহলে প্রব্লেম। আপনাকে ইজি প্রব্লেম ১০ মিনিটের ভিতর এবং মিডিয়াম প্রব্লেম ১৫-২০ মিনিটের ভিতর কোড করে মিলানোর এবিলিটি থাকতে হবে। &lt;br&gt;
৬) ইন্টারভিউ এর সময় ইন্টেলিজেন্ট আইডিই বা  কম্পাইলার দেয়া হবে না আপনাকে কোড করার জন্য। প্লেইন নোটপ্যাডে কোড করার প্রাকটিস করুন।&lt;br&gt;
৭) ইন্টারভিউ এর জাজমেন্ট হয় কয়েক রকমভাবে। আপনার কোড কতখানি রিডেবল মানে ভ্যারিয়েবল ফাংশনের নামকরণ, কোড এর স্ট্রাকচার কতখানি বোধগম্য, আপনার সল্যুশন সকল কেইসে কারেক্ট কিনা, এবং আপনার দেয়া সল্যুশন এর এলগরিদম বেস্ট বা সেমিবেস্ট কিনা। &lt;br&gt;
৮) ইন্টারভিউয়ার এর কাছে ইন্টারভিউ প্রব্লেম শোনার সাথে সাথে নিজে থেকে কিছু প্রশ্ন করা উচিত: আপনার সল্যুশন এর এক্সপেক্টেড রানটাইম এবং মেমরি ইউজ এর লিমিট কি কি, ইনপুট এর রেঞ্জটা এক্ষেত্রে বেশ কাজে দেয় তাই ওইটা জেনে নিলেও আইডিয়া পাওয়া যায়। &lt;br&gt;
৯) ইন্টারভিউ এর শুরুতে বা শেষে কিছু এটিচিউড টাইপ প্রশ্ন করে যেমন, তোমার করা একটি চ্যালেঞ্জিং প্রোগ্রামিং প্রজেক্ট এর কথা বল, কি কি চ্যালেঞ্জ ফেইস করেছিলে এবং কিভাবে সলভ করেছিলে। এই টাইপের কমন বিহাভিওরাল প্রশ্নের আগে থেকে প্রিপারেশন নেয়া উচিত। হঠাৎ করে আন্দাজে উত্তর দিলে বাজে ইম্প্রেশন তৈরি হতে পারে। &lt;br&gt;
১০) বাংলাদেশ থেকে আমার কাছে ইউএসএতে ইন্টারভিউ ক্রাক করা ব্যক্তিগতভাবে কঠিন মনে হয়েছে। বেশ সিরিয়াস প্রিপারেশন নেয়া উচিৎ নাহলে জাস্ট লাকি হওয়ার আশায় বসে থাকতে হবে। &lt;br&gt;
আজ এ পর্যন্তই। কারো বিগটেকে ইন্টারভিউ সংক্রান্ত প্রশ্ন থাকলে কমেন্ট করে জানাতে পারেন। আমি যথাসাধ্য উত্তর দেয়ার চেষ্টা করব।&lt;/p&gt;

</description>
    </item>
    <item>
      <title>ডেটা স্ট্রাকচার এবং অ্যালগরিদম উইথ জাভাস্ক্রিপ্ট</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Thu, 12 Sep 2024 17:50:01 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/ddettaa-sttraakcaar-ebn-ayaalgridm-uith-jaabhaaskriptt-pmp</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/ddettaa-sttraakcaar-ebn-ayaalgridm-uith-jaabhaaskriptt-pmp</guid>
      <description>&lt;p&gt;যদি সময় করতে না চাও "লস", টুডূ লিস্ট ধরে হয়ে যাও "বস" । ডেটা স্ট্রাকচার এবং অ্যালগরিদম উইথ জাভাস্ক্রিপ্ট এর বস হতে চাইলে এই পোষ্টটি রেখে দাও টাইমলাইনে । &lt;br&gt;
ধাপ ১: ডেটা স্ট্রাকচার এবং অ্যালগরিদমের পরিচিতি&lt;br&gt;
◼️ডেটা স্ট্রাকচার এবং অ্যালগরিদম কী?&lt;br&gt;
◼️ সমস্যার সমাধানে DSA এর গুরুত্ব।&lt;br&gt;
◼️টাইম এবং স্পেস কমপ্লেক্সিটি (Big O Notation)।&lt;br&gt;
◼️ টুল এবং ইনভাইরনমেন্ট সেটআপ (Node.js, JavaScript এর বেসিক)।&lt;br&gt;
ধাপ ২: অ্যারে&lt;br&gt;
◼️ অ্যারে পরিচিতি।&lt;br&gt;
◼️ অ্যারে অপারেশন (ইনসারশন, ডিলিশন, সার্চিং, আপডেট)।&lt;br&gt;
◼️ টু-ডাইমেনশনাল অ্যারে।&lt;br&gt;
◼️ অ্যারে ভিত্তিক সমস্যার সমাধান (যেমন ম্যাক্সিমাম মিনিমাম খুঁজে বের করা, অ্যারে রোটেট ইত্যাদি )।&lt;br&gt;
ধাপ ৩: স্ট্রিং&lt;br&gt;
◼️ স্ট্রিং পরিচিতি&lt;br&gt;
◼️ স্ট্রিং ম্যানিপুলেশন (কনক্যাটিনেশন, স্লাইসিং, সার্চিং, রিপ্লেসিং)&lt;br&gt;
◼️ প্যালিনড্রোম চেকিং&lt;br&gt;
◼️ স্ট্রিং প্যাটার্ন ম্যাচিং (যেমন সাবস্ট্রিং সার্চ)&lt;br&gt;
◼️ স্ট্রিং ভিত্তিক সমস্যা (যেমন লংগেস্ট কমন প্রিফিক্স, অ্যানাগ্রাম চেক)&lt;br&gt;
ধাপ ৪: লিংকড লিস্ট&lt;br&gt;
◼️ লিংকড লিস্ট পরিচিতি (Singly, Doubly)&lt;br&gt;
◼️ লিংকড লিস্ট অপারেশন (ইনসারশন, ডিলিশন, ট্রাভার্সাল)&lt;br&gt;
◼️ সার্কুলার লিংকড লিস্ট&lt;br&gt;
◼️ লিংকড লিস্ট ভিত্তিক সমস্যা (যেমন লিংকড লিস্ট রিভার্স করা, লুপ ডিটেকশন)&lt;br&gt;
ধাপ ৫: স্ট্যাক&lt;br&gt;
◼️ স্ট্যাক ডেটা স্ট্রাকচারের পরিচিতি&lt;br&gt;
◼️ স্ট্যাক অপারেশন (পুশ, পপ, পীক)&lt;br&gt;
◼️ স্ট্যাক এর প্রয়োগ (যেমন ব্যালেন্সড প্যারেথেসিস, ইনফিক্স টু পোস্টফিক্স কনভার্সন)&lt;br&gt;
◼️ স্ট্যাক ভিত্তিক সমস্যা (যেমন পোস্টফিক্স এক্সপ্রেশন )&lt;br&gt;
ধাপ ৬: কিউ&lt;br&gt;
◼️ কিউ ডেটা স্ট্রাকচারের পরিচিতি&lt;br&gt;
◼️ কিউ অপারেশন (এনকিউ, ডিকিউ, ফ্রন্ট, রিয়ার)&lt;br&gt;
◼️ সার্কুলার কিউ&lt;br&gt;
◼️ ডেক (ডাবল-এন্ডেড কিউ)&lt;br&gt;
◼️ কিউ ভিত্তিক সমস্যা (যেমন দুটি স্ট্যাক ব্যবহার করে কিউ ইমপ্লিমেন্ট করা)&lt;br&gt;
ধাপ ৭: রিকার্শন&lt;br&gt;
◼️ রিকার্শন পরিচিতি&lt;br&gt;
◼️ বেস কেস এবং রিকার্সিভ কেস&lt;br&gt;
◼️ টেইল রিকার্শন&lt;br&gt;
◼️ রিকার্শন ভিত্তিক সমস্যা (যেমন ফ্যাক্টোরিয়াল, ফিবোনাচ্চি সিরিজ, টাওয়ার অব হ্যানয়)&lt;br&gt;
ধাপ ৮: ট্রি&lt;br&gt;
◼️ ট্রি পরিচিতি&lt;br&gt;
◼️ বাইনারি ট্রি এবং বাইনারি সার্চ ট্রি (BST)&lt;br&gt;
◼️ ট্রি ট্র্যাভার্সাল (ইনঅর্ডার, প্রিঅর্ডার, পোস্টঅর্ডার)&lt;br&gt;
◼️ ব্যালেন্সড ট্রি (AVL ট্রি, রেড-ব্ল্যাক ট্রি)&lt;br&gt;
◼️ ট্রি ভিত্তিক সমস্যা (যেমন ট্রির হাইট খুঁজে বের করা, BST তে লোয়েস্ট কমন অ্যান্সেস্টর)&lt;br&gt;
ধাপ ৯: হিপ&lt;br&gt;
◼️ হিপ পরিচিতি (মিন হিপ, ম্যাক্স হিপ)&lt;br&gt;
◼️- হিপ অপারেশন (ইনসারশন, ডিলিশন)&lt;br&gt;
◼️ হিপ সোর্ট অ্যালগরিদম&lt;br&gt;
◼️ হিপ ভিত্তিক সমস্যা (যেমন kth বৃহত্তম উপাদান খুঁজে বের করা)&lt;br&gt;
ধাপ ১০: হ্যাশিং&lt;br&gt;
◼️ হ্যাশিং পরিচিতি&lt;br&gt;
◼️ হ্যাশ ফাংশন এবং কোলিশন রেজল্যুশন টেকনিক (চেইনিং, ওপেন অ্যাড্রেসিং)&lt;br&gt;
◼️ হ্যাশিং এর প্রয়োগ (যেমন অ্যানাগ্রাম, ফ্রিকোয়েন্সি গণনা)&lt;br&gt;
◼️ হ্যাশিং ভিত্তিক সমস্যা (যেমন ০ সমান সাবঅ্যারের সংখ্যা, লংগেস্ট কনসিকিউটিভ সিকোয়েন্স)&lt;br&gt;
ধাপ ১১: গ্রাফ&lt;br&gt;
◼️ গ্রাফ পরিচিতি (ডিরেক্টেড, আনডিরেক্টেড)&lt;br&gt;
◼️ গ্রাফের উপস্থাপন (অ্যাডজেসেন্সি লিস্ট, অ্যাডজেসেন্সি ম্যাট্রিক্স)&lt;br&gt;
◼️ গ্রাফ ট্র্যাভার্সাল টেকনিক (BFS, DFS)&lt;br&gt;
◼️ শর্টেস্ট পাথ অ্যালগরিদম (ডিজকস্ট্রা, বেলম্যান-ফোর্ড)&lt;br&gt;
◼️ গ্রাফ ভিত্তিক সমস্যা (যেমন সাইকেল ডিটেকশন, কানেক্টেড কম্পোনেন্টস)&lt;br&gt;
ধাপ ১২: সর্টিং অ্যালগরিদম&lt;br&gt;
◼️ সর্টিং পরিচিতি&lt;br&gt;
◼️ বাবল সর্ট, সিলেকশন সর্ট, ইনসারশন সর্ট&lt;br&gt;
◼️ মার্জ সর্ট এবং কুইক সর্ট&lt;br&gt;
◼️ সর্টিং ভিত্তিক সমস্যা (যেমন অ্যারে কে ০, ১, এবং ২ দিয়ে সর্ট করা)&lt;br&gt;
ধাপ ১৩: সার্চিং অ্যালগরিদম&lt;br&gt;
◼️ লিনিয়ার সার্চ&lt;br&gt;
◼️ বাইনারি সার্চ&lt;br&gt;
◼️ রোটেটেড সর্টেড অ্যারেতে সার্চ&lt;br&gt;
◼️ সার্চ ভিত্তিক সমস্যা (যেমন কোন উপাদানের প্রথম এবং শেষ অবস্থান খুঁজে বের করা)&lt;br&gt;
ধাপ ১৪: ডায়নামিক প্রোগ্রামিং&lt;br&gt;
◼️ ডায়নামিক প্রোগ্রামিং এর পরিচয়&lt;br&gt;
◼️ মেমোইজেশন এবং ট্যাবুলেশন টেকনিক&lt;br&gt;
◼️ সাধারণ DP সমস্যা (যেমন ফিবোনাচ্চি, ন্যাপস্যাক, লংগেস্ট ইনক্রিসিং সাবসিকোয়েন্স)&lt;br&gt;
ধাপ ১৫: গ্রিডি অ্যালগরিদম&lt;br&gt;
◼️ গ্রিডি অ্যালগরিদমের পরিচয়&lt;br&gt;
◼️ গ্রিডি বনাম ডায়নামিক প্রোগ্রামিং&lt;br&gt;
◼️ ক্লাসিক গ্রিডি সমস্যা (যেমন অ্যাক্টিভিটি সিলেকশন, কয়েন চেঞ্জ, জব স্কেডিউলিং)&lt;br&gt;
ধাপ ১৬: ব্যাকট্র্যাকিং&lt;br&gt;
◼️ ব্যাকট্র্যাকিং এর পরিচয়&lt;br&gt;
◼️ N-কুইন্স সমস্যা&lt;br&gt;
◼️ র‍্যাট ইন এ ম্যাজ সমস্যা&lt;br&gt;
◼️ ব্যাকট্র্যাকিং ভিত্তিক সমস্যা (যেমন সুডোকু সমাধান)&lt;br&gt;
 © Rabbil Hasan Rupom&lt;/p&gt;

</description>
    </item>
    <item>
      <title>For frontend validation with zod</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Wed, 21 Aug 2024 18:41:57 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/for-frontend-validation-with-zod-2357</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/for-frontend-validation-with-zod-2357</guid>
      <description>&lt;p&gt;npm i zod @hookform/resolvers&lt;/p&gt;

</description>
    </item>
    <item>
      <title>MongoDB</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Mon, 08 Jul 2024 13:42:57 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/mongodb-1ef9</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/mongodb-1ef9</guid>
      <description>&lt;p&gt;MongoDB শিখুন, বুক ফুলিয়ে বলুন "MongoDB জানি!" এখানে আপনার জন্য একটি চেকলিস্ট দিলাম যা আপনাকে একজন দক্ষ MongoDB ডেভেলপার হতে সাহায্য করবে। &lt;br&gt;
📚 Meet MongoDB: MongoDB এর সাথে পরিচিত হন, এর বেসিক কনসেপ্ট এবং ডাটাবেজ হিসেবে এর বিশেষত্ব জানুন। &lt;br&gt;
📘 Terminology and Data Model: MongoDB এর টার্মিনোলজি যেমন ডকুমেন্ট, কালেকশন, ডাটাবেজ এবং এর ডাটা মডেল সম্পর্কে বিস্তারিত ধারণা। &lt;br&gt;
🔢 Data Types and Documents: MongoDB এর বিভিন্ন Data Types যেমন String, Number, Boolean, Array, Object ইত্যাদি এবং কিভাবে স্যাম্পল ডকুমেন্ট পড়তে ও বুঝতে হয়। &lt;br&gt;
☁️ MongoDB Atlas: MongoDB এর ক্লাউড সার্ভিস প্ল্যাটফর্ম MongoDB Atlas এর ব্যবহার এবং সেটআপ। &lt;br&gt;
🖥️ MongoDB Compass: MongoDB Compass এর ব্যবহার, এটি দিয়ে ডাটাবেজ ভিজ্যুয়ালাইজ করা ও ম্যানেজ করা। &lt;br&gt;
🖊️ MongoDB VS Code Extension: VS Code এর MongoDB এক্সটেনশন ব্যবহার করে কিভাবে ডাটাবেজ ম্যানেজ ও কোড এডিট করা যায়। &lt;br&gt;
💻 MongoDB Community Server: MongoDB Community Server সেটআপ এবং ব্যবহার। &lt;br&gt;
🔍 Database-related methods: &lt;br&gt;
-Insert One query &lt;br&gt;
-Insert Many query &lt;br&gt;
-Find query&lt;br&gt;
-Projection concept &lt;br&gt;
🔄 Query Operators: &lt;br&gt;
-Comparison query operators &lt;br&gt;
-Logical query operators &lt;br&gt;
-Element query operators &lt;br&gt;
-Evaluation query operators &lt;br&gt;
📊 Other Operations: &lt;br&gt;
-Sort &lt;br&gt;
-Limit&lt;br&gt;
-Distinct &lt;br&gt;
-Row count &lt;br&gt;
-Delete One and Many &lt;br&gt;
📊 MongoDB Aggregation: &lt;br&gt;
-Aggregation Sorting &lt;br&gt;
-Limiting &lt;br&gt;
-First and Last&lt;br&gt;
-Match Condition &lt;br&gt;
-Like &lt;br&gt;
-Projection &lt;br&gt;
🔢 Advanced Aggregation: &lt;br&gt;
-Skip and Limit &lt;br&gt;
-Group By &lt;br&gt;
-Group By SUM, Avg, Max, Min &lt;br&gt;
-Without Group By Sum Avg Max Min &lt;br&gt;
-Group By Multiple &lt;br&gt;
-Join By Lookup Operator &lt;br&gt;
-Facet Operator &lt;br&gt;
-Projection After Join &lt;br&gt;
-Add New Field With Result &lt;br&gt;
🔢 Aggregation Operators: &lt;br&gt;
-Arithmetic Aggregation Operators &lt;br&gt;
-String Aggregation Operators &lt;br&gt;
-Date Aggregation Operators &lt;br&gt;
-Comparison Aggregation Operators &lt;br&gt;
-Boolean Aggregation Operators &lt;br&gt;
-Conditional Aggregation Operators&lt;/p&gt;

</description>
    </item>
    <item>
      <title>sonner for toast</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sun, 07 Jul 2024 15:15:01 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/sonner-for-toast-2ojm</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/sonner-for-toast-2ojm</guid>
      <description>&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install sonner
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://sonner.emilkowal.ski/" rel="noopener noreferrer"&gt;https://sonner.emilkowal.ski/&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;Call main.tsx&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import { Provider } from 'react-redux';
import { persistor, store } from './redux/features/store.ts';
import { PersistGate } from 'redux-persist/integration/react';
import { Toaster } from 'sonner';

ReactDOM.createRoot(document.getElementById('root')!).render(
    &amp;lt;React.StrictMode&amp;gt;
        &amp;lt;Provider store={store}&amp;gt;
            &amp;lt;PersistGate loading={null} persistor={persistor}&amp;gt;
                &amp;lt;RouterProvider router={router}&amp;gt;&amp;lt;/RouterProvider&amp;gt;
            &amp;lt;/PersistGate&amp;gt;{' '}
        &amp;lt;/Provider&amp;gt;
        &amp;lt;Toaster /&amp;gt;
    &amp;lt;/React.StrictMode&amp;gt;
);

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;**Then use onSbumit login.tsx**
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const onSubmit = async (data) =&amp;gt; {
        toast.loading('Logging in');
        const userInfo = {
            id: data.id,
            password: data.password,
        };
        const res = await login(userInfo).unwrap();
        const user = verifyToken(res.data.accessToken);
        dispatch(setUser({ user: user, token: res.data.accessToken }));
        navigate(`/${user.role}/dashboard`);
    };

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
    </item>
    <item>
      <title>Javasript basic</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sun, 07 Jul 2024 14:47:45 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/javasript-basic-a43</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/javasript-basic-a43</guid>
      <description>&lt;p&gt;JavaScript শিখুন, বুক ফুলিয়ে বলুন " JS জানি " এখানে আপনার জন্য একটি চেকলিস্ট দিলাম যা আপনাকে একজন দক্ষ JavaScript ডেভেলপার হতে সাহায্য করবে- &lt;br&gt;
🟨 Keyword &amp;amp; Variable: JavaScript এর প্রাথমিক স্টেপ হলো Keyword এবং Variable সম্পর্কে জানা। কিভাবে বিভিন্ন ধরনের Variable ডিক্লেয়ার করতে হয় এবং এগুলো ব্যবহার করতে হয়।&lt;br&gt;
🟨 Data Types:  JavaScript-এর বিভিন্ন Data Types যেমন String, Number, Boolean, Object, Array ইত্যাদি সম্পর্কে বিস্তারিত ধারণা।&lt;br&gt;
🟨 Condition &amp;amp; Loop:  শর্ত (Condition) ও লুপ (Loop) ব্যবহার করে কিভাবে প্রোগ্রামের লজিক তৈরি করতে হয়।&lt;br&gt;
🟨 Function: ফাংশন তৈরি এবং ব্যবহার, ফাংশন থেকে ডেটা রিটার্ন করা এবং ফাংশনে আর্গুমেন্ট পাস করা।&lt;br&gt;
🟨 Array &amp;amp; Object: অ্যারে এবং অবজেক্টের মাধ্যমে ডেটা স্টোর করা ও ম্যানেজ করা।&lt;br&gt;
🟨 String &amp;amp; Date: String ম্যানিপুলেশন এবং Date handling।&lt;br&gt;
🟨 Math &amp;amp; Number: Math অবজেক্ট ব্যবহার করে বিভিন্ন গাণিতিক কাজ করা এবং Number ম্যানেজ করা।&lt;br&gt;
🟨 OOP (Object Oriented Programming): OOP এর মূূলনীতি এবং JavaScript এ কিভাবে Class, Object, Inheritance ইত্যাদি ব্যবহার করা হয়।&lt;br&gt;
🟨 Ajax &amp;amp; API Calls: Ajax ব্যবহার করে কিভাবে ডেটা রিটার্ন এবং API কল করা হয়।&lt;br&gt;
🟨 Data Structure &amp;amp; Algorithm: বিভিন্ন Data Structure এবং Algorithm সম্পর্কে ধারণা।&lt;br&gt;
🟨 Regex: Regular Expression ব্যবহার করে Text match করা এবং ডেটা extraction করা।&lt;br&gt;
🟨 Cryptography: কিভাবে Data Encryption এবং Decryption করা হয়।&lt;br&gt;
🟨 ES6 (Modern JavaScript): ES6 এর নতুন ফিচারসমূহ যেমন let, const, arrow functions, template literals ইত্যাদি।&lt;br&gt;
🟨 NPM &amp;amp; Packages: Node Package Manager (NPM) ব্যবহার করে প্যাকেজ ম্যানেজমেন্ট এবং প্যাকেজ ইন্সটল করা।&lt;br&gt;
🟨 Export &amp;amp; Import: মডিউল সিস্টেম ব্যবহার করে কোড Export এবং Import করা।&lt;br&gt;
🟨 Node.js Basics: Node.js ব্যবহার করে Server-side প্রোগ্রামিং এর বেসিক ধারণা।&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Protected route by token</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sun, 07 Jul 2024 11:34:32 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/protected-route-by-token-2ecl</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/protected-route-by-token-2ecl</guid>
      <description>&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Get token from authSlice.tsx
import { RootState } from './store';
import { createSlice } from '@reduxjs/toolkit';

type TAuthSate = {
    user: null | object;
    token: null | string;
};

const initialState: TAuthSate = {
    user: null,
    token: null,
};

const authSlice = createSlice({
    name: 'auth',
    initialState,
    reducers: {
        setUser: (state, action) =&amp;gt; {
            const { user, token } = action.payload;
            state.user = user;
            state.token = token;
        },
        logout: (state) =&amp;gt; {
            state.user = null;
            state.token = null;
        },
    },
});

export const { setUser, logout } = authSlice.actions;

export default authSlice.reducer;

export const userCurrentToken = (state: RootState) =&amp;gt; state.auth.token;
export const userCurrentUser = (state: RootState) =&amp;gt; state.auth.user;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;And this is ProtectedRoute.tsx&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;`import { ReactNode } from 'react';
import { useAppSelector } from '../../redux/features/hook';
import { userCurrentToken } from '../../redux/features/authSlice';
import { Navigate } from 'react-router-dom';

const ProtectedRote = ({ children }: { children: ReactNode }) =&amp;gt; {
    const token = useAppSelector(userCurrentToken);

    if (!token) {
        return &amp;lt;Navigate to="/login" replace={true} /&amp;gt;;
    }

    return children;
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;export default ProtectedRote;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;&lt;br&gt;
**This is router.tsx**&lt;br&gt;
&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
        path: '/admin',
        element: (
            &amp;lt;ProtectedRote&amp;gt;
                &amp;lt;App /&amp;gt;
            &amp;lt;/ProtectedRote&amp;gt;
        ),
        children: routeGenarator(adminPaths),
    },
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;`&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Redux persist: https://www.npmjs.com/package/redux-persist</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sat, 06 Jul 2024 20:17:57 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/redux-persist-httpswwwnpmjscompackageredux-persist-5ffa</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/redux-persist-httpswwwnpmjscompackageredux-persist-5ffa</guid>
      <description>&lt;p&gt;&lt;a href="https://dev.tourl"&gt;&lt;/a&gt;---&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm i redux-persist
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;**store.ts**
import { configureStore } from '@reduxjs/toolkit';
import authReducer from '../features/authSlice';
import { baseApi } from '../api/baseApi';
import { persistReducer, persistStore } from 'redux-persist';
import storage from 'redux-persist/lib/storage';

const persistConfig = {
    key: 'auth',
    storage,
};
const persistAuthReducer = persistReducer(persistConfig, authReducer);
export const store = configureStore({
    reducer: {
        [baseApi.reducerPath]: baseApi.reducer,
        // auth: authReducer,
        auth: persistAuthReducer,
    },
    middleware: (getDefaultMiddlewares) =&amp;gt;
        getDefaultMiddlewares().concat(baseApi.middleware),
});
export type RootState = ReturnType&amp;lt;typeof store.getState&amp;gt;;
// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
export type AppDispatch = typeof store.dispatch;
export const persistor = persistStore(store);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{% embed &amp;lt;u&amp;gt;**main.tsx**&amp;lt;/u&amp;gt;
import { Provider } from 'react-redux';
import { persistor, store } from './redux/features/store.ts';
import { PersistGate } from 'redux-persist/integration/react';

ReactDOM.createRoot(document.getElementById('root')!).render(
    &amp;lt;React.StrictMode&amp;gt;
        &amp;lt;Provider store={store}&amp;gt;
            &amp;lt;PersistGate loading={null} persistor={persistor}&amp;gt;
                &amp;lt;RouterProvider router={router}&amp;gt;&amp;lt;/RouterProvider&amp;gt;
            &amp;lt;/PersistGate&amp;gt;
        &amp;lt;/Provider&amp;gt;
    &amp;lt;/React.StrictMode&amp;gt;);
 %}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;To solved this error&lt;br&gt;
chunk-AA2DKTG5.js?v=b2582f6e:1742 A non-serializable value was detected in an action, in the path: &lt;code&gt;register&lt;/code&gt;. Value: ƒ register2(key) {&lt;br&gt;
    _pStore.dispatch({&lt;br&gt;
      type: REGISTER,&lt;br&gt;
      key&lt;br&gt;
    });&lt;br&gt;
  } &lt;br&gt;
Take a look at the logic that dispatched this action:&lt;br&gt;&lt;br&gt;
Object&lt;/p&gt;

&lt;p&gt;(See &lt;a href="https://redux.js.org/faq/actions#why-should-type-be-a-string-or-at-least-serializable-why-should-my-action-types-be-constants" rel="noopener noreferrer"&gt;https://redux.js.org/faq/actions#why-should-type-be-a-string-or-at-least-serializable-why-should-my-action-types-be-constants&lt;/a&gt;) &lt;br&gt;
(To allow non-serializable values see: &lt;a href="https://redux-toolkit.js.org/usage/usage-guide#working-with-non-serializable-data" rel="noopener noreferrer"&gt;https://redux-toolkit.js.org/usage/usage-guide#working-with-non-serializable-data&lt;/a&gt;)&lt;br&gt;
&lt;strong&gt;link&lt;/strong&gt;&lt;br&gt;
&lt;a href="https://redux-toolkit.js.org/usage/usage-guide#use-with-react-redux-firebase" rel="noopener noreferrer"&gt;https://redux-toolkit.js.org/usage/usage-guide#use-with-react-redux-firebase&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;store.ts&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import { configureStore } from '@reduxjs/toolkit';
import authReducer from '../features/authSlice';
import { baseApi } from '../api/baseApi';
import {
    persistReducer,
    persistStore,
    FLUSH,
    REHYDRATE,
    PAUSE,
    PERSIST,
    PURGE,
    REGISTER,
} from 'redux-persist';
import storage from 'redux-persist/lib/storage';

const persistConfig = {
    key: 'auth',
    storage,
};

const persistAuthReducer = persistReducer(persistConfig, authReducer);

export const store = configureStore({
    reducer: {
        [baseApi.reducerPath]: baseApi.reducer,
        // auth: authReducer,
        auth: persistAuthReducer,
    },
    middleware: (getDefaultMiddlewares) =&amp;gt;
        getDefaultMiddlewares({
            serializableCheck: {
                ignoredActions: [
                    FLUSH,
                    REHYDRATE,
                    PAUSE,
                    PERSIST,
                    PURGE,
                    REGISTER,
                ],
            },
        }).concat(baseApi.middleware),
});
export type RootState = ReturnType&amp;lt;typeof store.getState&amp;gt;;
// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
export type AppDispatch = typeof store.dispatch;

export const persistor = persistStore(store);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
    </item>
    <item>
      <title>jwt decode link: https://www.npmjs.com/package/jwt-decode</title>
      <dc:creator>DEBOS DAS</dc:creator>
      <pubDate>Sat, 06 Jul 2024 18:58:52 +0000</pubDate>
      <link>https://dev.to/debos_das_9a77be9788e2d6e/jwt-decode-link-httpswwwnpmjscompackagejwt-decode-523c</link>
      <guid>https://dev.to/debos_das_9a77be9788e2d6e/jwt-decode-link-httpswwwnpmjscompackagejwt-decode-523c</guid>
      <description>&lt;p&gt;npm i jwt-decode&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;verifyJwt.ts****&lt;br&gt;
import { jwtDecode } from 'jwt-decode';&lt;br&gt;
export const verifyToken = (token: string) =&amp;gt; {&lt;br&gt;
return jwtDecode(token);&lt;br&gt;
};&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Login.tsx****&lt;br&gt;
const onSubmit = async (data) =&amp;gt; {&lt;br&gt;
    console.log(data);&lt;br&gt;
    const userInfo = {&lt;br&gt;
        id: data.id,&lt;br&gt;
        password: data.password,&lt;br&gt;
    };&lt;br&gt;
    const res = await login(userInfo).unwrap();&lt;br&gt;
    const user = verifyToken(res.data.accessToken);&lt;br&gt;
    dispatch(setUser({ user: user, token: res.data.accessToken }));&lt;br&gt;
};&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

</description>
    </item>
  </channel>
</rss>
