[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"me":3,"catalog:en:frontend\u002Fmid":4,"config":235},null,{"field_key":5,"field_name":6,"seniority":7,"topic_key":8,"topic_name":8,"spec_key":8,"spec_name":8,"locale":9,"cell_total":10,"field_total":11,"seniorities":12,"topics":15,"specs":134,"samples":151},"frontend","Frontend","mid","","en",2466,2925,[13,7,14],"junior","senior",[16,20,23,26,29,32,35,38,41,44,47,50,53,56,59,62,65,68,71,74,77,80,83,86,89,92,95,98,101,104,107,110,113,116,119,122,125,128,131],{"key":17,"name":18,"count":19},"accessibility","Accessibility",75,{"key":21,"name":22,"count":19},"angular-change-detection","Angular Change Detection",{"key":24,"name":25,"count":19},"angular-components-lifecycle","Angular Components Lifecycle",{"key":27,"name":28,"count":19},"angular-dependency-injection","Angular Dependency Injection",{"key":30,"name":31,"count":19},"angular-directives-pipes","Angular Directives Pipes",{"key":33,"name":34,"count":19},"angular-router-forms","Angular Router Forms",{"key":36,"name":37,"count":19},"angular-testing-performance","Angular Testing Performance",{"key":39,"name":40,"count":19},"css-layout","Css Layout",{"key":42,"name":43,"count":19},"dom-browser-apis","Dom Browser Apis",{"key":45,"name":46,"count":19},"javascript-async-concurrency","Javascript Async Concurrency",{"key":48,"name":49,"count":19},"javascript-language","Javascript Language",{"key":51,"name":52,"count":19},"javascript-memory-performance","Javascript Memory Performance",{"key":54,"name":55,"count":19},"javascript-modules-bundling","Javascript Modules Bundling",{"key":57,"name":58,"count":19},"javascript-prototypes-oop","Javascript Prototypes Oop",{"key":60,"name":61,"count":19},"javascript-runtime-apis","Javascript Runtime Apis",{"key":63,"name":64,"count":19},"javascript-testing-tooling","Javascript Testing Tooling",{"key":66,"name":67,"count":19},"performance","Performance",{"key":69,"name":70,"count":19},"react-components-jsx","React Components Jsx",{"key":72,"name":73,"count":19},"react-context-state","React Context State",{"key":75,"name":76,"count":19},"react-effects-lifecycle","React Effects Lifecycle",{"key":78,"name":79,"count":19},"react-forms-suspense","React Forms Suspense",{"key":81,"name":82,"count":19},"react-hooks-state","React Hooks State",{"key":84,"name":85,"count":19},"react-rendering-performance","React Rendering Performance",{"key":87,"name":88,"count":19},"rendering-reactivity","Rendering Reactivity",{"key":90,"name":91,"count":19},"state-management","State Management",{"key":93,"name":94,"count":19},"testing","Testing",{"key":96,"name":97,"count":19},"typescript-advanced-types","Typescript Advanced Types",{"key":99,"name":100,"count":19},"typescript-generics","Typescript Generics",{"key":102,"name":103,"count":19},"typescript-modules-declarations","Typescript Modules Declarations",{"key":105,"name":106,"count":19},"typescript-narrowing-control-flow","Typescript Narrowing Control Flow",{"key":108,"name":109,"count":19},"typescript-tooling-config","Typescript Tooling Config",{"key":111,"name":112,"count":19},"typescript-type-fundamentals","Typescript Type Fundamentals",{"key":114,"name":115,"count":19},"vue-components-props","Vue Components Props",{"key":117,"name":118,"count":19},"vue-composition-api","Vue Composition Api",{"key":120,"name":121,"count":19},"vue-directives-templates","Vue Directives Templates",{"key":123,"name":124,"count":19},"vue-performance-testing","Vue Performance Testing",{"key":126,"name":127,"count":19},"vue-reactivity-system","Vue Reactivity System",{"key":129,"name":130,"count":19},"vue-router-state-management","Vue Router State Management",{"key":132,"name":133,"count":19},"web-security","Web Security",[135,139,142,145,148],{"key":136,"name":137,"count":138},"angular","Angular",450,{"key":140,"name":141,"count":138},"javascript","JavaScript",{"key":143,"name":144,"count":138},"react","React",{"key":146,"name":147,"count":138},"typescript","TypeScript",{"key":149,"name":150,"count":138},"vue","Vue",[152,170,183,196,209,222],{"id":153,"topic":18,"difficulty":154,"body":155,"options":156,"correct_key":167,"explanation":169},"019f56bb-ba40-73f7-b2bc-9d7da73f2eb8",2,"```html\n\u003C!-- A -->\n\u003Cdiv class=\"btn\" onclick=\"save()\">Save\u003C\u002Fdiv>\n\n\u003C!-- B -->\n\u003Cbutton class=\"btn\" onclick=\"save()\">Save\u003C\u002Fbutton>\n```\nBoth controls call `save()` when clicked with a mouse. Which statement is correct?",[157,160,163,166],{"key":158,"text":159},"a","They are equivalent, because the `onclick` handler fires the same way for both elements",{"key":161,"text":162},"b","A is better, because a `\u003Cdiv>` can be styled more flexibly than a `\u003Cbutton>` element",{"key":164,"text":165},"c","Both are inaccessible, because inline `onclick` handlers are completely ignored by screen readers",{"key":167,"text":168},"d","Only B is reachable by Tab and activatable with the keyboard; A needs extra work to match it","The `\u003Cbutton>` is focusable and responds to Enter\u002FSpace out of the box, so keyboard and screen-reader users can use it. The `\u003Cdiv>` responds only to mouse clicks unless you add `tabindex`, a role, and key handlers — inline `onclick` itself is not ignored (c), it just adds no keyboard support.",{"id":171,"topic":18,"difficulty":154,"body":172,"options":173,"correct_key":161,"explanation":182},"019f56bb-ba40-79da-833d-a8e905d4681e","You have a text input for an email address, with the visible word 'Email' next to it in a separate `\u003Cspan>`. A screen-reader user tabs to the field and hears only 'edit text', with no label. What is the correct fix?",[174,176,178,180],{"key":158,"text":175},"Add a `title` attribute to the `\u003Cspan>` so its text gets announced together with the field",{"key":161,"text":177},"Use a `\u003Clabel for=\"...\">` whose `for` value matches the input's `id` attribute",{"key":164,"text":179},"Wrap the input in a `\u003Cdiv role=\"label\">` so the browser links the nearby text to it",{"key":167,"text":181},"Put a `placeholder=\"Email\"` on the input so its purpose is announced to the user","A `\u003Clabel>` with `for` matching the input's `id` (or a `\u003Clabel>` wrapping the input) creates a programmatic association, so the field is announced as 'Email'. A `placeholder` (d) is not a reliable label — it disappears on typing and is inconsistently announced — and there is no `role=\"label\"` (c).",{"id":184,"topic":18,"difficulty":154,"body":185,"options":186,"correct_key":167,"explanation":195},"019f56bb-ba41-773a-b9a6-5910907615d5","A page uses a small decorative swirl image purely for visual flourish; it carries no information. How should its `\u003Cimg>` be marked up for accessibility?",[187,189,191,193],{"key":158,"text":188},"Give it a descriptive `alt` such as `alt=\"decorative swirl divider between the two sections\"`",{"key":161,"text":190},"Leave the `alt` attribute off entirely so the browser can decide how to announce it",{"key":164,"text":192},"Add `role=\"img\"` plus an `aria-label` describing the swirl for screen-reader users",{"key":167,"text":194},"Give it an empty `alt=\"\"` so assistive technology skips it as decorative","An empty `alt=\"\"` tells screen readers the image is decorative and can be ignored, avoiding noise. Describing a meaningless flourish (a) adds clutter, and omitting `alt` entirely (b) makes many screen readers read the file name instead of skipping it.",{"id":197,"topic":18,"difficulty":154,"body":198,"options":199,"correct_key":161,"explanation":208},"019f56bb-ba41-7e17-a87f-d141d834c4f9","What does the guideline 'No ARIA is better than bad ARIA' mean in practice?",[200,202,204,206],{"key":158,"text":201},"You should avoid ARIA completely, because native HTML can already express every possible widget",{"key":161,"text":203},"Incorrect ARIA can override native semantics and mislead users, so wrong ARIA is worse than none",{"key":164,"text":205},"ARIA attributes slow the page down, so removing all of them always improves performance",{"key":167,"text":207},"Only senior developers should be allowed to add ARIA attributes to a production codebase","Wrong ARIA (a misused `role`, a stale state) overrides an element's real semantics and actively lies to assistive tech, which is worse than leaving correct native semantics alone. It does not mean ARIA is never needed (a) — it means use it correctly, and prefer native HTML first.",{"id":210,"topic":18,"difficulty":154,"body":211,"options":212,"correct_key":158,"explanation":221},"019f56bb-ba42-751f-86d9-f3b947a7e5d1","A developer turns a `\u003Cdiv>` into a clickable card by adding an `onclick` handler and some CSS. Mouse users can click it, but keyboard users cannot reach or activate it. Which set of additions makes it keyboard-accessible?",[213,215,217,219],{"key":158,"text":214},"Add `tabindex=\"0\"`, an appropriate `role`, and a keydown handler for Enter\u002FSpace",{"key":161,"text":216},"Add `tabindex=\"-1\"` so the card enters the normal Tab order the way a link does",{"key":164,"text":218},"Add `cursor: pointer` in CSS so the browser starts treating the element as interactive",{"key":167,"text":220},"Add an `aria-label` so screen readers are able to find and then activate the card","A generic `\u003Cdiv>` needs three things to behave like a control: focusability (`tabindex=\"0\"`), a role so it is announced correctly, and key handling for Enter\u002FSpace. `tabindex=\"-1\"` (b) makes it focusable only via script, not Tab; `cursor: pointer` (c) is purely visual; `aria-label` (d) names it but does not make it focusable or operable.",{"id":223,"topic":18,"difficulty":154,"body":224,"options":225,"correct_key":167,"explanation":234},"019f56bb-ba42-7bcd-a92f-1b144baeef78","```css\n:focus {\n  outline: none;\n}\n```\nA stylesheet contains this global rule to get rid of the 'ugly' focus ring. Why is this an accessibility problem?",[226,228,230,232],{"key":158,"text":227},"It disables mouse hover styles as a side effect on every interactive element on the page",{"key":161,"text":229},"It applies only to links, so buttons and inputs are left with an inconsistent focus style",{"key":164,"text":231},"`outline` cannot be styled, so this rule is silently ignored by every modern browser anyway",{"key":167,"text":233},"Keyboard users lose the visible indicator that shows which element is currently focused","The focus outline is how keyboard users see where they are on the page; removing it globally leaves them navigating blind. If the default ring looks bad, replace it with a visible custom style (`outline` or `box-shadow`) rather than removing it — it is fully styleable, so (c) is false.",{"fields":236,"seniorities":411,"interview_shapes":412,"locales":417,"oauth":419,"question_count":422,"coach_enabled":423,"jd_match_enabled":423},[237,263,271,288,312,325,344,363,385,392,398,405],{"key":238,"name_tr":239,"name_en":239,"sort":240,"specializations":241},"backend","Backend",1,[242,245,248,251,254,257,260],{"key":243,"name":244,"field":238},"general","Genel",{"key":246,"name":247,"field":238},"go","Go",{"key":249,"name":250,"field":238},"python","Python",{"key":252,"name":253,"field":238},"java","Java",{"key":255,"name":256,"field":238},"csharp","C#\u002F.NET",{"key":258,"name":259,"field":238},"nodejs","Node.js",{"key":261,"name":262,"field":238},"php","PHP",{"key":5,"name_tr":6,"name_en":6,"sort":154,"specializations":264},[265,266,267,268,269,270],{"key":243,"name":244,"field":5},{"key":140,"name":141,"field":5},{"key":146,"name":147,"field":5},{"key":143,"name":144,"field":5},{"key":149,"name":150,"field":5},{"key":136,"name":137,"field":5},{"key":272,"name_tr":273,"name_en":273,"sort":274,"specializations":275},"fullstack","Fullstack",3,[276,277,278,279,280,281,282,283,284,285,286,287],{"key":243,"name":244,"field":272},{"key":246,"name":247,"field":238},{"key":249,"name":250,"field":238},{"key":252,"name":253,"field":238},{"key":255,"name":256,"field":238},{"key":258,"name":259,"field":238},{"key":261,"name":262,"field":238},{"key":140,"name":141,"field":5},{"key":146,"name":147,"field":5},{"key":143,"name":144,"field":5},{"key":149,"name":150,"field":5},{"key":136,"name":137,"field":5},{"key":289,"name_tr":290,"name_en":290,"sort":291,"specializations":292},"devops-cloud","DevOps \u002F Cloud",4,[293,294,297,300,303,306,309],{"key":243,"name":244,"field":289},{"key":295,"name":296,"field":289},"aws","AWS",{"key":298,"name":299,"field":289},"gcp","GCP",{"key":301,"name":302,"field":289},"azure","Azure",{"key":304,"name":305,"field":289},"kubernetes","Kubernetes",{"key":307,"name":308,"field":289},"terraform","Terraform",{"key":310,"name":311,"field":289},"linux","Linux",{"key":313,"name_tr":314,"name_en":314,"sort":315,"specializations":316},"ai-engineer","AI Engineer",5,[317,318,319,322],{"key":243,"name":244,"field":313},{"key":249,"name":250,"field":313},{"key":320,"name":321,"field":313},"llm-rag","LLM\u002FRAG",{"key":323,"name":324,"field":313},"mlops","MLOps",{"key":326,"name_tr":327,"name_en":328,"sort":329,"specializations":330},"database","Veritabanı","Database",6,[331,332,335,338,341],{"key":243,"name":244,"field":326},{"key":333,"name":334,"field":326},"postgresql","PostgreSQL",{"key":336,"name":337,"field":326},"mysql","MySQL",{"key":339,"name":340,"field":326},"mongodb","MongoDB",{"key":342,"name":343,"field":326},"redis","Redis",{"key":345,"name_tr":346,"name_en":347,"sort":348,"specializations":349},"mobile","Mobil","Mobile",7,[350,351,354,357,360],{"key":243,"name":244,"field":345},{"key":352,"name":353,"field":345},"ios-swift","iOS (Swift)",{"key":355,"name":356,"field":345},"android-kotlin","Android (Kotlin)",{"key":358,"name":359,"field":345},"flutter","Flutter",{"key":361,"name":362,"field":345},"react-native","React Native",{"key":364,"name_tr":365,"name_en":366,"sort":367,"specializations":368},"security","Güvenlik","Security",8,[369,370,373,376,379,382],{"key":243,"name":244,"field":364},{"key":371,"name":372,"field":364},"appsec","AppSec",{"key":374,"name":375,"field":364},"offensive-pentest","Offensive \u002F Pentest",{"key":377,"name":378,"field":364},"cloud-security","Cloud Security",{"key":380,"name":381,"field":364},"devsecops","DevSecOps",{"key":383,"name":384,"field":364},"blue-team-incident","Blue Team \u002F Incident",{"key":386,"name_tr":387,"name_en":388,"sort":389,"specializations":390},"qa-test-automation","QA \u002F Test Otomasyonu","QA \u002F Test Automation",9,[391],{"key":243,"name":244,"field":386},{"key":393,"name_tr":394,"name_en":394,"sort":395,"specializations":396},"data-engineer","Data Engineer",10,[397],{"key":243,"name":244,"field":393},{"key":399,"name_tr":400,"name_en":401,"sort":402,"specializations":403},"game-dev","Oyun Geliştirme","Game Development",11,[404],{"key":243,"name":244,"field":399},{"key":406,"name_tr":407,"name_en":407,"sort":408,"specializations":409},"ml-engineer","ML Engineer",12,[410],{"key":243,"name":244,"field":406},[13,7,14],{"junior":413,"mid":415,"senior":416},{"questions":414,"median_sec":3},20,{"questions":414,"median_sec":3},{"questions":414,"median_sec":3},[418,9],"tr",[420,421],"google","github",21750,true]