<?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: Rajasekhar Guptha</title>
    <description>The latest articles on DEV Community by Rajasekhar Guptha (@rajasekharguptha).</description>
    <link>https://dev.to/rajasekharguptha</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%2F465689%2F343ea82f-c8dc-452f-8a26-1192957f702e.png</url>
      <title>DEV Community: Rajasekhar Guptha</title>
      <link>https://dev.to/rajasekharguptha</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/rajasekharguptha"/>
    <language>en</language>
    <item>
      <title>What is Rebase in crypto - Explained!</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Sun, 31 Oct 2021 12:06:35 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/what-is-rebase-in-crypto-explained-1nci</link>
      <guid>https://dev.to/rajasekharguptha/what-is-rebase-in-crypto-explained-1nci</guid>
      <description>&lt;h2&gt;
  
  
  Rebase
&lt;/h2&gt;

&lt;p&gt;is a token or a protocol that adjusts &lt;strong&gt;circulating supply&lt;/strong&gt; automatically or periodically in response to price fluctuations.`&lt;/p&gt;

&lt;h3&gt;
  
  
  Short History
&lt;/h3&gt;

&lt;p&gt;So...&lt;br&gt;&lt;br&gt;
Last week when I was skimming through some crypto news an article grabbed my attention which is about a new token project &lt;a href="https://coinmarketcap.com/currencies/upcake/"&gt;upcake(UPC)&lt;/a&gt; ( &lt;em&gt;ofcourse we are witnessing hundreds of launches every single day 😅&lt;/em&gt; ) &amp;amp; about it's trend in  &lt;a href="https://coinmarketcap.com/"&gt;coinmarketcap &lt;/a&gt; and  &lt;a href="https://twitter.com/RajsekharGuptha"&gt;twitter&lt;/a&gt;  &lt;/p&gt;

&lt;p&gt;That one word which grabbed my attention is &lt;strong&gt;rebase&lt;/strong&gt; (bcoz it was new for me ).So, I went through the project  &lt;a href="https://coinmarketcap.com/currencies/upcake/"&gt;whitepaper &lt;/a&gt; in detail, and found simple explanation for that. But I was not quite satisfied and wished to know about it completely 😃&lt;/p&gt;

&lt;h3&gt;
  
  
  Digging deeper
&lt;/h3&gt;

&lt;p&gt;So I started research with a simple Google search (as always), found some articles and went through them, afterwards I started &lt;strong&gt;tracking&lt;/strong&gt; the  &lt;a href="https://coinmarketcap.com/watchlist/617a1d5abcc7543902b5ebc9"&gt;Upcake (URC) token&lt;/a&gt; as an example in addition to that also went through some interesting (not really 😁) responses given by the dev team to users queries in their community forum&lt;/p&gt;

&lt;h3&gt;
  
  
  What did I find ???
&lt;/h3&gt;

&lt;p&gt;&lt;em&gt;Spoiler Alert&lt;/em&gt; ❗&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;A &lt;strong&gt;bonus&lt;/strong&gt; tip is hidden 😉 in the content down 👇&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  What is Rebase..?
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Rebase is basically adjusting circulating capacity i.e decrease by burning out the tokens or increase by adding tokens to supply - including all holder's and LP's holding tokens count. This is done in order to &lt;strong&gt;adjust the token price, without affecting the value of anyone's share of coins&lt;/strong&gt;. This increase or decrease in supply works with a mechanism that adjusts the supply &lt;strong&gt;algorithmically&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Example Time
&lt;/h3&gt;

&lt;p&gt;Let our brains grab the above definition with an example&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Let's say at some time &lt;em&gt;x&lt;/em&gt; , circulating Supply is &lt;strong&gt;&lt;em&gt;1,00,000&lt;/em&gt;&lt;/strong&gt; tokens And you hold &lt;strong&gt;&lt;em&gt;1000&lt;/em&gt;&lt;/strong&gt; tokens each of value &lt;strong&gt;&lt;em&gt;1$&lt;/em&gt;&lt;/strong&gt;.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Let us assume that &lt;strong&gt;negative rebase&lt;/strong&gt; happened by 10%&lt;/li&gt;
&lt;li&gt;Now the supply will be &lt;strong&gt;90,000&lt;/strong&gt; tokens and your holding count will be &lt;strong&gt;&lt;em&gt;900&lt;/em&gt;&lt;/strong&gt; with each token valuing to &lt;strong&gt;&lt;em&gt;1.12&lt;/em&gt;&lt;/strong&gt;$ (expected ideal price but in reality it varies depending on various factors)
$$
1,000 X 1$ = 900 * 1.12$
$$&lt;/li&gt;
&lt;li&gt;But here, ration of your tokens to total supply will be remained constant&lt;/li&gt;
&lt;li&gt;
holding/supply before rebase = holding/supply after rebase
$$
1,000 / 1,00,000 = 900/90,000
$$&lt;/li&gt;
&lt;/ul&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Practical Ways
&lt;/h3&gt;

&lt;p&gt;Expecting that the above said theoretical definition is clear&lt;br&gt;
let's see two real world &lt;strong&gt;implemented&lt;/strong&gt; definitions &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;By  &lt;a href="https://coinmarketcap.com/currencies/ampleforth/"&gt;Ampleforth (AMPL)&lt;/a&gt; 
&amp;gt; The automatic supply adjustment process known as a &lt;strong&gt;rebase&lt;/strong&gt; occurs once each day, with a positive rebase if the price goes above $1.06, and a negative rebase if it is below $0.96. The overall goal of the system is to create incentives that drive the market price of AMPL back to ~$1.&lt;/li&gt;
&lt;li&gt;By  &lt;a href="https://coinmarketcap.com/currencies/upcake/"&gt;UpCake(UPC)&lt;/a&gt; 
&amp;gt; On an hourly basis, the overall supply of our token will be reduced by a pre determined % impacting everyone in the ecosystem&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Why Rebase?
&lt;/h3&gt;

&lt;p&gt;Why many projects are now using rebase,&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;#### The Marketing Benefit
As the supply been reducing towards an ideal figure, the price of the token keeps on increasing more and more when compared to normal coins, there are 2 advantages by this

&lt;ol&gt;
&lt;li&gt;% increase in price of token is incredible and it makes &lt;strong&gt;price chart&lt;/strong&gt; looking good which may attract people to buy &lt;/li&gt;
&lt;li&gt;Also bcoz of this, these coins may trend on platforms like &lt;a href="https://coinmarketcap.com/"&gt;CoinmarketCap&lt;/a&gt; which may grab attention of many users worldwide which intern increases exposure by people speaking about the token&lt;/li&gt;
&lt;/ol&gt;
&lt;/li&gt;
&lt;li&gt;#### Elastic Supply
this elasticity in supply may result in constant long term growth&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Bonus tip 🥳
&lt;/h3&gt;

&lt;p&gt;When you invest or tracking some Token based on &lt;em&gt;rebase tokenomics&lt;/em&gt;,  it's like hell  to do these calculations every time you wanted to know change in price &lt;/p&gt;

&lt;p&gt;So the tip is observing &lt;strong&gt;Market Cap(MC)&lt;/strong&gt;&lt;br&gt;
,note down the market cap initially then ,&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;When MC is ⬆️ above your last value 🔺 you are in &lt;em&gt;profits now&lt;/em&gt; 🥳🥳💸&lt;/li&gt;
&lt;li&gt;Market cap is  ⬇️ below the noted level 🔻 you have to wait to &lt;em&gt;see the moon&lt;/em&gt; 🌒😅&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Downside
&lt;/h3&gt;

&lt;p&gt;For users, definitely there is a downside&lt;br&gt;
Here, as already seen above the tokens price may keep on increasing constantly but this &lt;strong&gt;% up in the token's price  is not at all your profit&lt;/strong&gt; it may become profit but not all the times.&lt;br&gt;
Let us consider the same example as mentioned above &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;token's price is 12% up from 1$ to 1.12$ but there is no profit for you as no. of tokens decreased proportionally&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;You will be in profits, iff the % increase in price is more than enough to compensate the decreased tokens + give you profit&lt;/p&gt;

&lt;p&gt;One have to mind this that &lt;strong&gt;MarketCap&lt;/strong&gt; is correct &lt;strong&gt;indicator&lt;/strong&gt; than the &lt;strong&gt;price&lt;/strong&gt; change when tracking these type of tokens.&lt;/p&gt;

&lt;h3&gt;
  
  
  Inspiration
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;A friend of mine invested in a token built on rebase without knowing about this protocol and he got panic when he actually saw that the num of tokens he held  decreased  &amp;amp; also tokens value was slight down while token price increased by some % and he thought that he was scammed and blamed the dev team in their community forum😅&lt;br&gt;
So I thought of writing this&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Will rebase be the future ??
&lt;/h3&gt;

&lt;p&gt;We can definitely witness many more projects using &lt;strong&gt;rebase&lt;/strong&gt; technique, also they may trend asap after their launch bcoz of the above explained marketing technique but what we have to &lt;em&gt;still know&lt;/em&gt; is &lt;em&gt;Will users be able to make profits more than by believing standard coins&lt;/em&gt; &lt;br&gt;
comment down 👇🏻👇🏻&lt;/p&gt;

</description>
      <category>web3</category>
      <category>webdev</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>My portfolio design..!</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Tue, 08 Dec 2020 06:36:13 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/my-portfolio-design-4f7p</link>
      <guid>https://dev.to/rajasekharguptha/my-portfolio-design-4f7p</guid>
      <description>&lt;p&gt;Recently I designed &amp;amp; developed my portfolio.. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://rajasekhar.tech/"&gt;Check site here&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Built using NextJS&lt;br&gt;
 I used server to handle Contact Form and Mailchimp API &lt;/p&gt;

&lt;p&gt;Retweet if you like it ( &lt;a href="https://twitter.com/RajsekharGuptha/status/1335554479408689152?s=19"&gt;Tweet&lt;/a&gt; ) &lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;love to have feedback &amp;amp; suggestions 😍 &lt;br&gt;
Comment...!&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>react</category>
      <category>node</category>
    </item>
    <item>
      <title>Your most used 'Key' ?</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Thu, 26 Nov 2020 14:23:41 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/your-most-used-key-4l4a</link>
      <guid>https://dev.to/rajasekharguptha/your-most-used-key-4l4a</guid>
      <description>&lt;p&gt;What's the most used key in your keyboard ?&lt;/p&gt;

&lt;p&gt;Mine is &lt;strong&gt;Enter&lt;/strong&gt;   &lt;/p&gt;


&lt;blockquote class="ltag__twitter-tweet"&gt;

  &lt;div class="ltag__twitter-tweet__main"&gt;
    &lt;div class="ltag__twitter-tweet__header"&gt;
      &lt;img class="ltag__twitter-tweet__profile-image" src="https://res.cloudinary.com/practicaldev/image/fetch/s--P92x9sFp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://pbs.twimg.com/profile_images/1307234768292020230/D9oNoWmS_normal.jpg" alt="Rajasekhar Guptha profile image"&gt;
      &lt;div class="ltag__twitter-tweet__full-name"&gt;
        Rajasekhar Guptha
      &lt;/div&gt;
      &lt;div class="ltag__twitter-tweet__username"&gt;
        @rajsekharguptha
      &lt;/div&gt;
      &lt;div class="ltag__twitter-tweet__twitter-logo"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ir1kO05j--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-f95605061196010f91e64806688390eb1a4dbc9e913682e043eb8b1e06ca484f.svg" alt="twitter logo"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="ltag__twitter-tweet__body"&gt;
      Mention your most used "Key" ⌨️&lt;br&gt;&lt;br&gt;&lt;a href="https://t.co/6tLFcgwoKy"&gt;dev.to/rajasekhargupt…&lt;/a&gt;&lt;br&gt;&lt;a href="https://twitter.com/hashtag/DEVCommunity"&gt;#DEVCommunity&lt;/a&gt; &lt;a href="https://twitter.com/hashtag/webdevelopment"&gt;#webdevelopment&lt;/a&gt; &lt;a href="https://twitter.com/hashtag/coding"&gt;#coding&lt;/a&gt;
    &lt;/div&gt;
    &lt;div class="ltag__twitter-tweet__date"&gt;
      14:28 PM - 26 Nov 2020
    &lt;/div&gt;


    &lt;div class="ltag__twitter-tweet__actions"&gt;
      &lt;a href="https://twitter.com/intent/tweet?in_reply_to=1331967988069781506" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--fFnoeFxk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-reply-action-238fe0a37991706a6880ed13941c3efd6b371e4aefe288fe8e0db85250708bc4.svg" alt="Twitter reply action"&gt;
      &lt;/a&gt;
      &lt;a href="https://twitter.com/intent/retweet?tweet_id=1331967988069781506" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--k6dcrOn8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-retweet-action-632c83532a4e7de573c5c08dbb090ee18b348b13e2793175fea914827bc42046.svg" alt="Twitter retweet action"&gt;
      &lt;/a&gt;
      &lt;a href="https://twitter.com/intent/like?tweet_id=1331967988069781506" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--SRQc9lOp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-like-action-1ea89f4b87c7d37465b0eb78d51fcb7fe6c03a089805d7ea014ba71365be5171.svg" alt="Twitter like action"&gt;
      &lt;/a&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/blockquote&gt;


</description>
      <category>discuss</category>
      <category>webdev</category>
      <category>codenewbie</category>
      <category>watercooler</category>
    </item>
    <item>
      <title>Build and Deploy URL Shortener to custom domain from scratch -  Node JS</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Mon, 19 Oct 2020 12:25:38 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/build-and-deploy-url-shortener-to-custom-domain-from-scratch-node-js-2f0o</link>
      <guid>https://dev.to/rajasekharguptha/build-and-deploy-url-shortener-to-custom-domain-from-scratch-node-js-2f0o</guid>
      <description>&lt;p&gt;Let's build a URL shortener ( &lt;strong&gt;Minii&lt;/strong&gt; in my case ) using Node JS (Express JS)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Structure:&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1603019184959%2Fae4rZYvvD.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1603019184959%2Fae4rZYvvD.png" alt="minii_stack.PNG"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Express JS&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Mongo DB Atlas&lt;/strong&gt; as database&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Mongoose JS&lt;/strong&gt; to handle MongoDB&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;ejs&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Let's make our hands dirty..&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;  Create Folder with project name ( Minii in my case )
&lt;code&gt;npm init&lt;/code&gt; in terminal and enter your details like below&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;You can leave everything default &lt;/li&gt;
&lt;li&gt;I chose &lt;strong&gt;server.js&lt;/strong&gt; as entry point by default it is index.js
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package name: (minii)
version: (1.0.0)
description: Custom URL shortener
entry point: (index.js) server.js
test command:
git repository:
keywords:
author: Rajasekhar Guptha
license: (ISC)
About to write to E:\WebD\minii\package.json:

{
  "name": "minii",
  "version": "1.0.0",
  "description": "Custom URL shortener",
  "main": "script.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" &amp;amp;&amp;amp; exit 1"
  },
  "author": "Rajasekhar Guptha",
  "license": "ISC"
}


Is this OK? (yes)

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

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt; Let's design our site next..
I made this simple design using Bootstrap
&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1603018320776%2FnG5e92-8k.png" alt="minii_proto.PNG"&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;As we are going to use &lt;strong&gt;ejs&lt;/strong&gt; &lt;/li&gt;
&lt;li&gt;
&lt;code&gt;npm install ejs&lt;/code&gt; and  &lt;code&gt;npm install express&lt;/code&gt; in terminal ( documentation  &lt;a href="https://ejs.co/" rel="noopener noreferrer"&gt;here&lt;/a&gt;  )&lt;/li&gt;
&lt;li&gt;create &lt;strong&gt;public&lt;/strong&gt; and &lt;strong&gt;views&lt;/strong&gt; folders.&lt;/li&gt;
&lt;li&gt;then create index.ejs file in &lt;strong&gt;views&lt;/strong&gt; folder to design our page&lt;/li&gt;
&lt;li&gt;and then add css files inside &lt;strong&gt;public&lt;/strong&gt; folder&lt;/li&gt;
&lt;li&gt;all these &lt;strong&gt;html and css&lt;/strong&gt; files will be there at the end of this post&lt;/li&gt;
&lt;li&gt;create server.js in the root directory

&lt;ul&gt;
&lt;li&gt;now we have to setup &lt;strong&gt;express&lt;/strong&gt; and &lt;strong&gt;ejs&lt;/strong&gt; as view engine
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;express&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;require&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;express&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// app setup&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;app&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;express&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;set&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;view engine&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;ejs&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;now define &lt;strong&gt;static&lt;/strong&gt; folder to express 

&lt;ul&gt;
&lt;li&gt;all our css files and assets were static files and we have to tell express about them to treat them as static
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;express&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;require&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;express&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// app setup&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;app&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;express&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;set&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;view engine&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;ejs&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="c1"&gt;// views folder&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;set&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;views&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;__dirname&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/views&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// setup static folder&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;use&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;express&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;static&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;__dirname&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/public&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;Now we need to assign the &lt;strong&gt;port&lt;/strong&gt; for our app to run&lt;/li&gt;
&lt;li&gt;During &lt;strong&gt;development&lt;/strong&gt; stage we can hardcode &lt;strong&gt;3000&lt;/strong&gt; or &lt;strong&gt;5000&lt;/strong&gt;
But in production stage we cannot decide &amp;amp; hardcode because it will be allotted dynamically
But we can get the assigned port using &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;code&gt;process.env.PORT&lt;/code&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;it is null if the app is not in production stage, so the logic is
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;
&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;port&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;process&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;env&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;PORT&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;port&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nx"&gt;port&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;3000&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;listen&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;port&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nf"&gt;function &lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Server is up on port : &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;port&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;});&lt;/span&gt;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;&lt;p&gt;The basic setup is over. Now we will start catching requests for our page&lt;br&gt;
Firstly catch &lt;strong&gt;get&lt;/strong&gt; request to our home page&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;For this we need &lt;strong&gt;body-parser&lt;/strong&gt;, setup goes like this&lt;br&gt;
&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const bodyParser = require("body-parser");
....

// to get url details we need this
app.use(bodyParser.urlencoded({ extended: true }));

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

&lt;/div&gt;



&lt;p&gt;Now we are ready to catch url requests&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; &lt;strong&gt;app.get("path",callback fun)&lt;/strong&gt; for get req&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;app.post("path",callback fun)&lt;/strong&gt; for post req
General representation for callback function is
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;       &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

      &lt;span class="p"&gt;});&lt;/span&gt;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;Request arg  contains details of request &lt;/li&gt;
&lt;li&gt;We will send our result using   response arg&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;in our case when we received a &lt;strong&gt;get&lt;/strong&gt; req for our home page we want that &lt;strong&gt;index.ejs&lt;/strong&gt; to be rendered and displayed.. So,&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;get&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;render&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;index&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;});&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now we can test our home page using &lt;/p&gt;

&lt;p&gt;run &lt;code&gt;node server.js&lt;/code&gt; and head to *&lt;em&gt;localhost:3000 *&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Yeah..! 🎉We completed our first &lt;strong&gt;major&lt;/strong&gt; step ✨ &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;There is one problem with "node server.js" i.e whenever we made some changes to script to make them apply we need to restart the server every time.&lt;br&gt;
So I suggest using "nodemon"  - automatically restarts the app whenever file changes in the directory are detected. &lt;br&gt;
  Install it as development  dependcency as we don't need this in production environment.&lt;br&gt;
 ' npm install --save-dev nodemon '&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;From now onwards use " nodemon server.js " instead of  "node server.js" to start app.&lt;/p&gt;

&lt;p&gt;We finished our setup and let us look at core functionality&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Working behind the scene &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Get the url to be shortened from the user&lt;/li&gt;
&lt;li&gt;Assign the random ( or user &lt;strong&gt;requested&lt;/strong&gt; ) short string &lt;/li&gt;
&lt;li&gt;Store short string and original url  in databse with short string as  &lt;a href="https://en.wikipedia.org/wiki/Primary_key" rel="noopener noreferrer"&gt;Primarykey&lt;/a&gt; because shorturl must be unique&lt;/li&gt;
&lt;li&gt;Whenever we received a request to path similar to &lt;strong&gt;/shortstring&lt;/strong&gt; check the database for respective original url and redirect to that. If doesn't exist return &lt;strong&gt;404&lt;/strong&gt; error &lt;/li&gt;
&lt;/ol&gt;
&lt;/blockquote&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;Getting the URL to be shortened&lt;br&gt;
add &lt;strong&gt;form&lt;/strong&gt; to home page with method &lt;strong&gt;post&lt;/strong&gt; and action to &lt;strong&gt;/process&lt;/strong&gt;. ( action path is your wish )&lt;br&gt;
&lt;/p&gt;
&lt;pre class="highlight html"&gt;&lt;code&gt;      &lt;span class="nt"&gt;&amp;lt;form&lt;/span&gt;
      &lt;span class="na"&gt;action=&lt;/span&gt;&lt;span class="s"&gt;"/process"&lt;/span&gt;
      &lt;span class="na"&gt;method=&lt;/span&gt;&lt;span class="s"&gt;"post"&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;gt;&lt;/span&gt; &lt;span class="nt"&gt;&amp;lt;input&lt;/span&gt; &lt;span class="na"&gt;name=&lt;/span&gt;&lt;span class="s"&gt;"fullUrl"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&amp;lt;/input&amp;gt;&amp;lt;input&lt;/span&gt; &lt;span class="na"&gt;name=&lt;/span&gt;&lt;span class="s"&gt;"shortUrl"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&amp;lt;/input&amp;gt;&lt;/span&gt;
   &lt;span class="nt"&gt;&amp;lt;/form&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Whenever user submit form we can catch &amp;amp; process the request in server.js file  like this&lt;br&gt;
&lt;/p&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;   &lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;post&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/process&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;


&lt;ul&gt;
&lt;li&gt;user filled values can be obtained from &lt;strong&gt;request&lt;/strong&gt; arg like
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;      &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;  &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;given&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="nx"&gt;input&lt;/span&gt; &lt;span class="nx"&gt;fields&lt;/span&gt;

     &lt;span class="c1"&gt;// In our case &lt;/span&gt;
      &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;fullUrl&lt;/span&gt;    
      &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;shortUrl&lt;/span&gt;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;We can check this
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;         &lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;post&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/process&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
           &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;fullUrl&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
           &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;shortUrl&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;We are able to get user request now 🎉&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;Let us add Database to our app now&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I prefer to use mongodb database in Mongo Atlas ( &lt;a href="https://docs.atlas.mongodb.com/getting-started/" rel="noopener noreferrer"&gt;check setup here&lt;/a&gt;  )&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Install mongoose &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; &lt;code&gt;npm install mongoose&lt;/code&gt; &lt;/li&gt;
&lt;li&gt;setup mongoose in app
&lt;/li&gt;
&lt;/ul&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;
   &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;mongoose&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;require&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;mongoose&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
   &lt;span class="c1"&gt;// mongo atlas setup&lt;/span&gt;
 &lt;span class="nx"&gt;mongoose&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;connect&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;  
 &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;mongoose_link&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;useNewUrlParser&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
 &lt;span class="na"&gt;useUnifiedTopology&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;replace above mongoose_link with your own.&lt;br&gt;
To get your link&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Go to your Cluster dashboard in Mongo Atlas
&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1603028800901%2FbElYwOWZD.png" alt="cluster.PNG"&gt;
&lt;/li&gt;
&lt;li&gt;Click Connect &amp;gt; Connect Your Application and then copy your link and replace &lt;strong&gt;Password&lt;/strong&gt; and &lt;strong&gt;dbname&lt;/strong&gt; with your password and database name&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Succesfully connected database to application.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Now, we have to design our database model schema&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;If you remember we decided to use shorturl  as primarykey
&lt;/li&gt;
&lt;/ul&gt;

&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;urlDbSchema&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;mongoose&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nc"&gt;Schema&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
&lt;span class="na"&gt;_shortUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
&lt;span class="na"&gt;type&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nb"&gt;String&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="na"&gt;require&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="p"&gt;},&lt;/span&gt;
&lt;span class="na"&gt;fullUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
&lt;span class="na"&gt;type&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nb"&gt;String&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="na"&gt;require&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="p"&gt;},&lt;/span&gt;
&lt;span class="na"&gt;count&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;type&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nb"&gt;Number&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;default&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
&lt;span class="p"&gt;});&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;



&lt;ul&gt;
&lt;li&gt;connect this model to DB so that we can use &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;const urlsDb = mongoose.model("urls", urlDbSchema);&lt;/p&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;/li&gt;

&lt;/ul&gt;

&lt;ul&gt;
&lt;li&gt;Now, our database is ready to operate.So, let us complete our &lt;strong&gt;post&lt;/strong&gt; request processing with database
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;post&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/process&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;userReqString&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;shortUrl&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
      &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;userReqString&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="c1"&gt;// user requested some string&lt;/span&gt;

      &lt;span class="c1"&gt;// checking if requested string is not taken already&lt;/span&gt;
    &lt;span class="o"&gt;/&lt;/span&gt;&lt;span class="nf"&gt;f &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;urlsDb&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;where&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;_shortUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;userReqString&lt;/span&gt; &lt;span class="p"&gt;}).&lt;/span&gt;&lt;span class="nx"&gt;countDocuments&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
       &lt;span class="c1"&gt;// if already exists redirecting to home page&lt;/span&gt;
       &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;redirect&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt; 
      &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="c1"&gt;// requested string available&lt;/span&gt;

      &lt;span class="c1"&gt;// create new entry to insert to DB&lt;/span&gt;
      &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;temp&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nf"&gt;urlsDb&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
        &lt;span class="na"&gt;fullUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;fullUrl&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="na"&gt;_shortUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;shortUrl&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="p"&gt;});&lt;/span&gt;
      &lt;span class="nx"&gt;urlsDb&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;insertMany&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;temp&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
          &lt;span class="c1"&gt;//{ error: "Oops..! Backend Error" },&lt;/span&gt;
          &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;redirect&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
          &lt;span class="c1"&gt;// success&lt;/span&gt;
          &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;redirect&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
            &lt;span class="p"&gt;}&lt;/span&gt;
          &lt;span class="p"&gt;});&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
       &lt;span class="c1"&gt;// user not requested any string &lt;/span&gt;
       &lt;span class="c1"&gt;// assign a random string&lt;/span&gt;
        &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;temp&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nf"&gt;urlsDb&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;fullUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;request&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;fullUrl&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;_shortUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; 
    &lt;span class="nf"&gt;getValidId&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
      &lt;span class="nx"&gt;urlsDb&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;insertMany&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;temp&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
          &lt;span class="c1"&gt;//{ error: "Oops..! Backend Error" },&lt;/span&gt;
            &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
          &lt;span class="c1"&gt;// success&lt;/span&gt;
          &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;redirect&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
            &lt;span class="p"&gt;}&lt;/span&gt;
          &lt;span class="p"&gt;});&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
          &lt;span class="p"&gt;});&lt;/span&gt;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;getValidId&lt;/strong&gt; function generates a random string that is not present yet in the database
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;
        &lt;span class="c1"&gt;// getValidId()&lt;/span&gt;
       &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;getValidId&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;randomId&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;getRandomId&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
      &lt;span class="k"&gt;while &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;urlsDb&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;where&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;_shortUrl&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;randomId&lt;/span&gt; &lt;span class="p"&gt;}).&lt;/span&gt;&lt;span class="nx"&gt;countDocuments&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="c1"&gt;// console.error("still in while");&lt;/span&gt;
        &lt;span class="nx"&gt;randomId&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;getRandomId&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
      &lt;span class="c1"&gt;// console.log("random " + randomId);&lt;/span&gt;
      &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;randomId&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;getRandomId&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;allowedChars&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt;
      &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;_0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
      &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;randomStr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;""&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
      &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="mi"&gt;13&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="nx"&gt;randomStr&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="nx"&gt;allowedChars&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nb"&gt;Math&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;floor&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nb"&gt;Math&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;random&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; 
        &lt;span class="nx"&gt;allowedChars&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;)];&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;

         &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;randomStr&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;


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

&lt;/div&gt;



&lt;p&gt;We almost completed our app&lt;br&gt;
The one thing left behind is to handle shorturl and redirect it to original one.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;When user requested some short url we will get a &lt;strong&gt;get&lt;/strong&gt; request for that particular url&lt;/li&gt;
&lt;li&gt;But scripting function to handle every url's get  request is impossible.So we have an option to generalize this&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;code&gt;app.get("/:keyword",callback)&lt;/code&gt; - handles get req for all urls in the form website.com/abcd.. and &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;this path string ( &lt;strong&gt;abcd&lt;/strong&gt; here ) can be obtained from &lt;strong&gt;request.params.keyword&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;


&lt;/blockquote&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt; app.get("/:shorturl", async (request, response) =&amp;gt; {
  const shorturl = request.params.shorturl;
  await urlsDb
    .findOne((error, result) =&amp;gt; {
      if (error) {
       // database error
        response.send(error);
      } else {
        if (result) {
        // redirect to original url (Http Status code-301)
        response.redirect(result.fullUrl);
        }
      }
    })
    .where({ _shortUrl: shorturl });
});

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

&lt;/div&gt;



&lt;p&gt;That's it.. Congro 🎉 we build our application 🥳&lt;/p&gt;

&lt;p&gt;The major step is Deploying.I want to deplot this for free as this is not for commercial purpose&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I decided to deploy to  &lt;a href="//heroku.com"&gt;heroku&lt;/a&gt; also I didnot find any better free alternatives to deploy Node JS  applications&lt;/li&gt;
&lt;/ul&gt;

&lt;ol&gt;
&lt;li&gt;Head over to  &lt;a href="https://devcenter.heroku.com/articles/getting-started-with-nodejs#set-up" rel="noopener noreferrer"&gt;heroku Node JS guide&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;Follow the steps until you &lt;strong&gt;deploy&lt;/strong&gt; the app
Your app is on Internet now 🥳🥳
But some people ( like me ) want to have this on custom domain (like mine minii.ml/ ) &lt;/li&gt;
&lt;li&gt;First register required domain name from any domain registrar ( I got mine from freenom . It offers free domain for 1 year so... )&lt;/li&gt;
&lt;li&gt;Then go to  &lt;a href="https://dashboard.heroku.com/" rel="noopener noreferrer"&gt;heroku dashboard&lt;/a&gt; and select your app&lt;/li&gt;
&lt;li&gt;Go to settings &amp;amp; scrolldown to &lt;strong&gt;Domains&lt;/strong&gt; section&lt;/li&gt;
&lt;li&gt;Click &lt;strong&gt;Add New Domain&lt;/strong&gt; and enter domain name &lt;/li&gt;
&lt;li&gt;Enter given DNS target to your domain or DNS Manager( I prefer to use  &lt;a href="https://www.cloudflare.com/%20as%20DNS%20Manager" rel="noopener noreferrer"&gt;cloudfare&lt;/a&gt;  as CNAME record&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1603032876481%2FDZ616W87z.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1603032876481%2FDZ616W87z.png" alt="cname.PNG"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If your choose to add this to subdomain like &lt;strong&gt;subdomain.domain.com&lt;/strong&gt;&lt;br&gt;
place &lt;strong&gt;subdomain&lt;/strong&gt; as domain name for root domains like &lt;strong&gt;domain.com&lt;/strong&gt; place &lt;strong&gt;@&lt;/strong&gt; in  domain name . and place DNS target given in heroku  here in target.&lt;/p&gt;

&lt;p&gt;After some time your app will be active on your domain..&lt;br&gt;
You succesfully created your own url shortener for free on domain of your wish 🥳🥳🎉🎉 &lt;br&gt;
If you like this &lt;strong&gt;Share&lt;/strong&gt; the post &lt;br&gt;
&lt;strong&gt;Like&lt;/strong&gt; this post and &lt;strong&gt;comment&lt;/strong&gt; to get next post on &lt;strong&gt;How to add some additional features to this app like displaying error , user's shortened links in a table etc&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>showdev</category>
      <category>productivity</category>
    </item>
    <item>
      <title>What are these customer care accounts(Spam)..?</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Sun, 04 Oct 2020 08:43:05 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/what-are-these-customer-care-accounts-spam-in4</link>
      <guid>https://dev.to/rajasekharguptha/what-are-these-customer-care-accounts-spam-in4</guid>
      <description>&lt;p&gt;Recently I came through 2 or 3 accounts &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;I don't know if I can mention their accounts.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--sup7me4G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/1yhnj0vnds7xh1sn8x6h.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--sup7me4G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/1yhnj0vnds7xh1sn8x6h.jpg" alt="Alt Text" width="880" height="1907"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;You can see in the above image that they are changing &lt;strong&gt;company names&lt;/strong&gt; from post to post but the number they are mentioning is same in all the posts..&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;What they are doing is simply writing posts in fashion&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;"X company customer care xxxxxxxxx/yyyyyyyyy"&lt;/strong&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;And again they are commenting the same &lt;strong&gt;n times&lt;/strong&gt; in those posts.&lt;/p&gt;

&lt;p&gt;Even their &lt;strong&gt;bio,work and all details&lt;/strong&gt; are the same..&lt;/p&gt;




&lt;blockquote&gt;
&lt;h1&gt;
  
  
  I think they are trying to mention fake customer care numbers for reputed companies so that people who googles for customer care numbers can be trapped
&lt;/h1&gt;
&lt;/blockquote&gt;




&lt;p&gt;Afterwards I got another question &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Why DEV ?&lt;br&gt;
Bcoz of its good ability to appear in Google search results . Even I searched in Google and I got their account in search results &lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--cHKLMXDy--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/hf1zju740kwerobqe1vm.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--cHKLMXDy--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/hf1zju740kwerobqe1vm.jpg" alt="Alt Text" width="880" height="1066"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;It's purely my opinion after observing their account details ,posts and comments&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Please Retweet this on twitter🙏&lt;/p&gt;
&lt;/blockquote&gt;


&lt;blockquote class="ltag__twitter-tweet"&gt;

  &lt;div class="ltag__twitter-tweet__main"&gt;
    &lt;div class="ltag__twitter-tweet__header"&gt;
      &lt;img class="ltag__twitter-tweet__profile-image" src="https://res.cloudinary.com/practicaldev/image/fetch/s--P92x9sFp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://pbs.twimg.com/profile_images/1307234768292020230/D9oNoWmS_normal.jpg" alt="Rajasekhar Guptha profile image"&gt;
      &lt;div class="ltag__twitter-tweet__full-name"&gt;
        Rajasekhar Guptha
      &lt;/div&gt;
      &lt;div class="ltag__twitter-tweet__username"&gt;
        @rajasekhar_24
      &lt;/div&gt;
      &lt;div class="ltag__twitter-tweet__twitter-logo"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ir1kO05j--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-f95605061196010f91e64806688390eb1a4dbc9e913682e043eb8b1e06ca484f.svg" alt="twitter logo"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="ltag__twitter-tweet__body"&gt;
      I recently came through a bunch of fake accounts trying to spread fake customer care numbers.&lt;br&gt;&lt;br&gt;BEWARE❌&lt;br&gt;&lt;br&gt;&lt;a href="https://twitter.com/hashtag/DEVCommunity"&gt;#DEVCommunity&lt;/a&gt;&lt;br&gt;&lt;a href="https://twitter.com/hashtag/spam"&gt;#spam&lt;/a&gt; &lt;a href="https://twitter.com/hashtag/fakepeople"&gt;#fakepeople&lt;/a&gt;&lt;br&gt;&lt;br&gt;&lt;a href="https://t.co/e3WdvemEHN"&gt;dev.to/rajasekhargupt…&lt;/a&gt;
    &lt;/div&gt;
    &lt;div class="ltag__twitter-tweet__date"&gt;
      08:46 AM - 04 Oct 2020
    &lt;/div&gt;


    &lt;div class="ltag__twitter-tweet__actions"&gt;
      &lt;a href="https://twitter.com/intent/tweet?in_reply_to=1312675475219574784" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--fFnoeFxk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-reply-action-238fe0a37991706a6880ed13941c3efd6b371e4aefe288fe8e0db85250708bc4.svg" alt="Twitter reply action"&gt;
      &lt;/a&gt;
      &lt;a href="https://twitter.com/intent/retweet?tweet_id=1312675475219574784" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--k6dcrOn8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-retweet-action-632c83532a4e7de573c5c08dbb090ee18b348b13e2793175fea914827bc42046.svg" alt="Twitter retweet action"&gt;
      &lt;/a&gt;
      &lt;a href="https://twitter.com/intent/like?tweet_id=1312675475219574784" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--SRQc9lOp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-like-action-1ea89f4b87c7d37465b0eb78d51fcb7fe6c03a089805d7ea014ba71365be5171.svg" alt="Twitter like action"&gt;
      &lt;/a&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/blockquote&gt;


&lt;h2&gt;
  
  
  Am I wrong ?
&lt;/h2&gt;

&lt;blockquote&gt;
&lt;p&gt;If I am thinking wrong please let me know &lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Do you guys have any idea about who are they ?&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Also let me know if I can mention their accounts &lt;/p&gt;
&lt;/blockquote&gt;

</description>
      <category>discuss</category>
      <category>meta</category>
    </item>
    <item>
      <title>Beyond console.log()</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Fri, 02 Oct 2020 07:58:24 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/beyond-console-log-1g0e</link>
      <guid>https://dev.to/rajasekharguptha/beyond-console-log-1g0e</guid>
      <description>&lt;p&gt;We all have been using console.log(), but many more options are available out there.Let us see them now&lt;/p&gt;

&lt;p&gt;The most useful type beyond &lt;strong&gt;log&lt;/strong&gt; is &lt;strong&gt;console.table()&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;console.table()&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Takes in JSON or an array and prints in table format
&lt;/li&gt;
&lt;li&gt;Very handy while visualising json objects and arrays
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Syntax:&lt;/p&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;       console.table({
              id: "1",
              key: "value",
                  count: 2,
          });
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fxdurz2y6jgi98l2u4z3g.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fxdurz2y6jgi98l2u4z3g.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;        console.table([
            {
                id: "1",
                key: "value",
                count: 2,
                },
             {
                 id: "2",
                 key: "value2",
                     count: 22,
               },
               {
                    id: "3",
                    key: "value3",
                        count: 5,
                       },
             ]);
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F14iyr8ynuy0bdfbjvmnr.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F14iyr8ynuy0bdfbjvmnr.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;The next useful method is &lt;strong&gt;error&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;console.error()&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;useful to differentiate errors from output logs while debugging&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F04y2gf22co4486vyt4jc.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F04y2gf22co4486vyt4jc.PNG" alt="Alt Text"&gt;&lt;/a&gt;           &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;red color &lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;Next one, useful while calculating &lt;strong&gt;runnning times&lt;/strong&gt; is &lt;strong&gt;time&lt;/strong&gt; method&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Time(time,timeLog,timeEnd)&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;To understand this, let us assume  scenario of a &lt;strong&gt;stopwatch&lt;/strong&gt;
&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fvsepbkvmpf05e322t25s.png" alt="Alt Text"&gt;

&lt;ul&gt;
&lt;li&gt;console.&lt;strong&gt;time&lt;/strong&gt;()

&lt;ul&gt;
&lt;li&gt;equivalent to stopwatch &lt;strong&gt;start&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;console.&lt;strong&gt;timeLog&lt;/strong&gt;()

&lt;ul&gt;
&lt;li&gt;like stopwatch &lt;strong&gt;lap/split&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;console.&lt;strong&gt;timeEnd&lt;/strong&gt;()

&lt;ul&gt;
&lt;li&gt;stopwatch &lt;strong&gt;end&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;It works on basis of  &lt;strong&gt;label&lt;/strong&gt;. Label should be the same to get expected output&lt;/p&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.time("ForLoop");  // "ForLoop" is label here
for (let i = 0; i &amp;lt; 5; i++) {
console.timeLog('ForLoop'); 
  }
console.timeEnd("ForLoop");
&lt;/code&gt;&lt;/pre&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F3vasc1sm4ihofnhczief.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F3vasc1sm4ihofnhczief.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Next one is &lt;strong&gt;warning&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;console.warn();&lt;br&gt;
            &lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F8dqzqpd7adgou203vr5k.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F8dqzqpd7adgou203vr5k.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;yellow color &lt;/li&gt;
&lt;li&gt;For warnings&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;console.&lt;strong&gt;assert&lt;/strong&gt;()&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;code&gt;console.assert(assert_statement,message)&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;evaluate assertion statement and if it is &lt;strong&gt;false&lt;/strong&gt; displays the message&lt;/p&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    if(3!=2){
console.error({ msg1: "msg1", msg2: "msg2" });
}
-----------same as---------
console.assert(3 === 2, { msg1: "msg1", msg2: "msg2" });
&lt;/code&gt;&lt;/pre&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F7th14kqk1cymnj2k8qxp.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F7th14kqk1cymnj2k8qxp.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;console.assert(assert_statement,message,args)&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.assert(false, "%d nd type for  %s ",2,"console.assert() method");
&lt;/code&gt;&lt;/pre&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fcr8laxb6jbmxwrdveico.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fcr8laxb6jbmxwrdveico.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;Useful method for &lt;strong&gt;counting&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;console.&lt;strong&gt;count&lt;/strong&gt;()&lt;br&gt;
works on basis of &lt;strong&gt;label&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;console.count(label)&lt;/p&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    for (let i = 0; i &amp;lt; 3; i++) {
      console.count("label");
      console.count();
      console.count(i);
    }

    // output for
    console.count()  console.count("label")   console.count(i)
    default: 1              label: 1                0: 1
    default: 2              label: 2                1: 1
    default: 3              label: 3                2: 1
&lt;/code&gt;&lt;/pre&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;console.count()&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; if no label is mentioned it will consider &lt;strong&gt;default&lt;/strong&gt; as label&lt;/li&gt;
&lt;li&gt;The problem with &lt;strong&gt;default&lt;/strong&gt; is it will continue the count like this 
&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fa2icg0tlhjtxgtq5g2ja.PNG" alt="Alt Text"&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;&lt;p&gt;console.countReset(label)&lt;/p&gt;&lt;/li&gt;

&lt;li&gt;&lt;p&gt;resets count of  specified label to &lt;strong&gt;0&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;

&lt;/ul&gt;

&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;I mentioned only few methods which I think are more helpful.To check all the available methods refer &lt;a href="https://developer.mozilla.org/en-US/docs/Web/API/console" rel="noopener noreferrer"&gt;here&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://twitter.com/rajasekhar_24" rel="noopener noreferrer"&gt;Twitter&lt;/a&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>todayisearched</category>
    </item>
    <item>
      <title>Which BaaS (Backend as a Service) do you use/prefer?</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Tue, 22 Sep 2020 06:02:40 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/which-baas-backend-as-a-service-do-you-use-prefer-580p</link>
      <guid>https://dev.to/rajasekharguptha/which-baas-backend-as-a-service-do-you-use-prefer-580p</guid>
      <description></description>
      <category>webdev</category>
      <category>android</category>
      <category>discuss</category>
      <category>database</category>
    </item>
    <item>
      <title>Dev Card</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Mon, 21 Sep 2020 12:35:14 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/dev-card-bkl</link>
      <guid>https://dev.to/rajasekharguptha/dev-card-bkl</guid>
      <description>&lt;p&gt;A minimal portifolio card for developers (DevCard) 💙  &lt;/p&gt;

&lt;p&gt;Github:- &lt;a href="https://github.com/RajasekharGuptha/DevCard"&gt;https://github.com/RajasekharGuptha/DevCard&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Don't forget to give ⭐ if you like it. &lt;/p&gt;

&lt;p&gt;&lt;iframe src="https://codesandbox.io/embed/rd3mf"&gt;
&lt;/iframe&gt;
&lt;br&gt;
You can make it your's with simple changes.&lt;/p&gt;

&lt;p&gt;I have used:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;HTML5 &lt;/li&gt;
&lt;li&gt;CSS3&lt;/li&gt;
&lt;li&gt;Icons: Font Awesome&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Making it Yours&lt;/strong&gt;&lt;/p&gt;

&lt;h1&gt;
  
  
  Clone this repository
&lt;/h1&gt;

&lt;p&gt;$ git clone &lt;a href="https://github.com/RajasekharGuptha/DevCard.git"&gt;https://github.com/RajasekharGuptha/DevCard.git&lt;/a&gt;&lt;br&gt;&lt;br&gt;
or&lt;br&gt;&lt;br&gt;
just fork this repository  &lt;/p&gt;

&lt;p&gt;(Ignore &lt;strong&gt;&lt;em&gt;&lt;em&gt;readme_images&lt;/em&gt;&lt;/em&gt;&lt;/strong&gt; folder)&lt;/p&gt;

&lt;p&gt;Make it yours with these simple changes.  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;In index.html :&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--p5hGTwwv--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/acwasfhkbot56p7mxs7h.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--p5hGTwwv--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/acwasfhkbot56p7mxs7h.png" alt="Dev name" width="527" height="295"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Change Dev_name to your name (highlighted above)&lt;/li&gt;
&lt;li&gt;Add your Description&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--0jiwHbrv--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/joxdcr8nm9ebyp79xeev.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--0jiwHbrv--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/joxdcr8nm9ebyp79xeev.png" alt="Social Media" width="693" height="706"&gt;&lt;/a&gt;  &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;replace my links with your's (highlighted above)&lt;/li&gt;
&lt;li&gt;Comment or un comment icons as per your wish&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--GoFzIuOQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/lfdipdeaipwh8vb9qpuk.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--GoFzIuOQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/lfdipdeaipwh8vb9qpuk.png" alt="Website" width="666" height="63"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;replace with your website or blog link or comment it out if you don't want to.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;After making changes deploy it.  &lt;/p&gt;

&lt;p&gt;I highly recommend Github Pages to deploy as it is so simple  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Add modified files to your repository and enable Github pages in repository settings..&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Feel free to contribute and take &lt;strong&gt;DevCard&lt;/strong&gt; to further level&lt;/p&gt;

&lt;p&gt;Consider following on &lt;a href="https://twitter.com/rajasekhar_24"&gt;twitter&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>showdev</category>
      <category>html</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Which Backend do you use ..?</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Sun, 20 Sep 2020 15:25:10 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/which-backend-do-you-use-2h3i</link>
      <guid>https://dev.to/rajasekharguptha/which-backend-do-you-use-2h3i</guid>
      <description></description>
      <category>discuss</category>
      <category>webdev</category>
      <category>android</category>
    </item>
    <item>
      <title>What are your favourite VS Code extensions..?</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Sun, 20 Sep 2020 04:42:04 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/what-are-your-favourite-vs-code-extensions-33n1</link>
      <guid>https://dev.to/rajasekharguptha/what-are-your-favourite-vs-code-extensions-33n1</guid>
      <description>&lt;p&gt;Many of us love Visual Studio Code..&lt;br&gt;
What are your fav extensions/ setup..?&lt;/p&gt;

&lt;p&gt;My setup is in Comments.&lt;/p&gt;

&lt;p&gt;I'm on twitter now..&lt;a href="https://twitter.com/rajasekhar_24"&gt;Rajasekhar Guptha&lt;/a&gt;&lt;/p&gt;

</description>
      <category>discuss</category>
      <category>webdev</category>
      <category>vscode</category>
      <category>design</category>
    </item>
    <item>
      <title>Useful VS Code extensions for Web Dev..</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Sun, 20 Sep 2020 04:29:29 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/useful-vs-code-extensions-for-web-dev-1p52</link>
      <guid>https://dev.to/rajasekharguptha/useful-vs-code-extensions-for-web-dev-1p52</guid>
      <description>&lt;h2&gt;
  
  
  Tools
&lt;/h2&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight"&gt;Color Highlight&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;styles css/web color codes in code.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--jIU25un5--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/color_highlight_extension.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jIU25un5--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/color_highlight_extension.PNG" alt="" width="505" height="124"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode"&gt;Prettier Code Formatter&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;You can achieve &lt;strong&gt;Auto Format on Save&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Suppports JavaScript , TypeScript , Flow , JSX , JSON*,CSS , SCSS , Less, HTML , Vue , Angular, GraphQL , Markdown , YAML&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Install Prettier extension and enable &lt;strong&gt;Format on Save&lt;/strong&gt; in VS Code settings.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--kFG7JUI---/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/AutoFormatOnSave-min.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--kFG7JUI---/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/AutoFormatOnSave-min.gif" alt="" width="880" height="746"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag"&gt;Auto Rename Tag&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Automatically rename paired HTML/XML tag as you change them&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--yN3b7kmt--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/autorenametag-min.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--yN3b7kmt--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/autorenametag-min.gif" alt="" width="880" height="573"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css"&gt;Html Css Support&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Auto Completion of css ,scss classes , html attributes

&lt;ul&gt;
&lt;li&gt;Class attribute completion.&lt;/li&gt;
&lt;li&gt;Id attribute completion.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=pranaygp.vscode-css-peek"&gt;CSS Peek&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Ctrl+click&lt;/strong&gt; on class names takes to class in CSS/SCSS/LESS files&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--BgVzQ-8p--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/css_peek-min.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--BgVzQ-8p--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/css_peek-min.gif" alt="" width="571" height="562"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion"&gt;IntelliSense for CSS class names in HTML&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;CSS class name completion for the HTML &lt;code&gt;class&lt;/code&gt; attribute&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--WXXRRgaH--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/css_classname-min.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--WXXRRgaH--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/css_classname-min.gif" alt="" width="758" height="335"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=tht13.html-preview-vscode"&gt;HTML Preview&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Previews html as you type&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Ig0xCV-G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/html_preview.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Ig0xCV-G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/html_preview.PNG" alt="" width="880" height="195"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer"&gt;Live Server&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Launch a local development server with &lt;strong&gt;live reload&lt;/strong&gt; feature for static &amp;amp; dynamic pages.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--FnrMLcuD--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/live-server-min.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--FnrMLcuD--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/live-server-min.gif" alt="" width="880" height="471"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  UI plugins
&lt;/h2&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=akamud.vscode-theme-onedark"&gt;Atom Theme&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;for those who love &lt;strong&gt;Atom&lt;/strong&gt; Text Editor Theme like me&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--nK0pIZ0K--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/atom_theme.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--nK0pIZ0K--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/atom_theme.png" alt="" width="880" height="531"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme"&gt;Material Theme&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Cool looking theme&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--HRp4MRYO--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/material_theme.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--HRp4MRYO--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/material_theme.png" alt="" width="880" height="536"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme"&gt;Material Icons&lt;/a&gt;
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;displays icons according to file extensions&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--GzL6sSzP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/material_icons.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--GzL6sSzP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://rajasekharguptha.github.io/assets/images/webdvscodeextensions/material_icons.PNG" alt="" width="708" height="181"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>vscode</category>
      <category>webdev</category>
      <category>webpack</category>
    </item>
    <item>
      <title>Google Meet Assistant</title>
      <dc:creator>Rajasekhar Guptha</dc:creator>
      <pubDate>Wed, 09 Sep 2020 13:16:32 +0000</pubDate>
      <link>https://dev.to/rajasekharguptha/google-meet-assistant-3o88</link>
      <guid>https://dev.to/rajasekharguptha/google-meet-assistant-3o88</guid>
      <description>&lt;p&gt;B'coz of this pandemic situation our college have been conducting classes through Google Meet.And we can attend classes only through our college mail.This has been a big problem for us because every time meet will be opened with our default account.&lt;br&gt;
And again we have to play &lt;strong&gt;Switch Account&lt;/strong&gt; game..&lt;/p&gt;

&lt;p&gt;If you ever use &lt;strong&gt;&lt;em&gt;&lt;em&gt;Google Meet&lt;/em&gt;&lt;/em&gt;&lt;/strong&gt; for professional/college meets ,then you would also have encounter this problem of Switching Account from your default to professional one every time.&lt;/p&gt;

&lt;p&gt;The same problem comes with &lt;em&gt;&lt;em&gt;Classroom&lt;/em&gt;&lt;/em&gt; also.&lt;/p&gt;

&lt;p&gt;Now let's get rid of this problem using this &lt;strong&gt;Google Meet Assistant&lt;/strong&gt; which forwards meets to your professional/desired accounts on our behalf.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--crniOV31--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://miro.medium.com/max/278/1%2AFj9MXJUGxpcLhku1dw_nnw.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--crniOV31--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://miro.medium.com/max/278/1%2AFj9MXJUGxpcLhku1dw_nnw.png" alt="Meet Asst" width="222" height="142"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h3&gt;
  
  
  Github Repo
&lt;/h3&gt;



&lt;p&gt;&lt;code&gt;https://github.com/RajasekharGuptha/GoogleMeet-Mail-Switcher&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;h4&gt;
  
  
  How this works:
&lt;/h4&gt;

&lt;p&gt;When you enter link (similar to below one ) it will open with default google account.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://meet.google.com/xxx-xxxx-xxx"&gt;https://meet.google.com/xxx-xxxx-xxx&lt;/a&gt;&lt;br&gt;
After switching account the link changes to some thing like this&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://meet.google.com/xxx-xxxx-xxx?pli=1&amp;amp;authuser=y"&gt;https://meet.google.com/xxx-xxxx-xxx?pli=1&amp;amp;authuser=y&lt;/a&gt;&lt;br&gt;
here y is your google account/user number as per accounts in chrome. &lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Chrome numbers your accounts starting from 0.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--6fESOzPv--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://miro.medium.com/max/548/1%2AAHiy8LX8kWKMQwZ1NxAQlA.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--6fESOzPv--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://miro.medium.com/max/548/1%2AAHiy8LX8kWKMQwZ1NxAQlA.png" alt="chrome numbering" width="438" height="787"&gt;&lt;/a&gt;&lt;br&gt;
So Whenever link corresponds to meet (similar to first link) redirect to changed link(second one)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;chrome.webRequest.onBeforeRequest.addListener(function (tabDetails) {
            var tabUrl = tabDetails.url;
            var req_url_extra = "?pli=1&amp;amp;authuser=" + googleAccountNumber; // user input
                var redirect_url = tabUrl + req_url_extra;
                return { redirectUrl: redirect_url };
             }
            , {
                urls: ["https://meet.google.com/*"],

              // https://meet.google.com/* is
              // regex for google meet links

                types: ["main_frame", "sub_frame", "stylesheet",
"script", "image", "object", "xmlhttprequest", "other"]
            },
            ['blocking']
        )  
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This handles most of the cases..&lt;br&gt;&lt;br&gt;
But in cases like this&lt;/p&gt;

&lt;p&gt;&lt;a href="https://meet.google.com/xxx-xxxx-xxx?pli=1&amp;amp;authuser=z"&gt;https://meet.google.com/xxx-xxxx-xxx?pli=1&amp;amp;authuser=z&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;User desired mail is y but url is related to z To handle these type of cases we need to do modification to our prev code..&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;chrome.webRequest.onBeforeRequest.addListener(function (tabDetails) {
          var tabUrl = tabDetails.url;
          var req_url_extra = "?pli=1&amp;amp;authuser=" + googleAccountNumber;

          //?pli=1&amp;amp;authuser=y required addition to link

          // check if ?pli=1&amp;amp;authuser=y is there in input link
          // if it is there then no need of modifying link
          if (!tabUrl.includes(req_url_extra)) {
            // to handle case 3 https://meet.google.com/xxx-xxxx-xxx?pli=1&amp;amp;authuser=z
            // check if ? is there in link
            // presence of ? indicates link of type 3 
              if (tabUrl.includes('?')) {
                // removing ?pli=1&amp;amp;authuser=z part
                  tabUrl = tabUrl.split('?')[0];
              }
              // adding ?pli=1&amp;amp;authuser=y 
              var redirect_url = tabUrl + req_url_extra;
              return { redirectUrl: redirect_url };
          }
          else {

              return { redirectUrl: tabUrl };
          }

      }
          , {
              urls: ["https://meet.google.com/*"],
              types: ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
          },
          ['blocking']
      )
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Similar method for classroom links&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;regex for classroom links: &lt;a href="https://classroom.google.com/*"&gt;https://classroom.google.com/*&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;Link for Default account: &lt;a href="https://classroom.google.com"&gt;https://classroom.google.com&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;Link for accounts with user number: &lt;a href="https://classroom.google.com/u/y/h"&gt;https://classroom.google.com/u/y/h&lt;/a&gt;     y - desired account number&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Check my &lt;a href="http://rajasekharguptha.github.io/"&gt;B.log&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I am looking forward to add 2 more options..

&lt;ul&gt;
&lt;li&gt;Mute &lt;/li&gt;
&lt;li&gt;Switch Off Camera  whenever mute page loads&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;By &lt;a class="mentioned-user" href="https://dev.to/rajasekharguptha"&gt;@rajasekharguptha&lt;/a&gt;
&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>googlemeet</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
