{"resource":{"title":"Best Code Practices for Real-World Applications - Part 1","isPremium":true,"requires":["premium.general"],"content":{"type":1,"body":"## 1. Avoid Stale Closures in React with Functional State Updates\r\n\r\nWhen working with React state, a very common pattern is updating state based on its current value — adding an item to a list, removing one, incrementing a counter, etc. Many engineers use `useCallback` in these cases to “optimise” ...","isInternal":true},"isActive":true,"stats":{"views":12,"used":0,"likes":0},"published":true,"author":{"id":"3eh0kijZwMrHum8TkMqX","name":"Devtools Tech","username":"devtoolstech"},"resourceId":"8ohjaCmxsxK093sIQad6","slug":"best-code-practices-for-real-world-applications-part-1---rid---8ohjaCmxsxK093sIQad6","createdAt":1770147079990,"showPaywall":true,"needsUpgrade":false},"currentUser":null,"isOwner":false,"recommendations":{"questions":[{"_id":"6486ce4dd12c1e240204dcc7","content":{"languages":["javascript"],"difficulty":1},"tags":["javascript","frontend","interview question","ui","ux","copy","reference","object","object properties","frontend quiz","interview questions"],"slug":"what-is-the-output-of-the-following-code-snippet-or-javascript-fundamentals-or-frontend-interview-question---qid---ExQRFHuVPv94g0l9bgSX","title":"What is the output of the following code snippet? | JavaScript Fundamentals | Frontend Interview Question","questionId":"ExQRFHuVPv94g0l9bgSX"},{"_id":"636cdb1620622762d08cfe50","content":{"languages":["javascript"],"difficulty":1},"tags":["javascript","frontend","coding","devtools tech","interview questions","interview preparation","mcq","programming paradigm","tooling","mdn","js paradigm","programming questions"],"slug":"what-is-the-paradigm-of-javascript-language---qid---MALYnvxIvkLPYvYuEFjj","title":"What is the paradigm of JavaScript language?","questionId":"MALYnvxIvkLPYvYuEFjj"},{"_id":"63ad3da122480f26b3cbe466","content":{"languages":["javascript","typescript"],"difficulty":3},"tags":["javascript","frontend","code","programming","problem solving","rgb","hex","advanced js","interview questions","frontend interview questions","devtools tech","js practice"],"slug":"how-to-convert-rgb-to-hex-javascript-interview-question-or-frontend-problem-solving---qid---8H4LgVPEEmY4rnn3t7w8","title":"How to convert RGB to HEX? JavaScript Interview Question | Frontend Problem Solving","questionId":"8H4LgVPEEmY4rnn3t7w8"},{"_id":"62fb6d1477f9961d5b7c7df6","content":{"languages":["html","react"],"difficulty":1},"tags":["","javascript","html calculator","html css","begineer","frontend begineer","frontend coding challenges","ui","ux","javascript interview questions","devtools tech","frontend masters","learn javascript","practice frontend"],"slug":"build-a-simple-html-calculator-or-frontend-coding-challenge-or-vanilla-javascript-or-machine-coding-round---qid---95l5mqyP6FmG3hVbnj9P","title":"Build a Simple HTML Calculator | Frontend Coding Challenge | Vanilla JavaScript | Machine Coding Round ","questionId":"95l5mqyP6FmG3hVbnj9P"},{"_id":"698cd2ea895fc3bf0142a54f","content":{"languages":["javascript","typescript"],"difficulty":2},"tags":["javascript","ui","ux","devtools tech","questions","frontend interview","google"],"slug":"priority-based-data-fetching---qid---VpqJajJMcGBmxW556YM4","title":"Priority Based Data Fetching","questionId":"VpqJajJMcGBmxW556YM4"}],"resources":[{"_id":"5f202c81cbec5f7ffc0c2fba","content":{"difficulty":1,"domain":2,"type":1},"tags":["Web Development"],"slug":"script-tag-—-defer-and-async---rid---NCXH57kUsnTM2Ev2tzEU","title":"Script Tag — Defer and Async","resourceId":"NCXH57kUsnTM2Ev2tzEU"},{"_id":"69537c54304108b3b5c96b2a","content":{"difficulty":4,"domain":1,"type":1,"isInternal":true,"languages":[]},"tags":["javascript","ui","ux","devtools tech","routing","frontend","coding","programming","tutorial","system design"],"slug":"urls-and-routing-practical-example---rid---o6V68nNKXJEThLaP9wmQ","title":"URLs and Routing - Practical Example","resourceId":"o6V68nNKXJEThLaP9wmQ"},{"_id":"6a12f5ac4b3e6d922c54a48c","content":{"difficulty":1,"domain":1,"type":1,"isInternal":true,"languages":[]},"tags":["javascript","ui","ux","devtools tech","coding","frontend","lazy loading images","responsive images","web performance"],"slug":"lazy-loading-images---rid---YdibwFfrwv3NjOL8RtUV","title":"Lazy Loading Images","resourceId":"YdibwFfrwv3NjOL8RtUV"},{"_id":"5f1dd63acbec5f7ffc0c2faa","content":{"difficulty":2,"domain":3,"type":1,"isInternal":true},"tags":["node.js","express","rest","api","framework","backend","tools","devtools","framework development","build express"],"slug":"build-your-own-expressjs-or-part-1---rid---qoos1dgnByAcEaCp2rbl","title":"Build your own expressjs | Part 1","resourceId":"qoos1dgnByAcEaCp2rbl"},{"_id":"692e9c62697e24762d339f5c","content":{"difficulty":1,"domain":2,"type":1,"isInternal":true,"languages":[]},"tags":["javascript","ui","ux","devtools tech","tutorial","react","rendering","mount","lifecycle"],"slug":"re-rendering-vs-unmount-in-react---rid---JUT1eFkORr5oUDT2lXtc","title":"Re-rendering vs Unmount in React","resourceId":"JUT1eFkORr5oUDT2lXtc"}]}}