<?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>Forem: Raja Muhammad Asher</title>
    <description>The latest articles on Forem by Raja Muhammad Asher (@rajamuhammadasher).</description>
    <link>https://forem.com/rajamuhammadasher</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%2F150757%2F98518c51-35a7-4650-940a-763c30ba4817.png</url>
      <title>Forem: Raja Muhammad Asher</title>
      <link>https://forem.com/rajamuhammadasher</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/rajamuhammadasher"/>
    <language>en</language>
    <item>
      <title>How to manage multiple Node versions on Ubuntu 22.04?</title>
      <dc:creator>Raja Muhammad Asher</dc:creator>
      <pubDate>Fri, 18 Nov 2022 14:11:42 +0000</pubDate>
      <link>https://forem.com/rajamuhammadasher/how-to-manage-multiple-node-versions-on-ubuntu-2204-16ej</link>
      <guid>https://forem.com/rajamuhammadasher/how-to-manage-multiple-node-versions-on-ubuntu-2204-16ej</guid>
      <description>&lt;p&gt;Node Version Manager allows you to quickly install and use different versions of node via the command line.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;NVM Install &amp;amp; Update Script&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;$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.2/install.sh | bash
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Troubleshooting&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;After running the install script, if you&lt;br&gt;
&lt;br&gt;
 &lt;code&gt;get nvm: command not found&lt;/code&gt;&lt;br&gt;
&lt;br&gt;
 or see no feedback from your terminal after you type&lt;br&gt;
&lt;br&gt;
 &lt;code&gt;command -v nvm&lt;/code&gt;&lt;br&gt;
&lt;br&gt;
, simply close your current terminal, open a new terminal, and try verifying again. Alternatively, you can run the following command for the different shells on the command line:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ source ~/.bashrc
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;List of installed Node versions&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;$ nvm ls
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Check current Node version&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;$ nvm current
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;List available LTS versions of Node.js&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;$ nvm ls-remote
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Install the Node version&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;$ nvm install &amp;lt;NODE_VERSION&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Select the Node version to use&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;$ nvm use &amp;lt;NODE_VERSION&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Uninstall the Node version&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;$ nvm uninstall &amp;lt;NODE_VERSION&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Set Node Version as default&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;$ nvm alias default &amp;lt;NODE_VERSION&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>node</category>
      <category>ubuntu</category>
    </item>
    <item>
      <title>HTML DOM Manipulation in JavaScript</title>
      <dc:creator>Raja Muhammad Asher</dc:creator>
      <pubDate>Fri, 20 May 2022 16:39:15 +0000</pubDate>
      <link>https://forem.com/rajamuhammadasher/html-dom-manipulation-in-javascript-2p8o</link>
      <guid>https://forem.com/rajamuhammadasher/html-dom-manipulation-in-javascript-2p8o</guid>
      <description>&lt;p&gt;We can use setInterval() method of JavaScript to monitor changes in the DOM after regular intervals. For example, we have to add event listener to add-to-cart button for tracking purposes but there are few products that load after an ajax call. How can you differentiate between the newly loaded add-to-cart buttons and the ones you have already added the event listeners? &lt;/p&gt;

&lt;p&gt;We can use setAttribute() method to add our custom attribute to distinguish between them. We will use querySelector() method to select only those buttons who do not have our custom attribute set on it. Add the event listener and then set our custom attribute to them. &lt;/p&gt;

&lt;p&gt;Here is the code sample&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;setInterval(() =&amp;gt; {
    try {
      document.querySelectorAll('.add-to-cart:not([custom-attrib])').forEach((selector) =&amp;gt; {
        selector.addEventListener('click', () =&amp;gt; {
          // your code for execution
        });

        selector.setAttribute('custom-attrib', true);
      });
      }
    } catch (err) {
      // continue
    }
  }, 750);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>javascript</category>
      <category>dom</category>
    </item>
    <item>
      <title>Web Application Development Process of a Full Stack Developer</title>
      <dc:creator>Raja Muhammad Asher</dc:creator>
      <pubDate>Fri, 01 Apr 2022 20:10:35 +0000</pubDate>
      <link>https://forem.com/rajamuhammadasher/web-application-development-process-of-a-full-stack-developer-ffj</link>
      <guid>https://forem.com/rajamuhammadasher/web-application-development-process-of-a-full-stack-developer-ffj</guid>
      <description>&lt;p&gt;What an amazing time we are living in? Inexpensive access to technology and the rise of JavaScript has created a new breed of developers i.e., Full Stack Developers can work equally well on the front-end and back-end technologies, thanks to JavaScript.&lt;/p&gt;

&lt;p&gt;Building a SAAS product was never simple. Now you can partner up with a Full Stack Developer to bring your idea to life. There is no need to hire multiple developers &amp;amp; designers to make it happen. A single full stack developer can do wonders now. Web application development process with a Full Stack Developer be like:&lt;/p&gt;

&lt;h2&gt;
  
  
  Wireframes
&lt;/h2&gt;

&lt;p&gt;Picture worth a thousand words. Wireframes serve this purpose. If you have brilliant idea in mind and nothing on paper, you will face difficulty visualizing the solution be it web app or mobile app. Wireframing will bring the developer and product owner to same page regarding the expectations of the final solution.&lt;/p&gt;

&lt;h2&gt;
  
  
  UI/UX Design
&lt;/h2&gt;

&lt;p&gt;Once the wireframes are finalized and overall flow has been established, it's time for UI/UX design of the solution (web or mobile app). User Experience (UX) provides the maximum user satisfaction when they interact with the application. User Interface (UI) provides the best presentation and interactivity of the web or mobile app. &lt;/p&gt;

&lt;h2&gt;
  
  
  Frontend Development
&lt;/h2&gt;

&lt;p&gt;JavaScript provides multiple libraries and frameworks for frontend development of mobile or web app. Based on the specific use-case and requirements full stack developer choose to work in ReactJS, React Native, Angular, Vue, NextJS etc. Frontend helps in finalizing the response required from backend to update frontend.&lt;/p&gt;

&lt;h2&gt;
  
  
  Backend Development
&lt;/h2&gt;

&lt;p&gt;JavaScript provides Node.js for backend development of mobile or web app. Based on the specific use-case and requirements full stack developer choose to work in ExpressJS, NextJS etc. REST API or GraphQL can be used to serve the data required at frontend.&lt;/p&gt;

&lt;h2&gt;
  
  
  Testing
&lt;/h2&gt;

&lt;p&gt;Unit tests and integration testing can be performed with Jest and Cypress. Each library has its own pros and cons depending upon the type of application being developed. Sometimes this can be delayed and rather release for initial set of users who can provide feedback for improvements and report the bugs if found.&lt;/p&gt;

&lt;h2&gt;
  
  
  Deployment
&lt;/h2&gt;

&lt;p&gt;Heroku, AWS amplify, Netlify can be used as they provide free tiers for evaluation and charge you as you go. In case of mobile apps, these can be submitted to Google Play Store and Apple App Store.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>programming</category>
    </item>
    <item>
      <title>Coding Interviews are not broken!</title>
      <dc:creator>Raja Muhammad Asher</dc:creator>
      <pubDate>Tue, 15 Feb 2022 11:24:32 +0000</pubDate>
      <link>https://forem.com/rajamuhammadasher/coding-interviews-are-not-broken-34lb</link>
      <guid>https://forem.com/rajamuhammadasher/coding-interviews-are-not-broken-34lb</guid>
      <description>&lt;p&gt;Coding interviews are broken. They judge your memory rather than skills. I am a fresher and I don't think I am going to use these algorithms and data structures anywhere. After all being the most junior developer in the team I will be mentored by the senior developers. It's my employer's responsibility to train and groom me into better developer. I have graduated from a well reputed university with higher grades. Isn't it enough to prove my worth?&lt;/p&gt;

&lt;p&gt;Sounds familiar? Don't be surprised, these were common even back in early 2000's. Computer Science graduates after completing 40 courses of 320 credit hours scoring higher GPAs filled with confidence applying for the jobs and get punched in the face when interviewed for algorithms and data structures. Graduates performing well in these interviews doesn't necessarily belong to elite universities but they all have one thing in common and that is problem solving skills. A skill to analyze the problem and develop the logical steps to solve that problem using algorithms and data structures which they have been taught throughout their bachelors degree program.&lt;/p&gt;

&lt;p&gt;Why the companies test for algorithms and data structures? It is difficult to understand when you are starting your professional career and this is the case with me also. But after few years when I got promoted and started taking technical interviews I have observed that developers who score better in algorithms and data structures proved better programmers and quick learners. You can shift them easily to any technology and they quickly grasp it and start producing results. This is because they have developed a logical way of thinking which every programming languages demands.&lt;/p&gt;

&lt;p&gt;So next time preparing algorithms and data structures try to learn how everything works, it will not only help you to score better but also make you better developer no matter which programming language you work in.&lt;/p&gt;

</description>
      <category>interview</category>
      <category>technicalinterview</category>
    </item>
  </channel>
</rss>
