Full-Stack Development Developer 5 — Questions and Answers
Question 1: What is the purpose of a Content Delivery Network (CDN) in a full-stack application?
- To host and manage your backend API servers
- To cache and serve static assets from servers geographically close to the user (Correct answer)
- To handle database replication across regions
- To provide real-time monitoring and alerting for server errors
Correct answer: To cache and serve static assets from servers geographically close to the user
A CDN distributes cached static assets (images, JS, CSS) from edge nodes near users, reducing latency and origin server load.
Question 2: In TypeScript, what is the difference between `interface` and `type`?
- `interface` supports primitives; `type` only supports objects
- `type` is for runtime values; `interface` is compile-time only
- `interface` can be extended and merged via declaration merging; `type` can represent unions and intersections more flexibly (Correct answer)
- They are completely interchangeable with no differences
Correct answer: `interface` can be extended and merged via declaration merging; `type` can represent unions and intersections more flexibly
Interfaces support declaration merging and are preferred for object shapes, while type aliases can express unions, intersections, and mapped types more flexibly.
Question 3: What is server-side rendering (SSR) and when would you choose it over client-side rendering (CSR)?
- SSR generates HTML on the client; choose it for rich interactive apps
- SSR generates HTML on the server per request; choose it when SEO and initial load time are priorities (Correct answer)
- SSR is a caching strategy; choose it when database queries are slow
- SSR runs JavaScript in a Web Worker; choose it for CPU-intensive computations
Correct answer: SSR generates HTML on the server per request; choose it when SEO and initial load time are priorities
SSR delivers fully rendered HTML from the server so search engines can index content and users see meaningful content faster.
Question 4: What does the `useCallback` hook do in React?
- Caches an expensive computed value between renders
- Returns a memoized version of a callback function that only changes when its dependencies change (Correct answer)
- Triggers a side effect after every render
- Stores a mutable value that persists without causing re-renders
Correct answer: Returns a memoized version of a callback function that only changes when its dependencies change
`useCallback` memoizes a function reference so that child components receiving it as a prop don't re-render unnecessarily.
Question 5: Which SQL clause would you use to filter aggregated results after a `GROUP BY`?
- WHERE
- HAVING (Correct answer)
- LIMIT
- ORDER BY
Correct answer: HAVING
`HAVING` filters groups after aggregation, while `WHERE` filters individual rows before grouping occurs.
Question 6: What is the purpose of an `.env` file in a full-stack project and how should it be handled in version control?
- It defines CSS environment variables and should be committed for team consistency
- It stores environment-specific configuration and secrets and should be listed in `.gitignore` (Correct answer)
- It contains build scripts and should be committed alongside `package.json`
- It caches API responses locally and is automatically regenerated
Correct answer: It stores environment-specific configuration and secrets and should be listed in `.gitignore`
.env files hold secrets like API keys and database passwords that must never be committed; a `.env.example` with placeholder values is committed instead.
Question 7: What does the term 'hydration' mean in the context of frameworks like React and Next.js?
- Fetching fresh data from the API on every page navigation
- The process of attaching JavaScript event handlers to server-rendered HTML so it becomes interactive (Correct answer)
- Compressing static assets for faster network transfer
- Seeding a database with initial development data
Correct answer: The process of attaching JavaScript event handlers to server-rendered HTML so it becomes interactive
After SSR delivers static HTML, hydration makes the page interactive by attaching React's event listeners and state to the existing DOM.
Full-Stack Development Developer 5
What is the purpose of a Content Delivery Network (CDN) in a full-stack application?