--- title: Best JavaScript posts of 2021 | daily.dev description: The most upvoted JavaScript posts of 2021, curated by the daily.dev community. canonical: https://daily.dev/tags/javascript/best-of/2021 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/javascript/best-of/2021 og:type: website og:site_name: daily.dev og:title: Best JavaScript posts of 2021 | daily.dev og:description: The most upvoted JavaScript posts of 2021, 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 JavaScript — 2021 1. 1 [](/posts/writing-clean-javascript-es6-edition-djk0jktgq "Writing Clean JavaScript — ES6 Edition") Article Geek Culture · 5y Writing Clean JavaScript — ES6 Edition Clean code is not just code that works, but rather code that can be easily read, reused, and refactored by others. This article focuses on writing clean JavaScript ES6 code which is not framework-specific. Most of the mentioned examples can apply to almost any other programming language. 326 29 2. 2 [](/posts/frontend-interview-cheatsheet-that-helped-me-get-offers-from-amazon-linkedin-mkrzeakvl "🔥 Frontend Interview Cheatsheet That Helped Me Get Offers From Amazon & LinkedIn") Article ITNEXT · 5y 🔥 Frontend Interview Cheatsheet That Helped Me Get Offers From Amazon & LinkedIn Vitalii Shevchuk: Frontend Interview Cheatsheet That Helped Me Get Offers From Amazon & LinkedIn. If you are preparing for a frontend interview and want to quickly refresh your frontend domain knowledge, this cheatsheet will save you a lot of time. Enjoy reading, and feel free to dive deeper by clicking the topic link. 322 7 3. 3 [](/posts/4-javascript-concepts-that-every-developer-should-know-whm7kjtpr "4 JavaScript Concepts That Every Developer Should Know") Article JavaScript in Plain English · 5y 4 JavaScript Concepts That Every Developer Should Know In this post, I will discuss four of the most important JavaScript concepts. IIFE IIFE, aka, Immediately Invoked Function Expression, are JavaScript functions defined as expressions that are immediately invoked and executed as soon as they are defined. Scope Scope determines which variables you have (or do not have) access to in different contexts. Closures are helpful to employ when you would like to pass variables, arrays, or methods from an outer function to an inner function. 315 14 4. 4 [](/posts/es6-handbook-the-complete-guide-dsyovcz-z "ES6 Handbook: The Complete Guide") Article DevDojo · 5y ES6 Handbook: The Complete Guide This blog is all about ES6\. It includes all the topics related with examples. Before reading further, I want to specify that this was not a blog post initially. These are just my personal notes that I use as a reference guide, so I apologize for any misspells here :) 278 11 5. 5 [](/posts/advanced-javascript-design-patterns-hakr-ecpz "Advanced Javascript Design Patterns") Article DEV · 5y Advanced Javascript Design Patterns Design Patterns are the solutions to commonly occurring problems in software design. These patterns are easily re-usable and are expressive. We will be discussing all these design patterns using Javascript es6 classes. I have covered here 20+ design patterns explanations in javascript. If you wish to learnAdvanced react component patterns, please find it here. 237 5 6. 6 [](/posts/i-made-squid-game-with-javascript-z9djcxkv8 "I made Squid Game with JavaScript") Article DEV · 5y I made Squid Game with JavaScript I just made a really simple version of Red Light Green Light game from Squid Game with JavaScript and THREE.JS. You can play it here. If you want a step by step tutorial on how to create this game I have create a YouTube tutorial that you can check. 223 7 7. 7 [](/posts/windows-96-xp1m0m0gh "Windows 96") Article Hacker News · 5y Windows 96 The bootup process will be terminated. You will lose all unsaved information in all applications. Press any key to terminate the boot up process. Press CTRL+ALT+DEL again to restart your computer. WINDOWS 96 is a Microsoft Windows 8 operating system. 208 34 8. 8 [](/posts/7-console-log-alternatives-mwhwymdwc "7 console.log() alternatives") Article Hashnode · 5y 7 console.log() alternatives console.count() is used to check how many times this line has been called. console.assert() is Used to assert that something is truthy. If not, it will log a message to the console.console.group() and console.groupEnd() are used for grouping similar (or different ;) logs together. 198 12 9. 9 [](/posts/top-5-javascript-animation-libraries-2021-ceqimpfxk "Top 5 JavaScript animation libraries 2021") Article DEV · 5y Top 5 JavaScript animation libraries 2021 Anime.js is a lightweight JavaScript animation library with a simple, yet powerful API. Vivus allows you to animate SVGs, giving them the appearence of being drawn. Typeit.js allows creating awesome typing animation in your website. ScrollOut detects changes in scroll for reveal, parallax, and CSS Variable effects. 187 21 10. 10 [](/posts/how-javascript-works-behind-the-scenes--gbwe8g4v6 "How JavaScript Works behind the scenes?") Article Dev Genius · 5y How JavaScript Works behind the scenes? How JavaScript Works behind the scenes? An overview walk-through of all the core components that are involved in the execution of JavaScript code. The Call Stack Concurrency and Event Loop. What happens when you have function calls in the Call Stack that take a huge amount of time to be processed in the browser. 180 22 11. 11 [](/posts/atropos---touch-friendly-3d-parallax-hover-effects-jy15-g7-n "Atropos - Touch-friendly 3D parallax hover effects") Article Product Hunt · 5y Atropos - Touch-friendly 3D parallax hover effects Atropos is a lightweight, free and open-source JavaScript library. It can be used to create stunning touch-friendly 3D parallax hover effects. Available for JavaScript, React and Vue.js Embed this post on your site. For more information, visit Atropos. 163 11 12. 12 [](/posts/writing-clean-code-in-javascript-pzleetrma "Writing Clean Code in JavaScript") Article Bits and Pieces · 5y Writing Clean Code in JavaScript Using object destructuring makes the code much simpler and easier to understand. Use multiple input parameters instead of single object inputs. Arrow functions provide a concise way of writing JavaScript functions. Use Template Literals for String Concatenations. Avoid the most popular way to express and handle nested functions in JavaScript 7. 154 7 13. 13 [](/posts/javascript-async-await-tutorial-learn-callbacks-promises-and-async-await-in-js-by-making-ice-cre-rhf7y34-n "JavaScript Async/Await Tutorial – Learn Callbacks, Promises, and Async/Await in JS by Making Ice Cream 🍧🍨🍦") Article freeCodeCamp · 5y JavaScript Async/Await Tutorial – Learn Callbacks, Promises, and Async/Await in JS by Making Ice Cream 🍧🍨🍦 Learn Callbacks, Promises, and Async/Await in JS by Making Ice Cream. Joy Shaheb is the author of the popular JavaScript tutorial series, The Async Cauldron. She is also the co-founder of the AsyncCauldron.com. 152 17 14. 14 [](/posts/top-7-highest-paid-programming-languages-2021-gev3cbrlh "Top 7 Highest Paid Programming Languages 2021") Article Honeypot · 5y Top 7 Highest Paid Programming Languages 2021 According to analysts, there are more than 250 different programming languages ​​in the world. You can easily miscalculate and choose an unpopular or impractical programming language. In this short article, I'm going to run through the top 7 programming languages that you can learn for a high-paying job. 149 14 15. 15 [](/posts/the-ultimate-cheat-sheet-list-for-web-developers-dq615hjqi "The Ultimate Cheat sheet List For Web Developers") Article DEV · 5y The Ultimate Cheat sheet List For Web Developers Cheat sheets are a great way to help you remember all the things you need to know about Web development. These cheat sheets include HTML, CSS, and JAVASCRIPT. Cheatsheets can also be used to teach you how to structure tables, lists, forms. 146 19 16. 16 [](/posts/free-100-mern-mean-stack-resources-ldsccjgtv "Free 100+ MERN / MEAN Stack resources") Article DevDojo · 5y Free 100+ MERN / MEAN Stack resources I have gathered all the resources that you will require to become a MERN or MEAN stack developer. All these resources will include Articles, Videos, Course, Websites, Tutorials, Books etc. And everything is FREE. You should know the basics of HTML, CSS AND JS. 142 5 17. 17 [](/posts/javascript-worst-practice-bad-coding-habits-you-need-to-stop--smtlr6-en "Javascript Worst Practice. Bad coding habits you need to stop…") Article Bits and Pieces · 5y Javascript Worst Practice. Bad coding habits you need to stop… Fernando Doglio takes a look at 5 of the worst things you can do to your code while writing JavaScript. Not everyone is fully aware that 2 + '2' is not going to be 4\. And that the type of \[\] + 1 is neither Number nor Array. Build independent components for speed and scale. 139 6 18. 18 [](/posts/20-javascript-shorthand-to-save-time-gofp614ie "20 JavaScript shorthand to save time") Article DevDojo · 5y 20 JavaScript shorthand to save time Data Structures: Why do we need Data Structures? Why does it make sense to use data structures to build data structures? Why is it so important to have a data structure that can be used to build a database of data? Why should we use data Structures to create data structures for data? 139 13 19. 19 [](/posts/python-javascript--ca0yhe9xg "Python + JavaScript = 🔥🔥🔥") Article DEV · 5y Python + JavaScript = 🔥🔥🔥 Python can be a superior option to Node.JS for some tasks. But we don't want to switch to Python just because of that one feature. We can use child process in Node. JS to run a python script when needed. And if we want we can pass data to our python script also. 133 4 20. 20 [](/posts/refactoring-nested-loops-in-js-6o5fot3d9 "Refactoring Nested Loops In JS") Article Towards Dev · 5y Refactoring Nested Loops In JS Most of the code in JS gets nested because of the various conditions one has to handle for the solution. Ternary operator is the best and most common way to replace your “if…else” statements. Switch case statement is not the best possible way to. replace nested ‘if-else’ statements but these can be used to reduce. duplicate code which is another common mistake ignored by developers. 124 4 21. 21 [](/posts/using-the-new-javascript-at-method-je-l7ikxd "Using the new JavaScript .at() method") Article LogRocket · 5y Using the new JavaScript .at() method The JavaScript .at() method was introduced in the August release of the ECMA International TC39’s relative indexing proposal. It allows developers to grab elements based on their indexes. In this tutorial, we’ll look at the benefits and drawbacks of the .at(), and how it can improve developers’ experiences. 123 8 22. 22 [](/posts/remaking-wordpress-in-js-stack-hello-to-a-new-cms-for-next-js-websites--zythwpceq "Remaking WordPress in JS stack. Hello to a new CMS for Next.js websites.") Article Medium · 5y Remaking WordPress in JS stack. Hello to a new CMS for Next.js websites. Cromwell CMS is a free and open-source CMS for Next.js websites. It is a set of packages and services that can be installed and launched independently. It inherits the advantages of microservice architecture, and it’s much easier to update the CMS simply via running one node command. 122 12 23. 23 [](/posts/web3-is-going-just-great-ewmofxu4b "Web3 is going just great") Article Hacker News · 5y Web3 is going just great function(e) {var n,i,a=t\[0\],c,t\[1\],l,l=t \[2\],s=0,p=\[\];s