<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/sources/hashnode/best-of/2020/10" -->

---
title: Best Hashnode posts — October 2020 | daily.dev
description: The most upvoted Hashnode posts from October 2020, curated by the daily.dev community.
canonical: https://daily.dev/sources/hashnode/best-of/2020/10
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:url: https://daily.dev/sources/hashnode/best-of/2020/10
og:type: website
og:site_name: daily.dev
og:title: Best Hashnode posts — October 2020 | daily.dev
og:description: The most upvoted Hashnode posts from October 2020, curated by the daily.dev community.
og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph
---

# Best of Hashnode — October 2020

1. 1  
[](https://daily.dev/posts/5-ways-to-customize-vs-code-x-cmygtpa "5 Ways To Customize VS Code")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
5 Ways To Customize VS Code  
The beauty of Visual Studio Code is how easy it is to customize. I've spent tons of time learning how to optimize VS Code for me, so I wanted to share how you can do it too. Let's look at 5 different ways you can customize your VS Code. Themes are probably the first and easiest way to customize VS Code to look much nicer. Extensions add a lot more than just aesthetics.  
72  
20
2. 2  
[](https://daily.dev/posts/40-amazing-developers-you-should-follow-on-youtube-esnp9tal5 "40 Amazing Developers You Should Follow On Youtube")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
40 Amazing Developers You Should Follow On Youtube  
There are some of the most amazing developers that will teach you everything you need to know for HTML, CSS and JS. If you want to learn anything from React, Angular, Vue or even NodeJS, Mongo, AWS and much more, there are great people to follow here.  
69  
7
3. 3  
[](https://daily.dev/posts/21-awesome-dev-portfolios-for-your-inspiration-ecbq-s9k5 "21 Awesome DEV portfolios for your inspiration")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
21 Awesome DEV portfolios for your inspiration  
The internet is full of portfolios, and getting an employer’s attention in today's marketplace can be quite a challenge. Here I have compiled a nice list of 21 awesome DEV portfolios to inspire you to build or upgrade yours. Enjoy! I hope you enjoyed the read! Feel free to follow me on Twitter, LinkedIn, GitHub, Hashnode and DEV!  
60  
10
4. 4  
[](https://daily.dev/posts/28-creative-404-pages-for-your-inspiration--xzejd1nxo "28 Creative 404 pages for your Inspiration 🧙‍♂️✨")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
28 Creative 404 pages for your Inspiration 🧙‍♂️✨  
56  
5
5. 5  
[](https://daily.dev/posts/top-42-react-resources-every-developer-should-bookmark-latest--y5tnajefp "Top 42 React resources every developer should bookmark [Latest]")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Top 42 React resources every developer should bookmark \[Latest\]  
Every developer needs resources to learn React. There are an immense number of resources both free and paid from where you can take some inspiration, learn new concepts or just listen to some podcast. Here are some of the best ones out there which you as a React dev should bookmark and use it as a reference whenever needed.  
55  
1
6. 6  
[](https://daily.dev/posts/how-to-become-a-kickass-web-developer-in-2021-frontend-backend-tips--jitmhedqq "How to become a Kickass Web Developer in 2021 [Frontend & Backend Tips]")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
How to become a Kickass Web Developer in 2021 \[Frontend & Backend Tips\]  
Web development is a domain where the work is involved in developing (or building) a website (ora web app) for the internet. Without knowledge of the web, you can't become a good developer. These are some of the tips all web devs should have whether you're a full-stack or a front-end dev.  
49  
3
7. 7  
[](https://daily.dev/posts/50-essential-tips-for-every-developer--y89a-wgmp "50 Essential Tips for Every Developer.")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
50 Essential Tips for Every Developer.  
Whether you are starting to program or you are twenty years into your career, there is something here for you. You are never ready. That's the fun part. Just start! You'll figure everything out automatically. Asking for help is not a sign of weakness. Quit looking for perfection.  
44  
7
8. 8  
[](https://daily.dev/posts/let-s-build-a-video-conferencing-app-qgtxtgtmm "Let's build a video conferencing app")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Let's build a video conferencing app  
In this article we will see how to build a video conferencing app. We will be using the following libraries:React Nodejs simple-peer socket.io chance.js yarn add express socket .io. In /home we will give the option to create room or join room. in /room/:roomId is where we will render the video streams from multiple users.  
43  
6
9. 9  
[](https://daily.dev/posts/convert-your-website-into-an-app-with-3-easy-steps-u-lklmy7v "Convert your Website into an APP with 3 easy steps")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Convert your Website into an APP with 3 easy steps  
Progressive Web Applications are a technology built by Google developers. They allow developers to add native looks and some features like offline load & Push Notifications to your website. These are the three files needed to convert your current website into an installable PWA. You can use WorkBox API for service worker as its very simple.  
41  
7
10. 10  
[](https://daily.dev/posts/an-easy-react-17-typescript-tailwind-css-nextjs-setup-spqao99pr "An easy React 17 + TypeScript + Tailwind CSS + NextJS setup")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
An easy React 17 + TypeScript + Tailwind CSS + NextJS setup  
NextJS is becoming a de facto framework for modern web development. In this article we will build a starter repo that you can use for every new project. We'll add the TypeScript packages first, so later we can immediately add the typings. First, we'll need to install the tailwindcss package. Then we'll create a new file for the types file.  
38  
5
11. 11  
[](https://daily.dev/posts/24-modern-es6-code-snippets-to-solve-practical-js-problems-wcgpsnjcq "24 modern ES6 code snippets to solve practical JS problems")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
24 modern ES6 code snippets to solve practical JS problems  
Here I have hand-picked some of the most useful code snippets from 30 seconds of code. It's an awesome resource, go ahead and show it some love. In this article I tried to sort them based on their practical use, answering common questions you may face in your project.  
37  
5
12. 12  
[](https://daily.dev/posts/dark-mode-in-css-toggle--xwtr39sqm "Dark Mode in CSS (toggle)")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Dark Mode in CSS (toggle)  
Invert() function is used with filter property to invert the color samples. hue-rotate function is also used to rotate the hue of an element and its contents. Invert() requires an argument to be passed to it. This argument can be either a percentage value or a number.  
34  
2
13. 13  
[](https://daily.dev/posts/remove-unused-npm-modules-in-less-than-30-seconds--anbgl91ud "Remove unused npm modules in less than 30 seconds!")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Remove unused npm modules in less than 30 seconds!  
Go to the project's root folder and run the below command. It will display all the unused packages in your project. To uninstall a module simply run the following command:npm uninstall <package> or npm depcheck <package name and size of your project.  
34  
3
14. 14  
[](https://daily.dev/posts/5-useful-vscode-extensions-you-don-t-know-about-yqoddvj69 "5 Useful VSCode Extensions You Don’t Know About")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
5 Useful VSCode Extensions You Don’t Know About  
I’ve been using VSCode for 4 years from its beta and installed over 50+ extensions. Here is the list of my 5 useful extensions you need to know about. Todo Tree is a simple extension that searches a workspace for comment tags like TODO and FIXME, and displays them in a tree view.  
34  
3
15. 15  
[](https://daily.dev/posts/functional-vs-object-oriented-programming-dk1o9d9v1 "Functional vs Object-Oriented Programming")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Functional vs Object-Oriented Programming  
Programming paradigms are approaches in which code is organized to implement solutions in a program. In the world of JavaScript, there are typically 2 programming paradigm: Functional and Object-Oriented Programming (OOP) Let's take a look at the OOP approach and illustrate an example.  
33  
3
16. 16  
[](https://daily.dev/posts/the-ultimate-guide-to-git-commands-csm4zlxwb "The Ultimate Guide to Git Commands")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
The Ultimate Guide to Git Commands  
Git is an Open Source Distributed Version Control System. It is by far, the most widely used modern version control system in the world today. You can use Git without using any other service. This means that you can use it privately or publicly. Here's a list of most used git commands.  
30  
2
17. 17  
[](https://daily.dev/posts/20-youtube-channels-to-follow-for-web-developers-x-vsfjyoq "20 YouTube Channels to Follow for Web Developers")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
20 YouTube Channels to Follow for Web Developers  
If you want to have a career in web development, it can be hard to figure out where to start. Watching YouTube videos can be an excellent place to get developer’s perspectives and tips. YouTube is the largest online video delivery platform in the world and has many great channels that can teach anyone practically anything.  
30  
3
18. 18  
[](https://daily.dev/posts/13-data-types-of-typescript-you-should-know-for-beginners--i-oobfiat "13 Data Types of Typescript you should know for beginners 👨🏻‍💻👩‍💻")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
13 Data Types of Typescript you should know for beginners 👨🏻‍💻👩‍💻  
The most basic data type is the simple true/false value, which Typescript calls a Boolean. All numbers are either floating-point values or Big Integers. Since TypeScript version 1.4, TypeScript has included support for ES6 Template strings. When you want to span a string to multiple lines and/or have to embed expressions, use templated strings.  
30  
3
19. 19  
[](https://daily.dev/posts/i-can-t-write-a-javascript-for-loop-and-it-does-not-matter-zcgwapzqo "I can't write a JavaScript for loop, and it does not matter")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
I can't write a JavaScript for loop, and it does not matter  
I've been using JavaScript daily for 7 years, and I'm not able to remember the syntax of a JavaScript for loop. Despite this fact, I'm a rather successful freelance developer. Recently I worked for Facebook, as the Docusaurus lead maintainer, writing the code for the framework that powers Babel, Prettier, Jest, ReactNative...  
30
20. 20  
[](https://daily.dev/posts/design-a-css-art--frankenstein--zutlflpeu "Design a CSS Art-(Frankenstein)")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Design a CSS Art-(Frankenstein)  
This tutorial will help you break down how CSS is made. We will use Codepen, an online editor which let's us code in HTML, CSS, and Javascript without linking the files. A basic outline of the art will make it easier to add details accordingly. A container div containing the entire face will be a class called Container.  
27  
12
21. 21  
[](https://daily.dev/posts/chrome-find-unused-code--si6yticgc "Chrome find unused code 🔎")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Chrome find unused code 🔎  
Chrome has a Code Coverage tool. It shows you what CSS and JavaScript is being used on a page. You can run a coverage by re-indexing the page. This gives you a high-level overview of the scripts and css loaded. You could then use another tool to remove these lines from your code.  
27  
6
22. 22  
[](https://daily.dev/posts/es6---higher-order-functions-phx-6jzne "ES6 - Higher-Order Functions")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
ES6 - Higher-Order Functions  
In JavaScript, functions are treated as 'First Class' citizens. A function is fundamentally an object. We can assign properties to a function like 'Namaste' or 'Hello' The forEach function was introduced with ES5 as Array.prototype.forEach and with ES6, it's simply referenced as. Array.map. The map function returns a function applied to every element of the original array.  
27  
2
23. 23  
[](https://daily.dev/posts/different-ways-to-authenticate-your-apis-ewznuhyhk "Different ways to authenticate your APIs")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
Different ways to authenticate your APIs  
Using basic authentication for authenticating users is usually not recommended since sending the user credentials for every request is a bad practice. API keys are a way to authenticate an application accessing any API without referencing an actual user. OAuth specifies mechanisms where an application can ask a user for access to services on behalf of the user, and receive a token as proof.  
26  
2
24. 24  
[](https://daily.dev/posts/6-tools-i-use-for-web-development-iryn7z85n "6 Tools I use for Web Development")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
6 Tools I use for Web Development  
26  
2
25. 25  
[](https://daily.dev/posts/css-cut-out-effect-that-will-blow-your-mind--xnqi0nvpg "CSS cut out effect that will blow your mind 🤯")  
Article  
![Avatar of hashnode](https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/4a287b2e7cb5499bae863f8e7137cdb4)Hashnode · 6y  
CSS cut out effect that will blow your mind 🤯  
A CSS cut-out effect is having a background image show through the text. The effect is so cool and just around fun to see. It's only a div with a text element inside it. The last step is enabling the mix-blend-mode. Since we are using a full contrast, it will totally remove the black text and show whatever is behind there.  
26  
3

[See all Hashnode archives](/sources/hashnode/best-of)

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]}
{"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/sources/hashnode/best-of/2020/10#page","url":"https://daily.dev/sources/hashnode/best-of/2020/10","name":"Best Hashnode Posts — October 2020","description":"The most upvoted Hashnode posts from October 2020, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/sources/hashnode/best-of/2020/10#items","numberOfItems":25,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/5-ways-to-customize-vs-code-x-cmygtpa","name":"5 Ways To Customize VS Code"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/40-amazing-developers-you-should-follow-on-youtube-esnp9tal5","name":"40 Amazing Developers You Should Follow On Youtube"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/21-awesome-dev-portfolios-for-your-inspiration-ecbq-s9k5","name":"21 Awesome DEV portfolios for your inspiration"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/28-creative-404-pages-for-your-inspiration--xzejd1nxo","name":"28 Creative 404 pages for your Inspiration 🧙‍♂️✨"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/top-42-react-resources-every-developer-should-bookmark-latest--y5tnajefp","name":"Top 42 React resources every developer should bookmark [Latest]"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/how-to-become-a-kickass-web-developer-in-2021-frontend-backend-tips--jitmhedqq","name":"How to become a Kickass Web Developer in 2021 [Frontend & Backend Tips]"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/50-essential-tips-for-every-developer--y89a-wgmp","name":"50 Essential Tips for Every Developer."},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/let-s-build-a-video-conferencing-app-qgtxtgtmm","name":"Let's build a video conferencing app"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/convert-your-website-into-an-app-with-3-easy-steps-u-lklmy7v","name":"Convert your Website into an APP with 3 easy steps"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/an-easy-react-17-typescript-tailwind-css-nextjs-setup-spqao99pr","name":"An easy React 17 + TypeScript + Tailwind CSS + NextJS setup"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/24-modern-es6-code-snippets-to-solve-practical-js-problems-wcgpsnjcq","name":"24 modern ES6 code snippets to solve practical JS problems"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/dark-mode-in-css-toggle--xwtr39sqm","name":"Dark Mode in CSS (toggle)"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/remove-unused-npm-modules-in-less-than-30-seconds--anbgl91ud","name":"Remove unused npm modules in less than 30 seconds!"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/5-useful-vscode-extensions-you-don-t-know-about-yqoddvj69","name":"5 Useful VSCode Extensions You Don’t Know About"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/functional-vs-object-oriented-programming-dk1o9d9v1","name":"Functional vs Object-Oriented Programming"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/the-ultimate-guide-to-git-commands-csm4zlxwb","name":"The Ultimate Guide to Git Commands"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/20-youtube-channels-to-follow-for-web-developers-x-vsfjyoq","name":"20 YouTube Channels to Follow for Web Developers"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/13-data-types-of-typescript-you-should-know-for-beginners--i-oobfiat","name":"13 Data Types of Typescript you should know for beginners 👨🏻‍💻👩‍💻"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/i-can-t-write-a-javascript-for-loop-and-it-does-not-matter-zcgwapzqo","name":"I can't write a JavaScript for loop, and it does not matter"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/design-a-css-art--frankenstein--zutlflpeu","name":"Design a CSS Art-(Frankenstein)"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/chrome-find-unused-code--si6yticgc","name":"Chrome find unused code 🔎"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/es6---higher-order-functions-phx-6jzne","name":"ES6 - Higher-Order Functions"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/different-ways-to-authenticate-your-apis-ewznuhyhk","name":"Different ways to authenticate your APIs"},{"@type":"ListItem","position":24,"url":"https://daily.dev/posts/6-tools-i-use-for-web-development-iryn7z85n","name":"6 Tools I use for Web Development"},{"@type":"ListItem","position":25,"url":"https://daily.dev/posts/css-cut-out-effect-that-will-blow-your-mind--xnqi0nvpg","name":"CSS cut out effect that will blow your mind 🤯"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Sources","item":"https://daily.dev/sources"},{"@type":"ListItem","position":3,"name":"Hashnode","item":"https://daily.dev/sources/hashnode"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/sources/hashnode/best-of"},{"@type":"ListItem","position":5,"name":"October 2020"}]}]}
```

