I wanted to start blogging in Aug of 2020. I decided to use @hashnode for my blog. It was the best decision that I made.
I wrote 27 technical articles so far. Most of them are about frontend web development.
A thread ๐งต about each of these articles including the stats below ๐
This started as a Twitter thread. But it became so long that I decided to turn it into a blog post.
๐๐๐ด ๐ญ๐ญ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฑ๐ฑ ๐ง๐๐ฝ๐ฒ๐๐ฐ๐ฟ๐ถ๐ฝ๐ ๐๐ผ ๐๐ผ๐๐ฟ ๐ก๐ฒ๐
๐.๐ท๐ ๐ฝ๐ฟ๐ผ๐ท๐ฒ๐ฐ๐ (๐ญ/๐ฎ๐ณ)
It was when I just started learning React and started exploring Next.js and TypeScript. I was surprised to see how easy it was to add TypeScript to a Next.js project...
I thought to write a blog post about it to show it to others - more importantly for me to refer back to it when needed. I didn't want to spend time creating a blog. I wanted to start blogging right away...
Fortunately, I heard about @hashnode from a friend of mine and decided to give it a try. The selling factor for me about @hashnode was the ability to bring my own domain for my blog and the automatic backup of the articles on my own GitHub repo...
At that time, I didn't know that I was gonna write more than 1 article or that even anyone would wanna read the things that I write. But regardless, I went ahead and published my first article.
On the first day, the article has got around 20 views...
My main motive for writing articles was that they would act as a journal for whatever I was learning - so that I can get back to those when in need. So, I was more than happy with even 20 people reading it...
This is that article.
As you can see, it's a very short article with a bunch of screenshots pasted together...
At the time of writing this tweet, this article has got about ๐ฎ๐ด๐ฑ views. I myself have referred to it many times.
I decided to write even more articles at that time. And then my journey of tech blogging took off...
๐๐๐ด ๐ญ๐ฎ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ข๐ฝ๐๐ถ๐บ๐ถ๐๐ฒ ๐ฌ๐ผ๐๐ฟ ๐ช๐ฒ๐ฏ๐๐ถ๐๐ฒ ๐๐ผ๐ฟ ๐ฆ๐ผ๐ฐ๐ถ๐ฎ๐น ๐ ๐ฒ๐ฑ๐ถ๐ฎ ๐ฃ๐น๐ฎ๐๐ณ๐ผ๐ฟ๐บ๐ (๐ฎ/๐ฎ๐ณ)
I was developing a website at that time. I noticed that when my website link is shared on platforms like Twitter...
I don't see any previews that I usually get when I share other links. I started exploring more about this and found out about meta tags and open graph protocol and also how some of the platforms like Twitter look for their own custom meta tags...
I decided to write an article about my findings and how/what meta tags to add to the website to make the platforms show nice previews for the website links that are being shared. I also added the tools that you can use to validate these tags in the article...
The result of this is the following article.
At the time of writing this tweet, this article has got around ๐ฎ๐ต๐ฐ views...
๐๐๐ด ๐ญ๐ฑ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฟ๐ฒ๐ฎ๐๐ฒ ๐๐๐๐๐ผ๐บ ๐ ๐ฎ๐ฟ๐ธ๐ฑ๐ผ๐๐ป ๐ฃ๐ฎ๐ฟ๐๐ฒ๐ฟ (๐ฏ/๐ฎ๐ณ)
I decided to write my first ever tutorial on how to create a markdown editor with the ability to embed YouTube videos, code sandboxes, code pens, etc...
I didn't know about MDX back then. That is a story for another time. In the markdown I know, it is not directly possible to embed things like YouTube videos and other things. But in one of my projects, I had this requirement...
So it seemed like a good tutorial that will be helpful to others and of-course as a reference to me in the future. I decided to split this into two articles. In hindsight, this was a mistake. I should have just written the article in a single go...
The first article in this two-part series is the following article.
At the time of writing this tweet, this article has got around ๐ฑ๐ฎ๐ญ views.
๐๐๐ด ๐ญ๐ฒ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ผ๐ ๐๐ผ ๐๐บ๐ฝ๐ผ๐ฟ๐ ๐ฆ๐ฉ๐๐ ๐ถ๐ป๐๐ผ ๐๐ผ๐๐ฟ ๐ก๐ฒ๐
๐.๐ท๐ ๐ฃ๐ฟ๐ผ๐ท๐ฒ๐ฐ๐? (๐ฐ/๐ฎ๐ณ)
This is the article that has got the most organic views from Google among all the other articles that I ever wrote until today...
Like all my other articles, this article came out of my need. I got a use-case where I had to use and import SVGs into my Next.js project. I searched around and found many solutions. Two solutions stood out for me - SVGR and babel-plugin-inline-react-svg...
I found the babel plugin to be easier to use and ended up using it. I then wrote about it in the following article detailing how people can use it in their own projects.
Up until today...
This article has been getting at least around 10 organic views for this article from Google every single day since then.
At the time of writing this tweet, the article has around 2.2K views...
๐๐๐ด ๐ญ๐ฒ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฟ๐ฒ๐ฎ๐๐ฒ ๐ก๐ฒ๐ ๐๐ผ๐ฑ๐ฒ๐ฃ๐ฒ๐ป๐ ๐ฎ๐ป๐ฑ ๐๐ผ๐ฑ๐ฒ๐ฆ๐ฎ๐ป๐ฑ๐ฏ๐ผ๐
๐ฒ๐ ๐๐ป๐๐๐ฎ๐ป๐๐น๐ ๐ช๐ถ๐๐ต ๐ญ๐๐ฅ๐ข ๐ฐ๐น๐ถ๐ฐ๐ธ๐ (๐ฑ/๐ฎ๐ณ)
This is a very short article that I wrote when I found out that CodePen and CodeSandbox launched short URLs...
...that can be used to set up sandboxes with your favorite framework configured. For example, to create a sandbox with Reactjs, you can just go to react.new and you are done. I decided to list down all such URLs in a blog post.
The result is the following very short article...
At the time of writing this tweet, this article has got around ๐ญ๐ญ๐ฐ views.
๐๐๐ด ๐ญ๐ด, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฃ๐ฟ๐ฒ๐๐ฒ๐ป๐ ๐ฅ๐ฒ๐๐ฒ๐ฟ๐๐ฒ ๐ง๐ฎ๐ฏ๐ป๐ฎ๐ฏ๐ฏ๐ถ๐ป๐ด ๐๐๐๐ฎ๐ฐ๐ธ๐ ๐ช๐ถ๐๐ต ๐ฃ๐ฟ๐ผ๐ฝ๐ฒ๐ฟ ๐ป๐ผ๐ผ๐ฝ๐ฒ๐ป๐ฒ๐ฟ, ๐ป๐ผ๐ฟ๐ฒ๐ณ๐ฒ๐ฟ๐ฟ๐ฒ๐ฟ, ๐ฎ๐ป๐ฑ ๐ป๐ผ๐ณ๐ผ๐น๐น๐ผ๐ ๐๐๐๐ฟ๐ถ๐ฏ๐๐๐ถ๐ผ๐ป - (๐ฒ/๐ฎ๐ณ)
This article came out of my search for the meaning of 'rel' attribute for anchor <a> tags.
Turns out that there is a security risk for not adding noopener/noreferrer value to 'rel' attribute when you set the link to open in a new tab...
I ended up writing the article about the same detailing what each of the values noopener, noreferrer, nofollow mean and when should you use each of them. I recently cross-posted this article to HackerNoon...
To my surprise, it is marked as a #hackernoon-top-story which I think is pretty amazing.
At the time of writing this tweet, this has got around ๐ญ.๐ฒ๐ views
HackerNoon link of the same article.
At the time of writing this tweet, this has got around ๐ฐ๐ฌ๐ณ views on HackerNoon...
๐๐๐ด ๐ฎ๐ฌ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฎ๐ฏ๐ฒ๐น ๐ฃ๐น๐๐ด๐ถ๐ป ๐ง๐ผ ๐ฅ๐ฒ๐บ๐ผ๐๐ฒ ๐๐ผ๐ป๐๐ผ๐น๐ฒ ๐๐ผ๐ด๐ ๐๐ป ๐ฃ๐ฟ๐ผ๐ฑ๐๐ฐ๐๐ถ๐ผ๐ป (๐ณ/๐ฎ๐ณ)
I always find myself leaving console logs in production which I should not...
I started looking for a solution to this problem and found a babel plugin that you can use to remove console logs automatically when deployed to production. I ended up writing a very short article detailing how to use this plugin...
At the time of writing this tweet, this article has got around ๐ญ๐ฐ๐ณ views...
๐๐๐ด ๐ฎ๐ฏ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐บ๐ฏ๐ฒ๐ฑ ๐ฌ๐ผ๐๐๐๐ฏ๐ฒ ๐ฉ๐ถ๐ฑ๐ฒ๐ผ๐ ๐ถ๐ป๐๐ผ ๐ฌ๐ผ๐๐ฟ ๐ ๐ฎ๐ฟ๐ธ๐ฑ๐ผ๐๐ป ๐๐ฑ๐ถ๐๐ผ๐ฟ (๐ด/๐ฎ๐ณ)
Remember the 3rd article where I started a 2-part tutorial series about creating a custom markdown editor...
...this is the other part. I wrote this after writing 4 other completely unrelated articles. I should have written both of these in a single article or I should have written this immediately after the first one...
At the time of writing this tweet, this article has got around ๐ญ๐ฏ๐ญ views.
๐๐๐ด ๐ฎ๐ฒ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ง๐๐: ๐๐๐ฝ๐ต๐ฒ๐ป๐ฎ๐๐ฒ ๐๐ต๐ฒ๐ป ๐๐ผ๐ ๐ท๐๐๐๐ถ๐ณ๐ ๐๐ฒ๐
๐ (๐ต/๐ฎ๐ณ)
This article is the first and the last ๐
article in which I wrote something new that I learned that day.
This article is about the CSS property hyphens which I did not know about then.
At the time of writing this tweet, this article has got around ๐ญ๐ฌ๐ฐ views.
๐๐๐ด ๐ฎ๐ด, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ช๐ต๐ ๐๐ผ๐ ๐๐ต๐ผ๐๐น๐ฑ ๐๐๐ฎ๐ฟ๐ ๐๐๐ถ๐ป๐ด ๐๐ฆ๐ ๐ฐ๐ผ๐น๐ผ๐ฟ ๐ณ๐ผ๐ฟ๐บ๐ฎ๐ (๐ญ๐ฌ/๐ฎ๐ณ)
This is the article on which I have spent a huge amount of time to write among all of the previous 9 articles that I have written until then.
This article is about the HSL color format and why I think more people should start using it. I found the HSL color system to be more intuitive and closer to how humans perceive color. I wrote about what each of H, S and L mean in HSL...
...and how easy it is to create color schemes like Complementary Colors, Split Complementary Colors, Different shades of the same color using HSL color system.
At the time of writing this tweet, this article has got around ๐ฒ๐ญ๐ฌ views.
๐๐๐ด ๐ฎ๐ต, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฟ๐ฒ๐ฎ๐๐ฒ ๐ฌ๐ผ๐๐ฟ ๐ข๐๐ป ๐ฆ๐๐ฝ๐ฒ๐ฟ ๐ฆ๐ถ๐บ๐ฝ๐น๐ฒ ๐จ๐ฅ๐ ๐ฆ๐ต๐ผ๐ฟ๐๐ฒ๐ป๐ฒ๐ฟ (๐ญ๐ญ/๐ฎ๐ณ)
This blog post came out when I came across the following quoted tweet from @kentcdodds
The tweet contains a link to a youtube video where he explained about the npm package that he made which can be used to create a super simple URL shortener. I found the concept behind it to be genius. They are making use of Netlify Redirects to create a URL shortener...
My immediate reaction was that why didn't I think of that. Nevertheless, I ended up using the same package to create my own URL shortener to shorten many of my links. I ended up writing an article about the same, hoping that more people would benefit from this package.
At the time of writing this tweet, this article has got around ๐ฑ๐ณ๐ฏ views.
This was the final article in the month of August...
I wrote a total of 11 articles in that month, a feat which I am never going to repeat. I had no schedule when I was writing these articles. I wrote and published articles whenever I felt like it - which was a mistake on my part.
I eventually figured out that consistency is far more important than writing a lot of articles at once. Eventually, I stuck to the schedule of writing 2 articles per week which helped me a lot more than writing whenever I felt like it.
It is a lot better to write a single article every two weeks than writing 10 articles in a week and then not writing anything for more than a month or two.
I now strongly believe that Consistency is the key to get things done or to get better in anything including writing.
๐ฆ๐ฒ๐ฝ ๐ฎ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐๐ป๐ฑ๐ฎ๐บ๐ฒ๐ป๐๐ฎ๐น๐ (๐ญ๐ฎ/๐ฎ๐ณ)
I just found out about EpicReact.Dev workshops by @kentcdodds just then. I found that the source code of these workshops is open source...
I decided to go through them on my own before the course is actually released. This article is a result of that. I went through the React Fundamentals workshop and wrote about what I learned in my own words -- mainly to reinforce what I learned....
It was then I decided to buy #EpicReactDev as soon as it gets released. And I did just that later.
This is the article which I wrote.
At the time of writing this tweet, this article has got around 1.6K views...
In the following days, I got covid and decided to take a break from everything.
After about a month later, EpicReact.Dev got released and I immediately bought it. It was the best decision ever...
๐ข๐ฐ๐ ๐ฑ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ ๐ ๐ฅ๐ฒ๐๐ถ๐ฒ๐ ๐ผ๐ณ ๐๐ฒ๐ป๐ ๐. ๐๐ผ๐ฑ๐ฑ๐'๐ ๐๐ฝ๐ถ๐ฐ๐ฅ๐ฒ๐ฎ๐ฐ๐.๐๐ฒ๐: ๐๐ป๐๐ฟ๐ผ๐ฑ๐๐ฐ๐๐ถ๐ผ๐ป (๐ญ๐ฏ/๐ฎ๐ณ)
I publicly committed to writing articles based on what I learned in #EpicReactDev workshops. This article is a result of that...
This has nothing more than the topics that will be covered in #EpicReactDev workshops. I have learned so much more from watching the videos than I did when I went through the open-source material on my own...
So many people messaged me saying that they want to buy this license, but wanted to know if it was worth it. My answer is always a huge YES. It definitely is. Many people started following along with what I wrote about these workshops and...
...many told me that they found these articles to be very helpful.
This ๐ is the first article when I publicly committed to it.
At the time of writing this tweet, this article has got around 2K views...
๐ข๐ฐ๐ ๐ด, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฎ๐๐ฎ๐๐ฐ๐ฟ๐ถ๐ฝ๐ ๐ฌ๐ผ๐ ๐ก๐ฒ๐ฒ๐ฑ ๐ง๐ผ ๐๐ป๐ผ๐ ๐๐ผ๐ฟ ๐ฅ๐ฒ๐ฎ๐ฐ๐ (๐ญ๐ฐ/๐ฎ๐ณ)
Before writing about the #EpicReactDev workshops, I wanted to write about Javascript concepts that I wish I had learned before starting to learn Reactjs...
This was the longest article and most read article that I have ever written. It even got featured on @hashnode
At the time of writing this tweet, this article has got around 6.9K views.
More than the views, I got personal messages from people thanking me for writing this. It felt really good ๐
๐ข๐ฐ๐ ๐ญ๐ฌ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ผ๐ ๐ ๐๐ฎ๐๐ฒ ๐ ๐ ๐ผ๐ฑ๐ฒ๐ฟ๐ป ๐๐ผ๐ผ๐ธ ๐๐ผ๐ฟ ๐๐ฎ๐ฐ๐ธ๐ฒ๐ฟ๐ก๐ฒ๐๐ ๐๐ฒ๐ฒ๐ฑ (๐ญ๐ฑ/๐ฎ๐ณ)
I took a very long break from coding the previous month. To get back to it, I decided to make a few fun projects.
For funsies, I tried to redesign the HackerNews website and this article is a result of that in which I showed the demo of the redesigned website.
I am attaching a few screenshots of the website.
At the time of writing this tweet, this article has got around 4.6K views.
๐ข๐ฐ๐ ๐ญ๐ฎ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐๐ป๐ฑ๐ฎ๐บ๐ฒ๐ป๐๐ฎ๐น๐: ๐๐ป๐๐ฟ๐ผ ๐๐ผ ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐ฅ๐ฎ๐ ๐๐ฃ๐๐ (๐ญ๐ฒ/๐ฎ๐ณ)
This was the "first" article in the series of articles based on #EpicReactDev.
In this article, I wrote about raw React APIs like React.createElement() and ReactDOM.render() methods.
At the time of writing this tweet, this article has got around 1.2K views.
๐ข๐ฐ๐ ๐ญ๐ฑ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐๐ป๐ฑ๐ฎ๐บ๐ฒ๐ป๐๐ฎ๐น๐: ๐จ๐ป๐ฑ๐ฒ๐ฟ๐๐๐ฎ๐ป๐ฑ๐ถ๐ป๐ด ๐๐ฆ๐ซ (๐ญ๐ณ/๐ฎ๐ณ)
This was the second article of the series. In this, I wrote about JSX - what is it, how to use it, how to add props to JSX elements.
I also wrote about interpolation in JSX and spreading props. The outline of this article is mostly based on the React Fundamentals workshop of #EpicReactDev.
This has got around 716 views.
๐ข๐ฐ๐ ๐ญ๐ณ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐๐ฎ๐บ๐ฝ๐ฒ๐ฑ ๐๐ถ๐๐๐๐ฏ ๐๐ผ๐ฏ๐ ๐ช๐ฒ๐ฏ๐๐ถ๐๐ฒ ๐จ๐๐ถ๐ป๐ด ๐๐ฒ๐๐ถ๐ด๐ป ๐๐ฟ๐ผ๐บ ๐๐ฟ๐ผ๐ป๐๐ฒ๐ป๐ฑ ๐ ๐ฒ๐ป๐๐ผ๐ฟ (๐ญ๐ด/๐ฎ๐ณ)
I decided to do a @frontendmentor challenge and I wanted to choose a challenge that requires using some sort of APIs.
I chose GitHub jobs clone website and this article is a result of that showcasing the demo of that.
The design also has a dark theme which I wanted to try.
I used Next.js, Tailwind CSS, React Query to make this site. At the time of writing this tweet, this article has got around 2.9K views and it also got featured on @dailydotdev
This was the first-ever site in which I used Tailwind CSS and React Query...
Needless to say, I never went back. These two became my most favorite tools/packages after Next.js. I decided to include these in all of my future projects.
I even made myself a boilerplate template with all of these pre-configured - which later became an open-source repo.
๐ข๐ฐ๐ ๐ญ๐ต, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐๐ป๐ฑ๐ฎ๐บ๐ฒ๐ป๐๐ฎ๐น๐: ๐๐ฟ๐ฒ๐ฎ๐๐ถ๐ป๐ด ๐๐๐๐๐ผ๐บ ๐๐ผ๐บ๐ฝ๐ผ๐ป๐ฒ๐ป๐๐ (๐ญ๐ต/๐ฎ๐ณ)
This article is again a part of my review of EpicReactDev workshops. In this, I wrote about creating components, prop-types, React Fragments, etc...
At the time of writing this tweet, this article has got around 375 views.
๐ข๐ฐ๐ ๐ฎ๐ฎ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐๐ป๐ฑ๐ฎ๐บ๐ฒ๐ป๐๐ฎ๐น๐: ๐ฆ๐๐๐น๐ถ๐ป๐ด ๐๐ป๐ฑ ๐๐ฎ๐ป๐ฑ๐น๐ถ๐ป๐ด ๐๐ผ๐ฟ๐บ๐ (๐ฎ๐ฌ/๐ฎ๐ณ)
In this article, I wrote about basic styling methods and also about handling forms in React.
At the time of writing this tweet, this article has got around 421 views.
๐ข๐ฐ๐ ๐ฎ๐ฒ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐ผ๐ผ๐ธ๐: ๐ ๐ฎ๐ป๐ฎ๐ด๐ถ๐ป๐ด ๐ฆ๐๐ฎ๐๐ฒ ๐ช๐ถ๐๐ต ๐๐๐ฒ๐ฆ๐๐ฎ๐๐ฒ ๐๐ผ๐ผ๐ธ (๐ฎ๐ญ/๐ฎ๐ณ)
This article is about useState hook in React. I wrote about what it is, and how to use it. I also wrote about Functional Updates in useState...
... and when it can be useful. I finally ended the article by explaining about Lazy Initialization and also using this with objects.
At the time of writing this tweet, this has got around 358 views.
๐ข๐ฐ๐ ๐ฎ๐ต, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ผ๐ ๐๐ผ ๐๐ฟ๐ฒ๐ฎ๐๐ฒ ๐ฎ ๐ฅ๐ฒ๐๐๐ฎ๐ฏ๐น๐ฒ ๐๐ผ๐ฐ๐ฎ๐น๐ฆ๐๐ผ๐ฟ๐ฎ๐ด๐ฒ ๐๐ผ๐ผ๐ธ (๐ฎ๐ฎ/๐ฎ๐ณ)
This article is about creating a reusable local storage hook that syncs the state to local storage automatically. I saw this example in the #EpicReactDev
I usually use use-persisted-state package for my projects for this purpose because of some of the features that the package has. Nevertheless, it was good to explore how to make a custom one when required.
At the time of writing this tweet, this article has got around 1.3K views.
That's it for October. In that month, I wrote a total of 10 articles - at least 2 every week.
๐ก๐ผ๐ ๐ฎ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐๐ฎ๐๐ถ๐น๐ ๐๐ฒ๐๐ฒ๐ฐ๐ ๐ข๐๐๐๐ถ๐ฑ๐ฒ ๐๐น๐ถ๐ฐ๐ธ ๐จ๐๐ถ๐ป๐ด ๐๐๐ฒ๐ฅ๐ฒ๐ณ ๐๐ผ๐ผ๐ธ (๐ฎ๐ฏ/๐ฎ๐ณ)
I was doing a project in which I had to close the modal/dialog whenever I clicked at any place outside of it. I made a custom hook for this using useRef...
In this article, I wrote about the same explaining the process which I took to make this hook.
At the time of writing this tweet, this article has got around 1.3K views.
๐ก๐ผ๐ ๐ฑ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฏ ๐ฆ๐ถ๐บ๐ฝ๐น๐ฒ ๐ฆ๐๐ฒ๐ฝ๐ ๐ง๐ผ ๐ฆ๐ฒ๐๐๐ฝ ๐๐๐๐ต๐ฒ๐ป๐๐ถ๐ฐ๐ฎ๐๐ถ๐ผ๐ป ๐ถ๐ป ๐ก๐ฒ๐
๐.๐ท๐ (๐ฎ๐ฐ/๐ฎ๐ณ)
In all of my previous Next.js projects, I have set up my own authentication in a custom Node backend. I know that I could use services like Auth0...
... but it was too expensive for me after a couple of users. Hence I decided to make my own. @benawad 's YouTube videos helped me a lot in this regard.
This is the video that I referred to.
It was then, I discovered an open-source package called NextAuth.js which made it super simple to set up authentication in Next.js projects. I immediately tried it and it was so easy to set up. It also has providers for most of the OAuth providers like Google, GitHub, etc.
It even has a provider for setting up password-less login. You can also bring your own database.
The following article came as a result of this -- showing how easy it is to set up auth in Next.js
At the time of writing this tweet, this article has got around 880 views.
๐ก๐ผ๐ ๐ญ๐ฌ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ง๐ต๐ฒ ๐๐ถ๐ณ๐ฒ๐ฐ๐๐ฐ๐น๐ฒ ๐ผ๐ณ ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐๐ผ๐ผ๐ธ๐ ๐๐ผ๐บ๐ฝ๐ผ๐ป๐ฒ๐ป๐ (๐ฎ๐ฑ/๐ฎ๐ณ)
This is again something that I learned from #EpicReactDev workshops.
In this article, I wrote about the life cycle of useEffect hooks in functional components. It was a little difficult for me to get the hang of useEffect hook when I was learning it for the first time. This video from #EpicReactDev workshops made it so simple.
At the time of writing this tweet, this article has got around 2.3K views. I myself have referred to this article a countless number of times. I am very glad that I wrote this.
๐ก๐ผ๐ ๐ญ๐ฏ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ฏ๐ฌ+ ๐๐ถ๐ ๐๐ผ๐บ๐บ๐ฎ๐ป๐ฑ๐ ๐ง๐ต๐ฎ๐ ๐ ๐๐ฟ๐ฒ๐พ๐๐ฒ๐ป๐๐น๐ ๐จ๐๐ฒ (๐ฎ๐ฒ/๐ฎ๐ณ)
This is the article that took the least effort to write. In this article, I have just listed down the most frequent Git commands that I use in my daily workflow.
This article also got featured in @hashnode 's Become A Better Dev In 2021 e-book. If you haven't checked it out, check out that ebook. It's really good.
At the time of writing this tweet, this article has got around 4K views - which is surprising considering the amount of time that I spent writing it.
๐ก๐ผ๐ ๐ฎ๐ญ, ๐ฎ๐ฌ๐ฎ๐ฌ - ๐ก๐ฒ๐
๐.๐ท๐ ๐ฆ๐๐ฎ๐ฟ๐๐ฒ๐ฟ ๐ง๐ฒ๐บ๐ฝ๐น๐ฎ๐๐ฒ ๐ช๐ถ๐๐ต ๐๐๐๐ต๐ฒ๐ป๐๐ถ๐ฐ๐ฎ๐๐ถ๐ผ๐ป + ๐ฅ๐ฒ๐ฎ๐ฐ๐ ๐ญ๐ณ + ๐ง๐๐ฝ๐ฒ๐ฆ๐ฐ๐ฟ๐ถ๐ฝ๐ + ๐ง๐ฎ๐ถ๐น๐๐ถ๐ป๐ฑ ๐๐ฆ๐ฆ ๐ฎ + ๐๐ฆ๐๐ถ๐ป๐ (๐ฎ๐ณ/๐ฎ๐ณ)
This is the final article of the month of November and the year 2020.
I created a Next.js starter template with things like Authentication, TypeScript, Tailwind CSS, ESLint, Prettier, React Query, Prisma with Postgres pre-configured. I made it open-source and wrote an article on how to deploy it to Vercel.
This article also got featured on @dailydotdev
At the time of writing this tweet, this article has got around 3.7K views.
Right now, the repo just crossed 150 stars on GitHub and has been forked 16 times.
Link to the GitHub Repo:
Link to the live demo:
I recently discovered Fauna DB and I liked it very much. This also has a generous free tier to it. I have replaced Prisma + Postgres with Fauna DB in this template since then.
I haven't written any article in the month of December 2020 due to my other commitments. Hopefully, I will get back to it soon from 2021.
I have attached the stats of all the articles that I have written in 2020.
I have a total of around 48K page views until now. I never thought that anyone would be interested in reading what I write. But unless you try, you never know. The worst thing that can happen is you end up getting good at writing and reinforce the concepts that you write.
Audience Overview
Acquisition Overview
Behaviour Overview
This wouldn't have been possible without @hashnode and I have nothing but gratitude towards them.
If you are a developer and you don't have a blog yet. There is no time better than now to start a blog and write down your thoughts...
I don't assume anyone reading this very long thread completely. But if you did, you are a legend. Hopefully, this thread inspires at least one person to start blogging ๐ค
If you have any questions that you want to ask, my DMs are always open.
