--- title: Best developer posts — October 2022 | daily.dev description: The most upvoted daily.dev posts from October 2022, curated by the daily.dev community. canonical: https://daily.dev/posts/best-of/2022/10 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/posts/best-of/2022/10 og:type: website og:site_name: daily.dev og:title: Best developer posts — October 2022 | daily.dev og:description: The most upvoted daily.dev posts from October 2022, 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 daily.dev — October 2022 1. 1 [](https://daily.dev/posts/design-patterns-mxrfapckc "Design Patterns") Article Community Picks · 4y Design Patterns Design Patterns Design patterns are a toolkit of solutions to common problems in software design. They define a common language that helps your team communicate more efficiently. They can be categorized by their intent and divided into three groups. 828 42 2. 2 [](https://daily.dev/posts/developer-roadmaps-aimvj-l2n "Developer Roadmaps") Article Community Picks · 4y Developer Roadmaps Developer Roadmaps roadmap.sh is a community effort to create roadmaps, guides and other educational content to help guide the developers in picking up the path and guide their learnings. The project is OpenSource, 6th most starred project on GitHub and is visited by hundreds of thousands of developers every month. We are working on a solution for teams. Help us shape the platform. The project has a solution to build and build a new software that will be available. 767 44 3. 3 [](https://daily.dev/posts/netflix-system-design--backend-architecture-g2q-lrrvj "Netflix System Design- Backend Architecture") Article Community Picks · 4y Netflix System Design- Backend Architecture Netflix accounts for about 15% of the world's internet bandwidth traffic. Netflix operates in two clouds Amazon Web Services and Open Connect (Netflix content delivery network) The overall Netflix system consists of three main parts. Zuul as its API gateway is built to allow dynamic routing, traffic monitoring, and security, resilience to The Netty handlers on the front and back of the filters. 742 32 4. 4 [](https://daily.dev/posts/how-to-fetch-api-data-in-react-like-a-pro-yxoo542tx "How to Fetch API Data in React Like a Pro") Article Bits and Pieces · 4y How to Fetch API Data in React Like a Pro How to Fetch API Data in React Like a Pro Building applications the user use love is not an easy task. The technique we are going to talk about is known as render as you fetch. This simple technique is also suggested by React itself while fetching data. 541 41 5. 5 [](https://daily.dev/posts/authentication-just-got-easier--ienarqtza "Authentication just got easier!") Article daily.dev Changelog · 4y Authentication just got easier! Authentication just got easier! Now you can log in with Google, Facebook, Github, Apple or email. But wait, there is more! You can now connect multiple authentication providers. This is super useful if you are logged in with say Facebook on your phone but not on your PC. 496 55 6. 6 [](https://daily.dev/posts/blog---next-js-13-gcx-wf7qz "Blog - Next.js 13") Article Next.js · 4y Blog - Next.js 13 Next.js 13 includes Turbopack, the new Rust-based successor to Webpack. New next/image(stable): Faster with native browser lazy loading. New @next/font(beta): Automatic self-hosted fonts with zero layout shift. 422 24 7. 7 [](https://daily.dev/posts/8-must-know-tips-for-writing-clean-code-with-javascript-czqhsmrxj "8 must-know tips for writing clean code with Javascript") Article Community Picks · 4y 8 must-know tips for writing clean code with Javascript Clean Javascript code can be a challenge, even for seasoned programmers. Here are the top tools and tricks you can use to take your code quality to the next level. Use a linter (ESLint/TSLint) 403 27 8. 8 [](https://daily.dev/posts/harvard-cs50-free-computer-science-university-course-fbqijhd4w "Harvard CS50 – Free Computer Science University Course") Article freeCodeCamp · 4y Harvard CS50 – Free Computer Science University Course Harvard CS50 is one of the most popular beginner computer science courses in the world. The course teaches students how to think algorithmically and solve problems efficiently. Topics include abstraction, algorithms, data structures, encapsulation, resource management, security, software engineering, and web programming. 379 17 9. 9 [](https://daily.dev/posts/javascript-from-es6-to-es12-in-2022-5k4dlnc3e "JavaScript from ES6 to ES12 in 2022") Article Community Picks · 4y JavaScript from ES6 to ES12 in 2022 JavaScript from ES6 to ES12 in 2022 is one of the three most crucial programming at front-end positions. There are some new scripts to support software engineers by ES6 \~ ES12 for now. ECMA specification is made up of parties, including browser vendors, who meet to push JavaScript proposals. The promise is a solution to asynchronous (non-synchronous) writing, which is more elegant than the original callback writing. In the early days, it was a suite of the open-source community. 338 11 10. 10 [](https://daily.dev/posts/advice-for-junior-developers--oh8afgq9 "Advice for Junior Developers") Article Community Picks · 4y Advice for Junior Developers Writing tests is an example of a best practice, writes tests for everything. Do not use inheritance for code reuse at all when you are starting out. Write Object-Oriented code that is not STUPID. 338 11 11. 11 [](https://daily.dev/posts/react-just-got-even-more-awesome-69o50fr4d "React Just Got Even More Awesome") Article DEV · 4y React Just Got Even More Awesome The use hook is only meant to handle async behaviour, not caching or other advanced features. It's a step in the right direction for the react team and a welcome addition to the react ecosystem. If you're looking for a more advanced data fetching library, react-query is still the way to go. 324 22 12. 12 [](https://daily.dev/posts/git-commit-message-convention-that-you-can-follow--jwlw2teg3 "Git commit message convention that you can follow!") Article Community Picks · 4y Git commit message convention that you can follow! Git commit message convention that you can follow. Motivation of this blog is to curate all information at one place and to make more people aware about standards followed by industry. A typical git commit message will look like : "type" must be one of the following mentioned below. 318 11 13. 13 [](https://daily.dev/posts/solid-principles-sketches-2kiqot4fj "SOLID Principles Sketches") Article ITNEXT · 4y SOLID Principles Sketches SOLID Principles Sketches allows you to do interactive (nested) sketches. Each SOLID principle has a dedicated sketch page that looks like the following Single Responsibility Principle SRP Sketch A class should have only a single responsibility. No client should be forced to depend on methods it does not use. 303 15 14. 14 [](https://daily.dev/posts/heroku-is-no-longer-free-here-are-the-best-alternatives-iie33y3zf "Heroku Is No Longer Free, Here Are The Best Alternatives") Article Community Picks · 4y Heroku Is No Longer Free, Here Are The Best Alternatives Heroku is a famous PAAS service that allows developers to deploy apps very easily and in various languages and frameworks. At the date of writing this post, 27 August 2022, Heroku does have a free tier to be used for learning purposes and for non-commercial apps like your own personal projects. 292 18 15. 15 [](https://daily.dev/posts/hooks-pattern-5p5vsey2m "Hooks Pattern") Article Patterns · 4y Hooks Pattern React 16.8 introduced a new feature called Hooks. Hooks are functions that you can use to manage a components state and lifecycle methods. Hooks make it possible to - add state to a functional component - manage a component's lifecycle without using a class component. In both componentDidMount and componentWillUnmount, we're customizing the behavior of the app based on the window's resize event. 285 5 16. 16 [](https://daily.dev/posts/top-2-reasons-why-i-moved-from-notion-to-obsidian-as-a-software-developer-hof3ej71c "Top 2 Reasons Why I Moved From Notion to Obsidian as a Software Developer") Article gitconnected · 4y Top 2 Reasons Why I Moved From Notion to Obsidian as a Software Developer VIM-based text editors are always my top choice for daily coding work and tech writing work. I personally hate the moments when the draft notes cannot be saved because of the network issue which happens a lot when using Notion as note taking app. The most intuitive approach is to type down everything I need without leaving the keyboard. The right tool makes it much more interesting and enjoyable. 278 32 17. 17 [](https://daily.dev/posts/html-reference-psu-7utf7 "HTML Reference") Article Community Picks · 4y HTML Reference HTML Reference is free and always will be! Please whitelist us in your ad blocker. Learn by example: HTMLreference.io is a free guide to HTML. It features all elements and attributes. 236 13 18. 18 [](https://daily.dev/posts/introducing-turbopack-rust-based-successor-to-webpack-vercel-uraatdhsj "Introducing Turbopack: Rust-based successor to Webpack – Vercel") Article Vercel · 4y Introducing Turbopack: Rust-based successor to Webpack – Vercel Turbopack: Rust-based successor to Webpack Vercel's mission is to provide the speed and reliability innovators need to create at the moment of inspiration. It's built on a new incremental architecture for the fastest possible development experience. 231 11 19. 19 [](https://daily.dev/posts/learn-this-before-react-k6-nkvmqi "Learn this before React") Article DEV · 4y Learn this before React The destructuring rest & spread operator promises map and filter methods. The find method returns the first element that satisfies the condition. FindIndex returns the index of that \["jack", "pritom" The spread operator enables us to spread the content of a iterable (i.e. array) into individual elements Spread. In simple terms promises are used to handle asynchronous operations. 228 17 20. 20 [](https://daily.dev/posts/from-zero-to-devops-engineer---devops-roadmap-for-your-specific-background--maru3uexl "From Zero to DevOps Engineer - DevOps Roadmap for YOUR specific background 🔥") Article DEV · 4y From Zero to DevOps Engineer - DevOps Roadmap for YOUR specific background 🔥 A part of DevOps skillset is to create a process of handling discovered issues in production instead of having a panic mode. 207 9 21. 21 [](https://daily.dev/posts/vscode-updates-frameworks-git-cli-js-utils-fxn-8vszg "VSCode Updates, Frameworks, Git/CLI, JS Utils") Article Web Tools Weekly · 4y VSCode Updates, Frameworks, Git/CLI, JS Utils This week's newsletter includes tools, extensions, the latest news, articles, and tutorials on VS Code. VSCode Updates, Frameworks, Git/CLI, JS Utils, and Email are all free and open-source tools. 201 8 22. 22 [](https://daily.dev/posts/7-cool-html-elements-nobody-uses-79wmjlbef "7 Cool HTML Elements Nobody Uses") Article Changelog · 4y 7 Cool HTML Elements Nobody Uses The progress element is the semantically correct way of displaying progress bars. The meter element is progress on steroids. The abbr element allows you to add an autocomplete suggestions to your input elements. map & area map and area allow you to create image maps. 198 17 23. 23 [](https://daily.dev/posts/please-do-repeat-yourself-dry-is-dead--detdft1dx "Please do repeat yourself (DRY is dead)") Article DEV · 4y Please do repeat yourself (DRY is dead) Don't repeat yourself (DRY is dead) is the root of all software evil, says John Sutter. Repeating yourself is basically giving yourself the time and space to come up with the right abstractions instead of engaging in guesswork and clairvoyance. 194 33 24. 24 [](https://daily.dev/posts/how-to-debug-like-a-pro-d42mlrzmq "How to Debug Like a Pro") Article JavaScript in Plain English · 4y How to Debug Like a Pro Being a web developer one must be aware of some awesome debugging techniques. To be honest, I have been using console.log() along with debugger to debug my code, but debugging is not limited to these two. 193 8 25. 25 [](https://daily.dev/posts/understanding-async-await-yc3aezp0u "Understanding Async & Await") Article DEV · 4y Understanding Async & Await A Promise is a primitive data type that represents a future value. It's a JavaScript object with two pieces of information: the promise state, and a value or error. A promise is settled when the promise has either fulfilled or rejected. With 30+ real-world exercises you'll transform knowledge into a practical skill that will make you a better developer. 189 10 [See all daily.dev archives](/posts/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/posts/best-of/2022/10#page","url":"https://daily.dev/posts/best-of/2022/10","name":"Best Developer Posts — October 2022","description":"The most upvoted daily.dev posts from October 2022, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/posts/best-of/2022/10#items","numberOfItems":25,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/design-patterns-mxrfapckc","name":"Design Patterns"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/developer-roadmaps-aimvj-l2n","name":"Developer Roadmaps"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/netflix-system-design--backend-architecture-g2q-lrrvj","name":"Netflix System Design- Backend Architecture"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/how-to-fetch-api-data-in-react-like-a-pro-yxoo542tx","name":"How to Fetch API Data in React Like a Pro"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/authentication-just-got-easier--ienarqtza","name":"Authentication just got easier!"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/blog---next-js-13-gcx-wf7qz","name":"Blog - Next.js 13"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/8-must-know-tips-for-writing-clean-code-with-javascript-czqhsmrxj","name":"8 must-know tips for writing clean code with Javascript"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/harvard-cs50-free-computer-science-university-course-fbqijhd4w","name":"Harvard CS50 – Free Computer Science University Course"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/javascript-from-es6-to-es12-in-2022-5k4dlnc3e","name":"JavaScript from ES6 to ES12 in 2022"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/advice-for-junior-developers--oh8afgq9","name":"Advice for Junior Developers"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/react-just-got-even-more-awesome-69o50fr4d","name":"React Just Got Even More Awesome"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/git-commit-message-convention-that-you-can-follow--jwlw2teg3","name":"Git commit message convention that you can follow!"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/solid-principles-sketches-2kiqot4fj","name":"SOLID Principles Sketches"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/heroku-is-no-longer-free-here-are-the-best-alternatives-iie33y3zf","name":"Heroku Is No Longer Free, Here Are The Best Alternatives"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/hooks-pattern-5p5vsey2m","name":"Hooks Pattern"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/top-2-reasons-why-i-moved-from-notion-to-obsidian-as-a-software-developer-hof3ej71c","name":"Top 2 Reasons Why I Moved From Notion to Obsidian as a Software Developer"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/html-reference-psu-7utf7","name":"HTML Reference"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/introducing-turbopack-rust-based-successor-to-webpack-vercel-uraatdhsj","name":"Introducing Turbopack: Rust-based successor to Webpack – Vercel"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/learn-this-before-react-k6-nkvmqi","name":"Learn this before React"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/from-zero-to-devops-engineer---devops-roadmap-for-your-specific-background--maru3uexl","name":"From Zero to DevOps Engineer - DevOps Roadmap for YOUR specific background 🔥"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/vscode-updates-frameworks-git-cli-js-utils-fxn-8vszg","name":"VSCode Updates, Frameworks, Git/CLI, JS Utils"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/7-cool-html-elements-nobody-uses-79wmjlbef","name":"7 Cool HTML Elements Nobody Uses"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/please-do-repeat-yourself-dry-is-dead--detdft1dx","name":"Please do repeat yourself (DRY is dead)"},{"@type":"ListItem","position":24,"url":"https://daily.dev/posts/how-to-debug-like-a-pro-d42mlrzmq","name":"How to Debug Like a Pro"},{"@type":"ListItem","position":25,"url":"https://daily.dev/posts/understanding-async-await-yc3aezp0u","name":"Understanding Async & Await"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Explore","item":"https://daily.dev/posts"},{"@type":"ListItem","position":3,"name":"Best of","item":"https://daily.dev/posts/best-of"},{"@type":"ListItem","position":4,"name":"October 2022"}]}]} ```