[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"verticals":3,"tag-javascript-12":44,"search-suggestions":227,"tags-all":262},[4,20,32],{"id":5,"slug":6,"name":7,"tagline":8,"description":9,"accentFrom":10,"accentTo":11,"icon":12,"defaultLocale":13,"locales":14,"features":16,"position":19},"019fe637-3d33-714b-b57f-23e163ffca0c","dev","Web Development","Read it. Run it. Prove it.","A post a day on modern web development — most with an editable playground and a quiz that explains every answer. Free, no account needed.","violet-500","cyan-400","◇","en",[13,15],"fa",{"courses":17,"paths":17,"articles":17,"exams":18,"flashcards":18,"packages":17,"community":17,"certificates":17,"teams":17,"commerce":17},true,false,0,{"id":21,"slug":22,"name":23,"tagline":24,"description":25,"accentFrom":26,"accentTo":10,"icon":27,"defaultLocale":13,"locales":28,"features":30,"position":31},"019fe637-3dc2-754c-8657-0f175bfee7c6","lang","Languages","Learn a language the way you learn a codebase.","Grammar explained the way good documentation explains an API — one idea at a time, each with a quiz.","amber-400","⌘",[13,15,29],"es",{"courses":18,"paths":18,"articles":17,"exams":18,"flashcards":17,"packages":18,"community":17,"certificates":17,"teams":18,"commerce":18},2,{"id":33,"slug":34,"name":35,"tagline":36,"description":37,"accentFrom":38,"accentTo":39,"icon":40,"defaultLocale":13,"locales":41,"features":42,"position":43},"7b3c16f2-931d-410e-802e-e1fa4edab7de","soft","Soft Skills","The half of the job nobody wrote documentation for.","Weekly, on the parts of working life that decide more than your code does — first weeks, meetings, interviews, promotions, and the people around you. Written from what actually happens, and recorded as a podcast you can listen to on the walk.","emerald-400","teal-300","◉",[13],{"courses":18,"paths":18,"articles":17,"exams":18,"flashcards":18,"packages":18,"community":17,"certificates":18,"teams":18,"commerce":18},3,{"items":45,"meta":224},[46,78,95,113,133,150,167,184,206],{"id":47,"slug":48,"title":49,"subtitle":50,"excerpt":51,"coverUrl":52,"locale":13,"readingMinutes":53,"publishedAt":54,"viewCount":55,"likeCount":19,"commentCount":19,"author":56,"vertical":61,"topic":62,"tags":65,"_count":77,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-e05c-77bb-b8a3-cb8dbdc99346","css-layer-architecture","You reached for !important again. @layer is the real fix.",null,"When a third-party reset beats your styles and your own utilities lose to an ancient nested rule, the problem isn't your selectors. It's that your stylesheet has no architecture. @layer adds one.","\u002Fmedia\u002Fcovers\u002Fcss-layer-architecture.png",5,"2026-07-04T08:44:02.193Z",181,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},"019fe637-3c25-7088-9034-39c9f15dc3c8","Parsa Jiravand","parsa","Frontend engineer · building bestpractic",{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":63,"name":64},"css","CSS",[66,68,71,74],{"slug":63,"name":67,"color":50},"Css",{"slug":69,"name":70,"color":50},"webdev","Webdev",{"slug":72,"name":73,"color":50},"frontend","Frontend",{"slug":75,"name":76,"color":50},"javascript","Javascript",{"assessments":19},{"id":79,"slug":80,"title":81,"subtitle":50,"excerpt":82,"coverUrl":83,"locale":13,"readingMinutes":53,"publishedAt":84,"viewCount":85,"likeCount":19,"commentCount":19,"author":86,"vertical":87,"topic":88,"tags":89,"_count":94,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-d8d6-73ed-b26b-18726a494914","view-transitions-native-page-transitions","The page transition you pay a library for is now free","You reach for Framer Motion or GSAP to make navigation feel smooth. The View Transitions API does the same thing natively — and the starting price is a single CSS rule.","\u002Fmedia\u002Fcovers\u002Fview-transitions-native-page-transitions.png","2026-07-03T09:26:36.534Z",191,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":63,"name":64},[90,91,92,93],{"slug":63,"name":67,"color":50},{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"assessments":19},{"id":96,"slug":97,"title":98,"subtitle":50,"excerpt":99,"coverUrl":100,"locale":13,"readingMinutes":101,"publishedAt":102,"viewCount":103,"likeCount":19,"commentCount":19,"author":104,"vertical":105,"topic":106,"tags":107,"_count":112,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-d19a-709a-855e-54178d886feb","has-selector-condition-evaluator",":has() isn't a parent selector. It deletes JavaScript.","Everyone calls :has() the parent selector. That framing is too small — it's a condition evaluator that obsoletes a whole category of class-toggling JS, and it's in every browser today.","\u002Fmedia\u002Fcovers\u002Fhas-selector-condition-evaluator.png",4,"2026-07-02T07:18:03.500Z",243,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":63,"name":64},[108,109,110,111],{"slug":63,"name":67,"color":50},{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"assessments":19},{"id":114,"slug":115,"title":116,"subtitle":50,"excerpt":117,"coverUrl":118,"locale":13,"readingMinutes":101,"publishedAt":119,"viewCount":120,"likeCount":19,"commentCount":19,"author":121,"vertical":122,"topic":123,"tags":125,"_count":132,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-c9aa-70db-8ac8-df39bed8061b","optimistic-updates-stop-waiting-for-the-server","Optimistic Updates: Stop Making Your Save Button Wait for the Server","Every click that spins for a server round-trip is a choice you made. Optimistic updates remove the wait — but the rollback is where almost every implementation quietly breaks.","\u002Fmedia\u002Fcovers\u002Foptimistic-updates-stop-waiting-for-the-server.png","2026-07-01T07:42:41.462Z",258,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":75,"name":124},"JavaScript",[126,127,128,129],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":130,"name":131,"color":50},"react","React",{"assessments":19},{"id":134,"slug":135,"title":136,"subtitle":50,"excerpt":137,"coverUrl":138,"locale":13,"readingMinutes":53,"publishedAt":139,"viewCount":140,"likeCount":19,"commentCount":19,"author":141,"vertical":142,"topic":143,"tags":144,"_count":149,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-c193-7159-96ba-bff62b34e53d","container-queries-responsive-primitive","Your card breaks in the sidebar. Here's the real fix.","A component that looks perfect in the main column falls apart in a sidebar — and the viewport width says everything's fine. The bug isn't your CSS. It's the question your CSS is asking.","\u002Fmedia\u002Fcovers\u002Fcontainer-queries-responsive-primitive.png","2026-06-30T07:30:01.218Z",211,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":63,"name":64},[145,146,147,148],{"slug":63,"name":67,"color":50},{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"assessments":19},{"id":151,"slug":152,"title":153,"subtitle":50,"excerpt":154,"coverUrl":155,"locale":13,"readingMinutes":101,"publishedAt":156,"viewCount":157,"likeCount":19,"commentCount":19,"author":158,"vertical":159,"topic":160,"tags":161,"_count":166,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-b9de-72a8-8656-ee81360dbd99","url-as-state-manager","The URL Is Your Best State Manager","You're storing filter state, search queries, and pagination in useState — and losing it every time someone refreshes. The URL already does this better.","\u002Fmedia\u002Fcovers\u002Furl-as-state-manager.png","2026-06-29T07:59:09.726Z",333,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":75,"name":124},[162,163,164,165],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":130,"name":131,"color":50},{"assessments":19},{"id":168,"slug":169,"title":170,"subtitle":50,"excerpt":171,"coverUrl":172,"locale":13,"readingMinutes":43,"publishedAt":173,"viewCount":174,"likeCount":19,"commentCount":19,"author":175,"vertical":176,"topic":177,"tags":178,"_count":183,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-b1ba-7644-b327-4118cffd7d22","server-components-mental-model","Server Components Without the Hype: A Mental Model That Sticks","RSC isn't 'SSR 2.0' and it isn't magic. Here's the one distinction that makes the whole model click.","\u002Fmedia\u002Fcovers\u002Fserver-components-mental-model.png","2026-06-28T09:41:35.140Z",244,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":130,"name":131},[179,180,181,182],{"slug":130,"name":131,"color":50},{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"assessments":19},{"id":185,"slug":186,"title":187,"subtitle":50,"excerpt":188,"coverUrl":189,"locale":13,"readingMinutes":43,"publishedAt":190,"viewCount":191,"likeCount":19,"commentCount":19,"author":192,"vertical":193,"topic":194,"tags":197,"_count":205,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-a9f9-7079-bfbf-ca4dc5685bdd","typescript-won-what-it-bought-us","TypeScript Won. Here's What That Actually Bought Us.","The 'should we use TypeScript?' debate is over. The interesting question is what all those types are quietly enabling now.","\u002Fmedia\u002Fcovers\u002Ftypescript-won-what-it-bought-us.png","2026-06-28T07:31:54.189Z",250,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":195,"name":196},"typescript","TypeScript",[198,200,201,202],{"slug":195,"name":199,"color":50},"Typescript",{"slug":75,"name":76,"color":50},{"slug":69,"name":70,"color":50},{"slug":203,"name":204,"color":50},"ai","Ai",{"assessments":19},{"id":207,"slug":208,"title":209,"subtitle":50,"excerpt":210,"coverUrl":211,"locale":13,"readingMinutes":53,"publishedAt":212,"viewCount":213,"likeCount":19,"commentCount":19,"author":214,"vertical":215,"topic":216,"tags":218,"_count":223,"playground":50,"hasQuiz":18,"hasPlayground":18},"019fe65f-9991-7098-a2e8-28d741366ffa","frontend-future-ai","The Frontend Is Becoming a Conversation: Where UI Engineering Goes Next","Frontend stacks consolidated, the rendering wars cooled off, and AI quietly changed what a frontend engineer actually does all day. Here's where it's heading.","\u002Fmedia\u002Fcovers\u002Ffrontend-future-ai.png","2026-06-25T12:27:00.662Z",310,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":203,"name":217},"AI",[219,220,221,222],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":203,"name":204,"color":50},{"slug":75,"name":76,"color":50},{"assessments":19},{"page":225,"perPage":225,"total":226,"totalPages":225},12,141,[228,230,231,233,237,239,243,245,247,251,255,259],{"slug":69,"name":70,"articles":229},174,{"slug":75,"name":76,"articles":226},{"slug":72,"name":73,"articles":232},96,{"slug":234,"name":235,"articles":236},"tutorial","Tutorial",71,{"slug":63,"name":67,"articles":238},51,{"slug":240,"name":241,"articles":242},"performance","Performance",30,{"slug":195,"name":199,"articles":244},25,{"slug":130,"name":131,"articles":246},20,{"slug":248,"name":249,"articles":250},"programming","Programming",19,{"slug":252,"name":253,"articles":254},"browser","Browser",18,{"slug":256,"name":257,"articles":258},"node","Node",16,{"slug":260,"name":261,"articles":225},"html","Html",[263,264,265,266,267,268,269,270,271,272,273,274,275,279,283,286,290,294,297,300,304,307,311,314,317,320,321,324,327,330,333,336,339,342,345,348,351,354,357,360],{"slug":69,"name":70,"color":50,"articles":229},{"slug":75,"name":76,"color":50,"articles":226},{"slug":72,"name":73,"color":50,"articles":232},{"slug":234,"name":235,"color":50,"articles":236},{"slug":63,"name":67,"color":50,"articles":238},{"slug":240,"name":241,"color":50,"articles":242},{"slug":195,"name":199,"color":50,"articles":244},{"slug":130,"name":131,"color":50,"articles":246},{"slug":248,"name":249,"color":50,"articles":250},{"slug":252,"name":253,"color":50,"articles":254},{"slug":256,"name":257,"color":50,"articles":258},{"slug":260,"name":261,"color":50,"articles":225},{"slug":276,"name":277,"color":50,"articles":278},"nextjs","Nextjs",11,{"slug":280,"name":281,"color":50,"articles":282},"vue","Vue",10,{"slug":284,"name":285,"color":50,"articles":282},"accessibility","Accessibility",{"slug":287,"name":288,"color":50,"articles":289},"nestjs","Nestjs",9,{"slug":291,"name":292,"color":50,"articles":293},"nuxt","Nuxt",8,{"slug":295,"name":296,"color":50,"articles":293},"career","Career",{"slug":298,"name":299,"color":50,"articles":293},"discuss","Discuss",{"slug":301,"name":302,"color":50,"articles":303},"beginners","Beginners",7,{"slug":305,"name":306,"color":50,"articles":303},"productivity","Productivity",{"slug":308,"name":309,"color":50,"articles":310},"grammar","Grammar",6,{"slug":312,"name":313,"color":50,"articles":53},"security","Security",{"slug":315,"name":316,"color":50,"articles":101},"ssr","SSR",{"slug":318,"name":319,"color":50,"articles":101},"apis","Apis",{"slug":203,"name":204,"color":50,"articles":43},{"slug":322,"name":323,"color":50,"articles":43},"api","API",{"slug":325,"name":326,"color":50,"articles":43},"caching","Caching",{"slug":328,"name":329,"color":50,"articles":31},"async","Async",{"slug":331,"name":332,"color":50,"articles":31},"forms","Forms",{"slug":334,"name":335,"color":50,"articles":31},"dom","Dom",{"slug":337,"name":338,"color":50,"articles":31},"backend","Backend",{"slug":340,"name":341,"color":50,"articles":31},"english","English",{"slug":343,"name":344,"color":50,"articles":31},"verbs","Verbs",{"slug":346,"name":347,"color":50,"articles":31},"spanish","Spanish",{"slug":349,"name":350,"color":50,"articles":31},"a1","A1",{"slug":352,"name":353,"color":50,"articles":31},"a2","A2",{"slug":355,"name":356,"color":50,"articles":31},"tenses","Tenses",{"slug":358,"name":359,"color":50,"articles":31},"turkish","Turkish",{"slug":361,"name":362,"color":50,"articles":31},"animation","Animation"]