--- title: Best Community Picks posts — October 2024 | daily.dev description: The most upvoted Community Picks posts from October 2024, curated by the daily.dev community. canonical: https://daily.dev/sources/community/best-of/2024/10 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/sources/community/best-of/2024/10 og:type: website og:site_name: daily.dev og:title: Best Community Picks posts — October 2024 | daily.dev og:description: The most upvoted Community Picks posts from October 2024, 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 Community Picks — October 2024 1. 1 [](https://daily.dev/posts/a-cheatsheet-of-128-cheatsheets-for-developers-4ulgpkdav "A CheatSheet of 128 CheatSheets for Developers") Article Community Picks · 2y A CheatSheet of 128 CheatSheets for Developers This post is a curated list of 128 cheat sheets and tutorials covering various programming languages, frameworks, tools, and other tech-related topics. It includes resources for languages like Java, Python, and JavaScript, frameworks such as Angular and React, and tools like Git, Docker, and Bash. The list aims to be clear, interactive, and beginner-friendly. A link to the author's GitHub repository where the list is maintained is also provided. 3.6K 82 2. 2 [](https://daily.dev/posts/1-year-of-consistent-leetcoding-56dgvzorq "1 Year of Consistent LeetCoding") Article Community Picks · 2y 1 Year of Consistent LeetCoding After attempting the Google Foobar challenge and going through several interview rounds with Google, the author didn't get the job but found inspiration to master data structures and algorithms. They committed to solving LeetCode problems daily, resulting in a 365+ day streak. Key learnings included efficient array manipulation, string handling, understanding hash tables, sorting algorithms, and greedy algorithms. Regular practice and tracking progress were vital in improving their skills. 1.4K 61 3. 3 [](https://daily.dev/posts/faker-buk3lhgmj "Faker") Article Community Picks · 2y Faker Generate various personal information elements such as names, genders, bios, and job titles using the Faker tool. Ideal for software testing and profile creation. 1.2K 49 4. 4 [](https://daily.dev/posts/software-development-explained-with-cars-4b4vuygyi "Software Development Explained With Cars") Article Community Picks · 2y Software Development Explained With Cars Explaining software development to clients can be challenging, especially the differences between their expectations and actual development processes. Agile development allows for client involvement and adjustments, likened to tailoring a suit. However, protecting development time is crucial, and tools like Kanban boards and Scrum systems can help manage tasks efficiently. Additionally, time tracking provides valuable insights into project costs and productivity. 908 31 5. 5 [](https://daily.dev/posts/create-beautiful-images-of-your-source-code-wzdjx6ine "Create beautiful images of your source code") Article Community Picks · 2y Create beautiful images of your source code Instructions for creating visually appealing images of a provided JavaScript code snippet, including rendering button clicks and updating the button text dynamically. 750 63 6. 6 [](https://daily.dev/posts/state-of-frontend-2024-5ioaqqkaq "State of Frontend 2024") Article Community Picks · 2y State of Frontend 2024 Visual Studio Code is the dominant choice among front-end developers due to its free nature and extensive ecosystem of extensions. JetBrains IDEs, particularly WebStorm, are favored for their out-of-the-box experience and reliability. Despite a stable two-year period in editor preferences, new AI-driven code editors like Cursor are emerging. Browser-based editors remain limited in adoption, primarily used for quick demos. GitHub is the leading version control provider, followed by GitLab and BitBucket. 667 10 7. 7 [](https://daily.dev/posts/10-javascript-concepts-every-node-developer-must-master-hwmyhz3zv "10 JavaScript concepts every Node developer must master") Article Community Picks · 2y 10 JavaScript concepts every Node developer must master Node.js has become a standard for building web apps and systems software, utilizing JavaScript on the back end. Key JavaScript concepts include closures, prototypes, private properties, modules, error handling, currying, call/apply/bind methods, memoization, IIFE, and argument handling. Mastering these concepts can help Node developers write scalable and efficient code, despite the challenges posed by JavaScript's multiparadigm nature and Node's single-threaded architecture. 635 24 8. 8 [](https://daily.dev/posts/a-systematic-technique-for-improving-focus-bcouo4vfi "A Systematic Technique for Improving Focus") Article Community Picks · 2y A Systematic Technique for Improving Focus The post discusses a systematic technique for improving focus, likening it to weightlifting where gradual progress is key. Drawing from the martial arts practice of the horse stance, the technique involves committing to a set period of uninterrupted focus, even when facing discomfort or distractions. The author shares practical steps and tools, like the Tomatillo Timer, to help enhance focus and reduce distractions, emphasizing that each return to the task is a step towards improvement. The technique parallels mindfulness meditation and has proven benefits for cognitive enhancement. 468 20 9. 9 [](https://daily.dev/posts/top-next-js-tools-for-next-gen-developers-ktwwwh6tw "Top Next.js Tools for Next-Gen Developers") Article Community Picks · 2y Top Next.js Tools for Next-Gen Developers Next.js is a powerful React framework ideal for building performance and SEO-friendly web applications. This post highlights essential tools for developers to enhance productivity, including those for SEO, authentication, data management, UI component testing, and styling. Key tools such as NextAuth.js, Prisma, Tailwind CSS, Storybook, Jest, and Cypress are covered to help streamline development and ensure high-quality applications. 459 16 10. 10 [](https://daily.dev/posts/how-to-see-beautiful-git-project-stats-in-your-terminal-dkfykrtwy "How to See Beautiful Git Project Stats in Your Terminal") Article Community Picks · 2y How to See Beautiful Git Project Stats in Your Terminal Onefetch is a tool that provides beautiful code stats for git projects directly in your terminal, showcasing ASCII art, language breakdown, contributor info, and more. It is available for Linux, macOS, and Windows and offers various customization options like hiding ASCII art and changing output fields. 441 16 11. 11 [](https://daily.dev/posts/7-simple-tips-to-improve-daily-focus-qhzh72fzv "7 Simple Tips to Improve Daily Focus") Article Community Picks · 2y 7 Simple Tips to Improve Daily Focus Achieving daily focus can be challenging, especially for those with ADHD. Implementing seven simple strategies, including having a low dopamine morning, meditating, writing things down, exercising, reducing app and social media use, taking Berocca supplements, and avoiding substances like sugar and caffeine, can greatly improve concentration and productivity. These tips are universally applicable and can help anyone seeking better focus daily. 415 23 12. 12 [](https://daily.dev/posts/i-built-a-study-timer-to-improve-my-focus-fnssliezs "I Built a Study Timer to Improve My Focus") Article Community Picks · 2y I Built a Study Timer to Improve My Focus Tomatillo Timer is a free, ad-free Pomodoro app built to enhance study focus. It utilizes configurable Pomodoro sessions combined with other techniques to improve concentration. Developed using technologies like Svelte 5, Valibot, Pico CSS, and Tiptap, the app aims to help users stay on task despite distractions. The developer also introduces Flotes, a Markdown note-taking app, and plans to create a productivity-focused Discord channel. 336 55 13. 13 [](https://daily.dev/posts/build-an-invoice-app-with-next-js-15-ec9vlmrau "Build an Invoice App with Next.js 15") Video Community Picks · 2y Build an Invoice App with Next.js 15 Learn to build a full stack invoice app using Next.js 15, TypeScript, Tailwind, and Shaden components. The app will allow invoice creation, payment processing through Stripe, and email notifications via Resend. It leverages new React 19 APIs and uses Drizzle ORM to manage Postgres data. The app includes social login, multi-factor authentication through Clerk, and is deployed on Vercel. 338 9 14. 14 [](https://daily.dev/posts/drag-to-select-vhwkiw7fe "Drag to Select") Article Community Picks · 2y Drag to Select A developer from Makeswift shares insights from a project focused on improving their file manager with drag selection. They detail challenges faced, specifically with state management, and present a solution using vectors to simplify the drag selection process. The final implementation addresses various edge cases and enhances user experience by preventing unwanted text selection and enabling auto-scrolling. 336 14 15. 15 [](https://daily.dev/posts/best-design-system-examples-jtmfkdylo "Best design system examples") Article Community Picks · 2y Best design system examples Exploring top design system examples to help build or improve your own, this post covers the essentials like consistency, efficiency, scalability, collaboration, and quality control. Featuring IBM's Carbon, Atlassian's, and Adobe's Spectrum design systems, it offers insights into unique approaches and best practices in design systems. 330 6 16. 16 [](https://daily.dev/posts/chartdb-from-zero-to-1-5k-github-stars-in-3-days---here-s-how--wjx2e6vo1 "ChartDB: From Zero to 1.5K GitHub Stars in 3 Days - Here’s How 🚀⭐️") Article Community Picks · 2y ChartDB: From Zero to 1.5K GitHub Stars in 3 Days - Here’s How 🚀⭐️ ChartDB, a revolutionary tool in database design, received 1.5K GitHub stars within 3 days of its launch. Created by Guy Ben-Aharon and his co-founder, its goal is to simplify database visualization for developers. Built in just three weeks, the project highlights the future of coding with tools like Code Cursor and Claude 3.5 Sonnet. Future plans include AI integration, community collaboration, and feature expansion. 321 14 17. 17 [](https://daily.dev/posts/better-auth-mlybduwgh "Better Auth") Article Community Picks · 2y Better Auth Supports popular frontend, backend, and meta frameworks like React, Vue, Svelte, and more. Provides secure email and password authentication, multiple OAuth providers for social sign-on, built-in two-factor authentication, and tools for managing user access. Extend functionality via official and community plugins. 301 8 18. 18 [](https://daily.dev/posts/i-made-a-multiplayer-game-from-scratch-because-no-one-is-hiring-junior-devs--pwlos6pnv "I made a multiplayer game from scratch because no one is hiring junior devs.") Video Community Picks · 2y I made a multiplayer game from scratch because no one is hiring junior devs. A junior developer, frustrated with the job market, built a multiplayer browser game to enhance their resume. The game features turn-based tactics on a 2D hexagonal grid with limited player visibility and a shrinking map. The client-side is developed using TypeScript and HTML5 canvas, while the server-side is implemented in Golang using websockets. The project includes complex features like responsive UI, pathfinding, animations, and real-time multiplayer logic. Despite some challenges, including iOS websocket issues, the game is functional and available to play. 273 9 19. 19 [](https://daily.dev/posts/the-3-laws-of-writing-readable-code-8n6ozliiz "The 3 Laws of Writing Readable Code") Video Community Picks · 2y The 3 Laws of Writing Readable Code Readable code is crucial for maintainability and collaboration. The three laws to achieve this are: avoid deep nesting by inverting conditionals, reduce code duplication by extracting repeated logic into functions, and use clear and meaningful naming conventions. These practices simplify understanding and modifying code, making it more efficient for future developers. 264 3 20. 20 [](https://daily.dev/posts/shiki-sy6bdtwk6 "Shiki") Article Community Picks · 2y Shiki Explore techniques in TypeScript, including using 'typeof' to infer types, 'satisfies' for type matching, and generics with 'extends' and default values. Examples demonstrate practical applications such as type-safe functions and interfaces with default types. 239 3 21. 21 [](https://daily.dev/posts/how-not-to-design-modern-ui-eq86fxrns "How NOT to Design Modern UI") Article Community Picks · 2y How NOT to Design Modern UI Rachel returns after a year to discuss best practices in UI/UX design, focusing on proper use of shadows, fonts, gradients, and visual elements. She advises against over-relying on UI kits and encourages designers to start with basic kits to maintain creative flexibility. Rachel also stresses the importance of A/B testing for effective imagery and the role of white space in creating balanced designs. Game-changing tips like avoiding generic visuals and understanding cultural design preferences are highlighted. 218 9 22. 22 [](https://daily.dev/posts/i-ve-been-using-these-8-core-linux-commands-wrong-for-years-tq2mpb3fn "I’ve Been Using These 8 Core Linux Commands Wrong for Years") Article Community Picks · 2y I’ve Been Using These 8 Core Linux Commands Wrong for Years A seasoned Linux user discusses eight common command-line mistakes and provides efficient alternatives. Highlights include using \`ls -A\` to hide certain directory shortcuts, performing recursive greps with \`grep -r\`, creating nested directories with \`mkdir -p\`, and switching between directories with \`cd -\`. Additional tips cover copying directories with \`cp -a\`, extracting \`tar.gz\` files in a single step, using \`cat\` with options to view files better, and obtaining concise disk usage statistics using \`du --max-depth\`. 214 17 23. 23 [](https://daily.dev/posts/shadcnblocks-com-250-premium-blocks-for-shadcn-ui-mdrj02jry "Shadcnblocks.com: 250 premium blocks for Shadcn UI") Article Community Picks · 2y Shadcnblocks.com: 250 premium blocks for Shadcn UI A premium collection of 250 high-quality marketing blocks designed specifically for Shadcn UI, Tailwind, and React. Created by professional designers and developers, these components are fully interactive, responsive, and can be easily integrated into existing projects. 213 12 24. 24 [](https://daily.dev/posts/the-best-three-js-resources-in-one-place-rqlfnagje "The Best Three.js Resources in One Place") Article Community Picks · 2y The Best Three.js Resources in One Place Discover a curated compilation of resources designed for building immersive 3D projects with Three.js. This collection includes tools, tutorials, and libraries to aid in Three.js development, covering areas from shaders and animation to modeling and interactivity. 211 3 25. 25 [](https://daily.dev/posts/how-to-use-web-workers-in-react-uit6dy8w1 "How to Use Web Workers in React") Article Community Picks · 2y How to Use Web Workers in React React applications can suffer performance issues when handling long tasks on the main thread. Using Web Workers, scripts can run in background threads, preventing the UI from becoming unresponsive. This guide covers the basics of Web Workers, their types, and their integration into a React app to offload intensive tasks. It includes examples of creating a Dedicated Worker, communication methods between the main thread and worker, and implementing these concepts in a React project to filter and display products efficiently. 210 5 [See all Community Picks archives](/sources/community/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/community/best-of/2024/10#page","url":"https://daily.dev/sources/community/best-of/2024/10","name":"Best Community Picks Posts — October 2024","description":"The most upvoted Community Picks posts from October 2024, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/sources/community/best-of/2024/10#items","numberOfItems":25,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/a-cheatsheet-of-128-cheatsheets-for-developers-4ulgpkdav","name":"A CheatSheet of 128 CheatSheets for Developers"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/1-year-of-consistent-leetcoding-56dgvzorq","name":"1 Year of Consistent LeetCoding"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/faker-buk3lhgmj","name":"Faker"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/software-development-explained-with-cars-4b4vuygyi","name":"Software Development Explained With Cars"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/create-beautiful-images-of-your-source-code-wzdjx6ine","name":"Create beautiful images of your source code"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/state-of-frontend-2024-5ioaqqkaq","name":"State of Frontend 2024"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/10-javascript-concepts-every-node-developer-must-master-hwmyhz3zv","name":"10 JavaScript concepts every Node developer must master"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/a-systematic-technique-for-improving-focus-bcouo4vfi","name":"A Systematic Technique for Improving Focus"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/top-next-js-tools-for-next-gen-developers-ktwwwh6tw","name":"Top Next.js Tools for Next-Gen Developers"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/how-to-see-beautiful-git-project-stats-in-your-terminal-dkfykrtwy","name":"How to See Beautiful Git Project Stats in Your Terminal"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/7-simple-tips-to-improve-daily-focus-qhzh72fzv","name":"7 Simple Tips to Improve Daily Focus"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/i-built-a-study-timer-to-improve-my-focus-fnssliezs","name":"I Built a Study Timer to Improve My Focus"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/build-an-invoice-app-with-next-js-15-ec9vlmrau","name":"Build an Invoice App with Next.js 15"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/drag-to-select-vhwkiw7fe","name":"Drag to Select"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/best-design-system-examples-jtmfkdylo","name":"Best design system examples"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/chartdb-from-zero-to-1-5k-github-stars-in-3-days---here-s-how--wjx2e6vo1","name":"ChartDB: From Zero to 1.5K GitHub Stars in 3 Days - Here’s How 🚀⭐️"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/better-auth-mlybduwgh","name":"Better Auth"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/i-made-a-multiplayer-game-from-scratch-because-no-one-is-hiring-junior-devs--pwlos6pnv","name":"I made a multiplayer game from scratch because no one is hiring junior devs."},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/the-3-laws-of-writing-readable-code-8n6ozliiz","name":"The 3 Laws of Writing Readable Code"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/shiki-sy6bdtwk6","name":"Shiki"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/how-not-to-design-modern-ui-eq86fxrns","name":"How NOT to Design Modern UI"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/i-ve-been-using-these-8-core-linux-commands-wrong-for-years-tq2mpb3fn","name":"I’ve Been Using These 8 Core Linux Commands Wrong for Years"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/shadcnblocks-com-250-premium-blocks-for-shadcn-ui-mdrj02jry","name":"Shadcnblocks.com: 250 premium blocks for Shadcn UI"},{"@type":"ListItem","position":24,"url":"https://daily.dev/posts/the-best-three-js-resources-in-one-place-rqlfnagje","name":"The Best Three.js Resources in One Place"},{"@type":"ListItem","position":25,"url":"https://daily.dev/posts/how-to-use-web-workers-in-react-uit6dy8w1","name":"How to Use Web Workers in React"}]},{"@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":"Community Picks","item":"https://daily.dev/sources/community"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/sources/community/best-of"},{"@type":"ListItem","position":5,"name":"October 2024"}]}]} ```