More in Vue, Angular & Svelte — page 7
Explain two-way data binding and provide input binding syntax
Tests whether you see two-way binding as sugar for value binding plus an input event. Strong answer: show one syntax, then explain the prop-out, event-in pattern. Red flag: syntax only with no mention of change detection or unidirectional flow.
How do you conditionally render Login/Logout with isLoggedIn in Vue or Angular?
This tests DOM lifecycle awareness versus CSS toggling. A strong answer uses v-if/*ngIf for infrequent changes that need cleanup, and v-show/[hidden] for frequent toggles that should stay mounted. A red flag is treating them as interchangeable.
How do Vue and Angular detect nested object mutations?
Tests deep reactivity vs reference-based detection. Vue 3 Proxies catch nested mutations; Angular Default checks on zone ticks and OnPush misses same-reference changes. Fix via immutability, deep watchers, or ngDoCheck.
Architect a headless Toggle with scoped slots
This tests decoupling logic from markup via scoped slots. A strong answer exposes on and toggle through a single default scoped slot, renders no DOM, and cites UI flexibility. A red flag is using config props or CSS classes to control layout.
Implement a scoped slot pattern in a reusable DataList
It tests delegating rendering while keeping data ownership in the child. A strong answer covers a DataList that fetches internally and exposes rows via slot props, plus Angular TemplateRef via let-item. Red flag: parent loops or slots inheriting child scope.
Compare multiple boolean props versus a single status string prop
TESTS: preventing impossible UI states. OUTLINE: Booleans let callers pass conflicting flags like isLoading plus isError, leaking implementation priority; a single status enum makes invalid states unrepresentable. RED FLAG: claiming booleans are simpler.
What bindings do v-model and ngModel sugar, and why?
TESTS: If you know two-way binding is property binding plus an event. OUTLINE: v-model sugars value and input; ngModel sugars [value] and (ngModelChange). This enforces one-way data flow for predictable state.
How do you emit events from a child to parent component?
This probes unidirectional data flow and child-to-parent event emission. In Vue, call $emit with a named event and payload; in Angular, use @Output with EventEmitter and emit the query. A red flag is suggesting two-way binding or direct parent mutation.
Primary mechanism for passing data from parent to child component
Tests unidirectional parent-to-child data flow and explicit component contracts. A strong answer names props or inputs, explains one-way binding, and warns against direct child mutation. Red flag: confusing props with global state or events.
Design the public API for a reusable Button component
WHAT IT TESTS: Minimal stateless API design favoring composition. ANSWER: variant, size, disabled, type props; forward click; slots for content/icons; no router/form coupling. RED FLAG: route props, onSubmit handlers, class/style escape hatches.
How do you configure Vite Library Mode for ESM and UMD outputs?
Tests Vite Library Mode multi-format packaging. Strong answer: build.lib entry, formats es and umd, fileName function, and rollupOptions.output.globals for Vue. Red flag: multiple configs or omitting UMD global name.
How would you implement lazy loading for an Angular feature module?
This tests route-level code splitting and CLI workflows. A great answer hits: ng generate module, loadChildren in the route config, and excluding the feature from AppModule. A red flag is suggesting manual chunking instead of router-driven lazy loading.
What is a SvelteKit adapter and how do adapter-static and adapter-node differ?
Tests your grasp of SvelteKit's deployment abstraction. A strong answer outlines how adapters compile the app for a target platform, contrasting adapter-static's CDN-ready HTML with adapter-node's server-side request handler for Node environments.
Describe two key Angular CLI production build optimizations
Tests whether you know architect targets and concrete production optimizations. Strong answers name two of: dead code elimination and minification, hashed filenames for cache busting, or disabled source maps.
Explain Vite dependency pre-bundling, startup speed, and CommonJS handling
This tests whether you understand Vite's ESM-first dev server constraints. Pre-bundling converts CJS/UMD to ESM and collapses multi-file ESM deps into single modules to stop 600+ request waterfalls.
How do you configure Angular CLI dev server proxying?
Tests Angular CLI proxying to bypass CORS locally. Good answer: create proxy.conf.json with target and path, register it in angular.json serve options as proxyConfig, then restart ng serve.
How does src/routes determine routing in SvelteKit?
WHAT IT TESTS: Filesystem routing and plus-prefix naming. ANSWER OUTLINE: src/routes mirrors URLs, folders become paths, [slug] creates dynamic params, and +page.svelte renders pages. RED FLAG: Saying routes live in a central config file, not the filesystem.
Why does create-vue ask about Pinia and Vitest during scaffolding?
Tests knowledge of Vue's lean core and modular tooling. Good answers note that create-vue conditionally installs deps, scaffolds folders like src/stores or tests/, and pre-configures Vite so you skip manual wiring.
ng serve purpose and fundamental difference from ng build
WHAT IT TESTS: Understanding in-memory dev serving versus disk builds. ANSWER OUTLINE: ng serve compiles in memory and serves via a dev server with live reload, while ng build writes output to dist/. RED FLAG: Believing ng serve writes files to disk.
Svelte compiler downsides vs Vue and Angular runtime
Tests compile-time versus runtime trade-offs in large apps. Strong answers address dynamic component limits, plugin friction, build scalability, and migration cost. Red flag: claiming Svelte has no runtime or that dynamic components are impossible.