<?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: Ritwik Rohitashwa</title>
    <description>The latest articles on DEV Community by Ritwik Rohitashwa (@ritwik2994).</description>
    <link>https://dev.to/ritwik2994</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.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F449107%2F4cc7e77f-0514-451a-a008-a0333662cf80.png</url>
      <title>DEV Community: Ritwik Rohitashwa</title>
      <link>https://dev.to/ritwik2994</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/ritwik2994"/>
    <language>en</language>
    <item>
      <title>Path alias in Node.js</title>
      <dc:creator>Ritwik Rohitashwa</dc:creator>
      <pubDate>Mon, 30 Aug 2021 06:12:39 +0000</pubDate>
      <link>https://dev.to/ritwik2994/path-alias-in-node-js-4p6</link>
      <guid>https://dev.to/ritwik2994/path-alias-in-node-js-4p6</guid>
      <description>&lt;p&gt;While doing import in node.js application, we see a lot of &lt;code&gt;'../'&lt;/code&gt;&lt;br&gt;
path. As the project grows vertically deep this path gets much duskier. This really looks awful especially when we are building a production-grade big application.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import { AuthControlller } from '../../../user/userControlller'
import { your_module } from '../../../main/your_module'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You can observe the path combination made of dots and backslashes (&lt;code&gt;'../../../'&lt;/code&gt;). Obviously, this is not looking good in a project. As well in big projects, understanding the perfect location also gets duskier when we are assigning this to a new member of our team.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Solution
&lt;/h2&gt;

&lt;p&gt;We can use &lt;strong&gt;path alias&lt;/strong&gt; to solve this problem and our code beautified. &lt;/p&gt;

&lt;h3&gt;
  
  
  What is a path alias?
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;It is a way to map paths into certain absolute paths which can be used in every corner of our application&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Setup
&lt;/h3&gt;

&lt;p&gt;Step 1.  Install module-alias package&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install --save module-alias
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Step 2. Update package.json&lt;/p&gt;

&lt;p&gt;here we have to add our custom configuration into the &lt;code&gt;package.json&lt;/code&gt; file so that this effect can be traced all around the project and with that, we can directly call this configuration just by importing it into the project files.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;"_moduleAliases": {
    "@auth": "src/api/components/user/auth",
    "@your_module": "abc/cde/efg/hij/your_module"
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This &lt;code&gt;abc/cde/efg/&lt;/code&gt; is the path of your module main folder and &lt;code&gt;@your_module&lt;/code&gt; is the name that you will use to import the module. Basically, it means that we are assigning the path to this &lt;code&gt;@your_module&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Note&lt;/strong&gt; this &lt;em&gt;**@ *&lt;/em&gt;* must be included before a module name. &lt;/p&gt;

&lt;p&gt;Step 3. Update your files&lt;/p&gt;

&lt;p&gt;Just use regular import statement with assigning to this path aliases&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const your_module_name = require('@your_module')

ES6
import your_module from '@your_module'

modules with different files
import { authController } from '@auth/controllers'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Additional steps for TypeScript&lt;/p&gt;

&lt;p&gt;Step 4. Update tsconfig.json&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;"baseUrl": "./src"   // if your directory starts from src folder
"path": {
    "@your_module": ["src/api/components"]  // your module path
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Step 5. update index.ts or your main server file&lt;/p&gt;

&lt;p&gt;Add this line on top of your main server file&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// it imports the file all around the project 
import "module_alias/register"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It's all done. Now let's go and execute our path alias and make our project beautified. &lt;/p&gt;

&lt;p&gt;If you like this article then try it in your project. Also try to share this project to others.&lt;/p&gt;

</description>
      <category>node</category>
      <category>javascript</category>
      <category>typescript</category>
      <category>programming</category>
    </item>
    <item>
      <title>Custom Rating in Android+Kotlin</title>
      <dc:creator>Ritwik Rohitashwa</dc:creator>
      <pubDate>Sat, 08 Aug 2020 10:46:44 +0000</pubDate>
      <link>https://dev.to/ritwik2994/custom-rating-in-android-kotlin-38ge</link>
      <guid>https://dev.to/ritwik2994/custom-rating-in-android-kotlin-38ge</guid>
      <description>&lt;h3&gt;
  
  
  Hey! this tutorial will help you to incorporate rating screen in your app.
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://medium.com/@rithvik2994/custom-rating-system-android-3185b4f94596?source=friends_link&amp;amp;sk=c45418d5f1588ba29885067a07f79128"&gt;https://medium.com/@rithvik2994/custom-rating-system-android-3185b4f94596?source=friends_link&amp;amp;sk=c45418d5f1588ba29885067a07f79128&lt;/a&gt;&lt;/p&gt;

</description>
      <category>tutorial</category>
      <category>android</category>
      <category>kotlin</category>
    </item>
  </channel>
</rss>
