--- title: Best UX posts of 2022 | daily.dev description: The most upvoted UX posts of 2022, curated by the daily.dev community. canonical: https://daily.dev/tags/ux/best-of/2022 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/ux/best-of/2022 og:type: website og:site_name: daily.dev og:title: Best UX posts of 2022 | daily.dev og:description: The most upvoted UX posts of 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 UX — 2022 1. 1 [](/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 2. 2 [](/posts/recommend-api-jrz82wxke "Recommend API") Article Slack engineering · 4y Recommend API Recommend API allows us to quickly bootstrap new recommendation use cases behind an API which is easily accessible to engineers at Slack. These recommenders reuse a common set of infrastructure for every part of the recommendation engine. This has allowed us to deliver a number of different recommendation models across the product, driving improved customer experience. 333 16 3. 3 [](/posts/it-tools---collection-of-handy-online-tools-for-devs-with-great-ux-6n6fr3j8p "IT Tools - Collection of handy online tools for devs, with great UX") Article Product Hunt · 4y IT Tools - Collection of handy online tools for devs, with great UX IT Tools is a free and open-source collection of handy online tools for developers & people working in IT. It includes a token generator, case converter, base converter QR code generator, Git cheatsheet, lorem ipsum generator, ... and many more. 285 5 4. 4 [](/posts/rippleui---cleanest-modern-and-beatifull-tailwind-css-components-d9qeslnmi "RippleUI - Cleanest, modern and beatifull Tailwind CSS components") Article Product Hunt · 4y RippleUI - Cleanest, modern and beatifull Tailwind CSS components RippleUI is a collection of components that can be easily integrated into your project to provide a consistent, responsive design and improve the user experience of your application. This is RippleUI's first launch. RippleUI was hunted by Mauricio Siu in Design Tools. 188 27 5. 5 [](/posts/new-toasts--4ny2amhxo "New Toasts! 🍞") Article daily.dev Changelog · 4y New Toasts! 🍞 We wanted to improve the notifications you receive when an action is successful, fails etc. Turning this off gives you as much time as you need to undo an action. We think our new notifications look pretty slick and improve the UX of our site and app massively! Let us know what you think! 154 16 6. 6 [](/posts/responsive-design-theory-nhaptjur8 "Responsive Design Theory") Article Towards Dev · 4y Responsive Design Theory Responsive UI centers on the principles of flexibility and continuity. Flexibility refers to layouts making optimal use of available space and adjusting when the available space changes. Avoid locking your app to a specific orientation or aspect ratio. Avoid trying to determine whether the device is a phone or tablet. 118 1 7. 7 [](/posts/how-i-got-my-1st-job-as-a-developer-by-making-simple-projects-seem-big-xvyw-0tbi "How I got my 1st job as a developer by making simple projects seem big") Article Hashnode · 4y How I got my 1st job as a developer by making simple projects seem big Julia is a self-taught front-end developer in his thirties who switched career into tech after studying Japanese and musicology while working part-time at a casino. She created a simple calculator using JavaScript using HTML, SCSS, JavaScript, hosted on GitHub pages to run the app. She later updated the code and created some mixins to familiarize herself with it. 108 4 8. 8 [](/posts/penpot-is-a-solid-open-source-figma-alternative-to-look-out-for--sdnpigenw "Penpot is a Solid Open-Source Figma Alternative to Look Out for!") Article Community Picks · 4y Penpot is a Solid Open-Source Figma Alternative to Look Out for! Penpot is a free and open-source solution as an alternative to Figma and similar design tools. It is in its beta phase following its launch on ProductHunt nearly two years ago. The major highlight is the use of SVG as its native format. 100 2 9. 9 [](/posts/advantages-and-disadvantages-of-using-linux-gcbkt-ym "Advantages and Disadvantages of Using Linux") Article It's Foss · 4y Advantages and Disadvantages of Using Linux Linux is totally open-source, meaning anyone can inspect the source code for transparency. There are specialized lightweight Linux distributions that are tailored to run on older hardware. If you don’t need Adobe for your work, Linux is a pretty good choice. 84 12 10. 10 [](/posts/padloc-an-intuitive-open-source-password-manager-7ainivpli "Padloc: An Intuitive Open-Source Password Manager") Article It's Foss · 4y Padloc: An Intuitive Open-Source Password Manager Padloc is an open-source password manager with a pleasing user interface, available cross-platform. It aims to provide a clean and simple interface to work with. Free to start with, but offers paid subscriptions to unlock most features. As per your requirements, you can choose to upgrade with a paid subscription. 73 4 11. 11 [](/posts/the-5-best-linux-distros-of-2022-urmgueyfe "The 5 Best Linux Distros of 2022") Article omg! ubuntu! · 4y The 5 Best Linux Distros of 2022 Ubuntu 22.04 LTS was the best Linux distro release of the year for me. Manjaro 22.0 ‘Sikaris’ isn’t just a distro: it’s an experience. Fedora Workstation 37.0 is a flagship desktop distro for good reason. 61 13 12. 12 [](/posts/weekly-goal-2-0-new-ranks--3ydbwky-g "Weekly Goal 2.0 (+ new ranks) 🏆") Article daily.dev Changelog · 5y Weekly Goal 2.0 (+ new ranks) 🏆 Weekly Goal 2.0 is the result of our first internal hackathon. There's a new reading progress per tag feature that allows you to better understand what have you been reading this week. The ranks also got a facelift with the following updates. More information below. 61 18 13. 13 [](/posts/four-top-front-end-monitoring-tools-for-your-website-dab76cfxr "Four top Front End Monitoring Tools for your Website") Article asayer · 4y Four top Front End Monitoring Tools for your Website Front-end or front-end application monitoring includes the process and tools for tracking and managing an application's presentation layer. For example, NGINX Amplify, a SaaS-based monitoring tool, monitors performance, tracks infrastructure assets, and enhances configuration using static analysis. OpenReplay tracks critical slowdowns, crashes, CPU/memory usage, rendering times, etc. It can capture JavaScript errors and sync with recordings. You can upload your source maps to see the source code in the stack trace. 50 1 14. 14 [](/posts/adobe-buys-figma-what-does-this-mean-for-web-standards--y6wvipsoe "Adobe Buys Figma: What Does this Mean for Web Standards?") Article The New Stack · 4y Adobe Buys Figma: What Does this Mean for Web Standards? Adobe Buys Figma: What Does this Mean for Web Standards? Figma is one of the most impressive web standards-compliant tools in recent memory. It's a bitter pill for Figma users, especially since Figma was originally marketed as an open web alternative to Adobe’s proprietary desktop tools. 49 8 15. 15 [](/posts/four-top-front-end-monitoring-tools-for-your-website-qc5lip90x "Four top Front End Monitoring Tools for your Website") Article asayer · 4y Four top Front End Monitoring Tools for your Website Front-end or front-end application monitoring includes the process and tools for tracking and managing an application’s presentation layer. It also helps fix websites, native apps, and web apps by discarding potentially harmful errors. For example, NGINX Amplify, a SaaS-based monitoring tool, monitors performance. 48 16. 16 [](/posts/next-js-vs-nuxt-js-ultimate-guide-ky1cve4uo "Next.js vs. Nuxt.js: Ultimate guide") Article LogRocket · 4y Next.js vs. Nuxt.js: Ultimate guide Next.js and Nuxt.js are modern JavaScript frameworks used to build modern web applications. Both are static site generators that embrace Jamstack architecture and are used on top of React and Vue, respectively. Next.js offers client-side and server-side rendering features and is used to develop fullstack React applications. 46 1 17. 17 [](/posts/when-life-gives-you-lemons-write-better-error-messages-opbilxz5s "When life gives you lemons, write better error messages") Article Changelog · 4y When life gives you lemons, write better error messages A year ago, Wix changed thousands of error messages across Wix in just a month. Wix decided to focus on the problem, rather than the action that led to the problem. 45 18. 18 [](/posts/css-autofill-w1nb-68nh "CSS :autofill") Article David Walsh · 4y CSS :autofill CSS:autofill Autofill is an unnatural act, so signaling to that the value in an input was changed without control is important. To add custom CSS styles to inputs whose contents have been autofilled by the browser, you can use the autofill pseudo-class. 42 4 19. 19 [](/posts/how-to-communicate-as-a-software-engineer-z3ogy1fsz "How to communicate as a software engineer") Article Hashnode · 4y How to communicate as a software engineer The security team decided that increasing the session length was an acceptable risk for the payoff of a better user experience and less frequent session timeouts. Currently users cannot log it and we are working on rolling back the update. We'll keep the team updated with our progress. 40 20. 20 [](/posts/developer-experience-infrastructure-dxi--krkvf8btm "Developer Experience Infrastructure (DXI)") Article Community Picks · 4y Developer Experience Infrastructure (DXI) Developer Experience Infrastructure (DXI) is a new emerging infrastructure category sitting on top of API and cloud infrastructure. It enables any company to deliver world-class developer experiences by offloading the intricate details and complexities of developer experience to a new set of infrastructure components and services. 35 21. 21 [](/posts/7-tips-for-python-beginners-sbvez2-fg "7 Tips for Python Beginners") Article KDnuggets · 4y 7 Tips for Python Beginners Learn everything about Python is not necessary, but you need to build a base. In an interactive learning environment, you will see a description section, code editor, ipython shell, and lessons. The only way you can move to the next task is when you have successfully typed the correct code and run it. Even companies want their employees to learn new skills, tools, and concepts. 32 1 22. 22 [](/posts/better-than-ubuntu-11-best-linux-distros-for-ubuntu-lovers-4c8rgbqc3 "Better than Ubuntu? 11 Best Linux Distros for Ubuntu Lovers") Article It's Foss · 4y Better than Ubuntu? 11 Best Linux Distros for Ubuntu Lovers Zorin OS is yet another Ubuntu-based distro that gives you a polished experience. Voyager is a Xubuntu-based Linux distro featuring GNOME and Xfce in its latest 22.04 LTS explorer edition. Voyager comes with a customized look for an old, classy Linux experience. The distribution provides user choice from the get-go. 30 23. 23 [](/posts/ux-checklists-for-interface-designers-smashing-magazine-g7efpfuzp "UX Checklists For Interface Designers — Smashing Magazine") Article Smashing Magazine · 4y UX Checklists For Interface Designers — Smashing Magazine Checklist is an open-source checklist to planning, building and growing a design system. It includes the foundation of things to keep in mind for design language, design tokens, core components, tooling and project management. Text-To-Timeline Tool Markdown is an incredible little tool to generate timelines, e.g. 29 24. 24 [](/posts/how-to-become-a-web-developer-fast-and-get-your-first-job-rqjrungke "How to Become a Web Developer Fast and Get your First Job") Article Community Picks · 4y How to Become a Web Developer Fast and Get your First Job Web developers are responsible for the efficiency of the codes of a website. They can use their skills to create websites for businesses or charities. FreeCodeCamp, Udemy, and Udacity have a lot of valuable web development courses that will teach everything from basic HTML and CSS skills to more advanced front-end techniques like responsive web design and javascript frameworks. 28 5 25. 25 [](/posts/ghostwriter-an-excellent-open-source-writing-app-9mgyinhh8 "Ghostwriter: An Excellent Open-Source Writing App") Article It's Foss · 4y Ghostwriter: An Excellent Open-Source Writing App Ghostwriter is available for Linux and Windows with an unofficial build for macOS. It is available to install via a PPA for Ubuntu-based distros, and it is also available for Fedora through a separate repository. 28 [See all UX archives](/tags/ux/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/tags/ux/best-of/2022#page","url":"https://daily.dev/tags/ux/best-of/2022","name":"Best UX Posts of 2022","description":"The most upvoted UX posts of 2022, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/tags/ux/best-of/2022#items","numberOfItems":25,"itemListElement":[{"@type":"ListItem","position":1,"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":2,"url":"https://daily.dev/posts/recommend-api-jrz82wxke","name":"Recommend API"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/it-tools---collection-of-handy-online-tools-for-devs-with-great-ux-6n6fr3j8p","name":"IT Tools - Collection of handy online tools for devs, with great UX"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/rippleui---cleanest-modern-and-beatifull-tailwind-css-components-d9qeslnmi","name":"RippleUI - Cleanest, modern and beatifull Tailwind CSS components"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/new-toasts--4ny2amhxo","name":"New Toasts! 🍞"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/responsive-design-theory-nhaptjur8","name":"Responsive Design Theory"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/how-i-got-my-1st-job-as-a-developer-by-making-simple-projects-seem-big-xvyw-0tbi","name":"How I got my 1st job as a developer by making simple projects seem big"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/penpot-is-a-solid-open-source-figma-alternative-to-look-out-for--sdnpigenw","name":"Penpot is a Solid Open-Source Figma Alternative to Look Out for!"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/advantages-and-disadvantages-of-using-linux-gcbkt-ym","name":"Advantages and Disadvantages of Using Linux"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/padloc-an-intuitive-open-source-password-manager-7ainivpli","name":"Padloc: An Intuitive Open-Source Password Manager"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/the-5-best-linux-distros-of-2022-urmgueyfe","name":"The 5 Best Linux Distros of 2022"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/weekly-goal-2-0-new-ranks--3ydbwky-g","name":"Weekly Goal 2.0 (+ new ranks) 🏆"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/four-top-front-end-monitoring-tools-for-your-website-dab76cfxr","name":"Four top Front End Monitoring Tools for your Website"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/adobe-buys-figma-what-does-this-mean-for-web-standards--y6wvipsoe","name":"Adobe Buys Figma: What Does this Mean for Web Standards?"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/four-top-front-end-monitoring-tools-for-your-website-qc5lip90x","name":"Four top Front End Monitoring Tools for your Website"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/next-js-vs-nuxt-js-ultimate-guide-ky1cve4uo","name":"Next.js vs. Nuxt.js: Ultimate guide"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/when-life-gives-you-lemons-write-better-error-messages-opbilxz5s","name":"When life gives you lemons, write better error messages"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/css-autofill-w1nb-68nh","name":"CSS :autofill"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/how-to-communicate-as-a-software-engineer-z3ogy1fsz","name":"How to communicate as a software engineer"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/developer-experience-infrastructure-dxi--krkvf8btm","name":"Developer Experience Infrastructure (DXI)"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/7-tips-for-python-beginners-sbvez2-fg","name":"7 Tips for Python Beginners"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/better-than-ubuntu-11-best-linux-distros-for-ubuntu-lovers-4c8rgbqc3","name":"Better than Ubuntu? 11 Best Linux Distros for Ubuntu Lovers"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/ux-checklists-for-interface-designers-smashing-magazine-g7efpfuzp","name":"UX Checklists For Interface Designers — Smashing Magazine"},{"@type":"ListItem","position":24,"url":"https://daily.dev/posts/how-to-become-a-web-developer-fast-and-get-your-first-job-rqjrungke","name":"How to Become a Web Developer Fast and Get your First Job"},{"@type":"ListItem","position":25,"url":"https://daily.dev/posts/ghostwriter-an-excellent-open-source-writing-app-9mgyinhh8","name":"Ghostwriter: An Excellent Open-Source Writing App"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Tags","item":"https://daily.dev/tags"},{"@type":"ListItem","position":3,"name":"UX","item":"https://daily.dev/tags/ux"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/tags/ux/best-of"},{"@type":"ListItem","position":5,"name":"2022"}]}]} ```