<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Akshit Garg</title>
    <description>The latest articles on Forem by Akshit Garg (@gargakshit).</description>
    <link>https://forem.com/gargakshit</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%2F122744%2F95c285b3-2bf1-4aa2-afcc-113323e7b9be.jpg</url>
      <title>Forem: Akshit Garg</title>
      <link>https://forem.com/gargakshit</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/gargakshit"/>
    <language>en</language>
    <item>
      <title>How was your 2020?</title>
      <dc:creator>Akshit Garg</dc:creator>
      <pubDate>Wed, 30 Dec 2020 19:32:41 +0000</pubDate>
      <link>https://forem.com/gargakshit/how-was-your-2020-15a0</link>
      <guid>https://forem.com/gargakshit/how-was-your-2020-15a0</guid>
      <description>&lt;p&gt;2020 is almost over! 🥳&lt;/p&gt;

&lt;p&gt;This was a tough and different year to get through, and working from home was an entirely new experience for some.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Going past this year — what is something you will look back to?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Everything counts — big or small 🎉&lt;/p&gt;

&lt;p&gt;Examples include:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Learning something new and exciting ✨&lt;/li&gt;
&lt;li&gt;The moment that made you go "wow" 🌟&lt;/li&gt;
&lt;li&gt;Developing a new habit 🧘‍♂️&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Wishing everyone a happy 2021! 🎈&lt;/p&gt;

</description>
      <category>discuss</category>
      <category>watercooler</category>
      <category>2020</category>
    </item>
    <item>
      <title>FizzBuzz - The vim way</title>
      <dc:creator>Akshit Garg</dc:creator>
      <pubDate>Tue, 17 Nov 2020 19:30:32 +0000</pubDate>
      <link>https://forem.com/gargakshit/fizzbuzz-the-vim-way-37ng</link>
      <guid>https://forem.com/gargakshit/fizzbuzz-the-vim-way-37ng</guid>
      <description>&lt;p&gt;Ever wanted to knock the socks off your interviewer? This article is for you.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is FizzBuzz?
&lt;/h2&gt;

&lt;p&gt;FizzBuzz is 2 player children's game, where you count upwards from 1, and every time there is a multiple of 3, you say Fizz instead of the number, and every time there is a multiple of 5, you say Buzz. And when there is a multiple of both 3 and 5, you say FizzBuzz. This is also a classic interview question, where the interviewer asks you to write a program that outputs FizzBuzz for the number 1 to 50.&lt;/p&gt;

&lt;h2&gt;
  
  
  Vim macros
&lt;/h2&gt;

&lt;p&gt;According to the &lt;a href="https://vim.fandom.com/wiki/Macros"&gt;Vim tips wiki&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Recording a macro is a great way to perform a one-time task, or to get things done quickly when you don't want to mess with Vim script or mappings, or if you do not yet know how to do it more elegantly.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;So in a nutshell, it allows to record a certain sequence of manipulations and repeat them as and when we want.&lt;/p&gt;

&lt;p&gt;Macros can be assigned to a letter or number, so a lot of macros can be recorded.&lt;/p&gt;

&lt;h3&gt;
  
  
  How do record a macro?
&lt;/h3&gt;

&lt;p&gt;To start recording macros, enter command mode by pressing &lt;code&gt;&amp;lt;Esc&amp;gt;&lt;/code&gt;. There you can press &lt;code&gt;q&lt;/code&gt; followed by the letter / number to assign the macro to. Then you can do the manipulations, and press &lt;code&gt;q&lt;/code&gt; again to stop recording.&lt;/p&gt;

&lt;p&gt;We record a simple macro to insert the word &lt;code&gt;Hello&lt;/code&gt; followed by a new line. Start the recording by pressing &lt;code&gt;qw&lt;/code&gt; and then enter insert mode to type hello followed by a new line, and then close the macro by pressing &lt;code&gt;q&lt;/code&gt; in command mode. This records your macro to the key &lt;code&gt;w&lt;/code&gt;. The macro can be re-played using &lt;code&gt;@w&lt;/code&gt; in command mode.&lt;/p&gt;

&lt;h2&gt;
  
  
  FizzBuzz
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Warning:&lt;/strong&gt; the following section assumes that you know the basics of text manipulation in vim.&lt;/p&gt;

&lt;h3&gt;
  
  
  Step 1 - Inserting the numbers
&lt;/h3&gt;

&lt;p&gt;For this, we will start with a blank line (this will help in later macros). So insert &lt;code&gt;1&lt;/code&gt; in the 2nd line. We will record our first macro which will duplicate the current line, and increment the number by 1. Start the recording on the letter &lt;code&gt;p&lt;/code&gt; using &lt;code&gt;qp&lt;/code&gt;. Type the following in command mode&lt;br&gt;
&lt;/p&gt;

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

&lt;/div&gt;


&lt;p&gt;Seems complex? Trust me it isn't. Let me do a break-down here.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;yy&lt;/code&gt; yanks the current line (1) into the clipboard&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;p&lt;/code&gt; pasts the yanked buffer&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;C-a&lt;/code&gt; increments the current number by 1, giving 2&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;q&lt;/code&gt; closes the recording.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;As we will do it 50, let's replay the macro 48 more times. &lt;code&gt;48@p&lt;/code&gt; will replay the macro 48 times.&lt;/p&gt;

&lt;p&gt;Here is an asciinema for step 1&lt;/p&gt;


&lt;div class="ltag_asciinema"&gt;
  
&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 2 - Fizz
&lt;/h3&gt;

&lt;p&gt;First, we will go to the top of the file using &lt;code&gt;gg&lt;/code&gt;. The numbers at the multiples of 3 have to be replaced with "Fizz". We will start by recording a new macro on the key &lt;code&gt;o&lt;/code&gt;. Start the recording using &lt;code&gt;qo&lt;/code&gt;, and as before, type the following in command mode.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;3j0d$iFizz&amp;lt;esc&amp;gt;q
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;Again, this might seem complex, so let me give a breakdown&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;3j&lt;/code&gt; moves the cursor 3 lines down&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;0&lt;/code&gt; moves the cursor at the start of the line&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;d$&lt;/code&gt; removes everything till the end of the line&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;i&lt;/code&gt; activates the insert mode, and subsequently we type "Fizz"&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;&amp;lt;esc&amp;gt;&lt;/code&gt; drops us back into the command mode&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;q&lt;/code&gt; stops the recording.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;We will now again move to the top of the buffer, and play this macro 16 times (as (int) 50 / 3 = 16) using &lt;code&gt;16@o&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Here is an asciinema for step 2&lt;/p&gt;


&lt;div class="ltag_asciinema"&gt;
  
&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 3 - Buzz
&lt;/h3&gt;

&lt;p&gt;Just like step 2, we will go to the top of the file using &lt;code&gt;gg&lt;/code&gt;. Now the numbers at the multiples of 5 need to be replaced with "Buzz". We will start a new recording on the key &lt;code&gt;i&lt;/code&gt;. Start the recording with &lt;code&gt;qo&lt;/code&gt;. And again, here is a dump of the commands&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;5j0d$iBuzz&amp;lt;esc&amp;gt;q
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;This might look familiar, but here is a breakdown again&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;5j&lt;/code&gt; moves the cursor 5 lines down&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;0&lt;/code&gt; moves the cursor at the start of the line&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;d$&lt;/code&gt; removes everything till the end of the line&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;i&lt;/code&gt; activates the insert mode, and subsequently we type "Buzz"&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;&amp;lt;esc&amp;gt;&lt;/code&gt; drops us back into the command mode&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;q&lt;/code&gt; stops the recording.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;We will now again move to the top of the buffer, and play this macro 10 times (as (int) 50 / 5 = 10) using &lt;code&gt;10@i&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Here is an asciinema for step 3&lt;/p&gt;


&lt;div class="ltag_asciinema"&gt;
  
&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 4 - FizzBuzz
&lt;/h3&gt;

&lt;p&gt;The numbers having both 3 and 5 as its factors should be replaced with "FizzBuzz". Here we again start by moving to the top of the buffer. This time, we will record the macro on the key &lt;code&gt;u&lt;/code&gt;. The following commands may seem familiar this time&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;15j0d$iFizzBuzz&amp;lt;esc&amp;gt;q
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;Here is a breakdown, yet again&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;15j&lt;/code&gt; moves the cursor 15 lines down&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;0&lt;/code&gt; moves the cursor at the start of the line&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;d$&lt;/code&gt; removes everything till the end of the line&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;i&lt;/code&gt; activates the insert mode, and subsequently we type "FizzBuzz"&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;&amp;lt;esc&amp;gt;&lt;/code&gt; drops us back into the command mode&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;q&lt;/code&gt; stops the recording.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Why move 15 lines down? Well... the numbers having both 3 and 5 as factors should have 15 as a factor. This time, we will play this macro 3 times (as (int) 50 / 15 = 3). After moving to the top, run &lt;code&gt;3@u&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Here, again, is an asciinema&lt;/p&gt;


&lt;div class="ltag_asciinema"&gt;
  
&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 5 - The master macro
&lt;/h3&gt;

&lt;p&gt;Just to show the power of macros, we will combine all the previously recorded macros in a single, master macro which will play all the macros. This time, we will record it on the key &lt;code&gt;p&lt;/code&gt;. After opening a new file, and recording using &lt;code&gt;pp&lt;/code&gt;, insert a new line and "1". After that,&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;49@pgg16@ogg10@igg3@uggddq
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;This seems complex? Well it isn't, here, again is a breakdown&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;49@p&lt;/code&gt; will play the macro &lt;code&gt;o&lt;/code&gt; 49 times, generating the sequence of numbers till 50&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;gg16@o&lt;/code&gt; will move the cursor to the top, and play back the "Fizz" macro 16 times&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;gg10@i&lt;/code&gt; will move the cursor to the top again, and play back the "Buzz" macro 10 times&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;gg3@u&lt;/code&gt; will again move the cursor to the top, and play back the "FizzBuzz" macro 3 times&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;ggdd&lt;/code&gt; will remove the extra line at the top, and finally&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;q&lt;/code&gt; will close the macro&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;
  
  
  The final result
&lt;/h2&gt;


&lt;div class="ltag_asciinema"&gt;
  
&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;Inspired by Ben Awad's &lt;a href="https://www.youtube.com/watch?v=mZWsyUKwTbg"&gt;FizzBuzz - You Suck at Coding [0]&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

</description>
      <category>vim</category>
      <category>productivity</category>
    </item>
    <item>
      <title>How I added my Spotify statistics to my GitHub readme 📜</title>
      <dc:creator>Akshit Garg</dc:creator>
      <pubDate>Fri, 24 Jul 2020 10:50:24 +0000</pubDate>
      <link>https://forem.com/gargakshit/how-i-added-my-spotify-statistics-to-my-github-readme-4jdd</link>
      <guid>https://forem.com/gargakshit/how-i-added-my-spotify-statistics-to-my-github-readme-4jdd</guid>
      <description>&lt;p&gt;So there was a new GitHub feature spotted in the wild, where you could have a README on your GitHub profile. So I had an idea, why not build a dynamic README using GitHub actions&lt;/p&gt;

&lt;h2&gt;
  
  
  GitHub profile README
&lt;/h2&gt;

&lt;p&gt;So what is that GitHub profile README thingy? Its a cool new feature by GitHub which allows you to have a README on your profile. Sounds cool? Surely it is. Time to get creative 😋.&lt;/p&gt;

&lt;h2&gt;
  
  
  How did I include the Spotify stats on my README?
&lt;/h2&gt;

&lt;h4&gt;
  
  
  Part 1: Introduction
&lt;/h4&gt;

&lt;p&gt;The Spotify API allows you to fetch a ton of info, including your liked tracks, your saved albums and your playlists. It requires an OAuth2 authentication for the API&lt;/p&gt;

&lt;h4&gt;
  
  
  Part 2: Getting an OAuth2 token
&lt;/h4&gt;

&lt;p&gt;So to access the Spotify API, you need to have an OAuth2 token. So how do we get one? Well, the answer is really easy. So we will do it in NodeJS, as I am really comfortable with it. So first, we need to install some dependencies. We will use yarn for it, however, npm will work just fine too.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;yarn add isomorphic-unfetch express dotenv
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;We installed 3 dependencies here, but &lt;code&gt;express&lt;/code&gt; and &lt;code&gt;dotenv&lt;/code&gt; are only required to obtain a token. So how do we obtain it? Firstly, we need and OAuth2 &lt;code&gt;client_id&lt;/code&gt; and &lt;code&gt;client_secret&lt;/code&gt;. Visit &lt;a href="https://developer.spotify.com/documentation/general/guides/authorization-guide/" rel="noopener noreferrer"&gt;here&lt;/a&gt; to learn more.&lt;br&gt;
&lt;/p&gt;
&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;

&lt;p&gt;&lt;br&gt;&lt;br&gt;
So what we did here was used the Spotify API to obtain an &lt;code&gt;access_token&lt;/code&gt; and a &lt;code&gt;refresh_token&lt;/code&gt;. Keep both of them safe, as we need them for later use.&lt;/p&gt;

&lt;h4&gt;
  
  
  Part 3: The self updating README
&lt;/h4&gt;

&lt;p&gt;So now create a README.template.md with replacement tags like &lt;code&gt;I like {sp_liked} songs accross {sp_abl} albums. I have {sp_pl} playlists of awesome music&lt;/code&gt;. Now we need to create an &lt;code&gt;index.js&lt;/code&gt; file which does all the magic.&lt;br&gt;
&lt;/p&gt;
&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;
&lt;br&gt;
Here, we use the &lt;code&gt;refresh_token&lt;/code&gt;, the &lt;code&gt;client_id&lt;/code&gt; and the &lt;code&gt;client_secret&lt;/code&gt; to get a new &lt;code&gt;access_token&lt;/code&gt; and get our profile information. As a bonus, I also used the &lt;a href="https://programming-quotes-api.herokuapp.com/" rel="noopener noreferrer"&gt;Programming Quotes API&lt;/a&gt; to get the quote of the hour.

&lt;h4&gt;
  
  
  Part 4: Putting it all together
&lt;/h4&gt;

&lt;p&gt;Now we have created the scripts, we need to automate it to update the README every hour. For this, we will use GitHub's actions.&lt;br&gt;
Before that, we need to put out &lt;code&gt;refresh_token&lt;/code&gt;, the &lt;code&gt;client_id&lt;/code&gt; and the &lt;code&gt;client_secret&lt;/code&gt; in out GitHub secrets as we will need them for the action.&lt;br&gt;
&lt;/p&gt;
&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;
&lt;br&gt;
Here, we run the action every hour, and boom, the magic happens :P

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;The finished README&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%2Fngnp5htamtsfz8lrhq62.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%2Fngnp5htamtsfz8lrhq62.png" alt="The finished README"&gt;&lt;/a&gt;&lt;br&gt;
This was my first dev article, please comment on how can I improve them. Also, don't forget to checkout my &lt;a href="https://github.com/gargakshit" rel="noopener noreferrer"&gt;README&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>github</category>
      <category>showdev</category>
      <category>javascript</category>
    </item>
  </channel>
</rss>
