Unit 6: Advanced Features and Industry Practices - Practice Quiz

INT257 — Modern Web Application Development 60 Questions
0 Correct 0 Wrong 60 Left
0/60

1 What is the main purpose of Parallel Routes in Next.js?

Parallel Routes Easy
A. Render multiple views in one layout
B. Run tests in separate processes
C. Translate content into multiple languages
D. Redirect users to another domain

2 Which folder naming convention defines a Parallel Route slot in Next.js?

Parallel Routes Easy
A. [folder]
B. (folder)
C. _folder
D. @folder

3 Where are named Parallel Route slots commonly received for rendering?

Parallel Routes Easy
A. As environment variables
B. As database table fields
C. As browser cookies
D. As layout component props

4 What is a common use of Proxy in a web application?

Proxy Easy
A. Style reusable interface components
B. Inspect requests before routing
C. Define database table relationships
D. Generate unit test reports

5 Which task is well suited to a request Proxy?

Proxy Easy
A. Redirecting unauthenticated users
B. Creating a database index
C. Designing a page icon
D. Writing component documentation

6 What do Intercepting Routes allow an application to do?

Intercepting Routes Easy
A. Translate a route automatically
B. Combine all routes into one file
C. Show a route within the current context
D. Execute every route at build time

7 Which interface pattern commonly uses Intercepting Routes?

Intercepting Routes Easy
A. Photo displayed in a modal
B. Button styled with CSS
C. Password stored in a database
D. Package installed with npm

8 Where does Edge Runtime code typically execute?

Edge Runtime Easy
A. Inside a CSS stylesheet
B. Inside the user's database
C. Only during local development
D. Near the application's users

9 What is a common benefit of using the Edge Runtime?

Edge Runtime Easy
A. Longer variable names
B. Larger image dimensions
C. More CSS selectors
D. Lower request latency

10 Which statement about the Edge Runtime is generally correct?

Edge Runtime Easy
A. It stores all application data locally
B. It supports a limited set of APIs
C. It requires every page to be static
D. It replaces all client-side JavaScript

11 What does internationalization prepare an application to support?

Internationalization Easy
A. Multiple source repositories
B. Multiple database engines
C. Multiple testing frameworks
D. Multiple languages and regions

12 What is a locale in an internationalized application?

Internationalization Easy
A. A server performance measurement
B. A language and regional preference
C. A reusable visual component
D. A database connection setting

13 Which content commonly changes according to a user's locale?

Internationalization Easy
A. HTTP protocol versions
B. Date and currency formatting
C. Component file extensions
D. Source control commit hashes

14 What is the main goal of a clear project architecture?

Project Architecture Easy
A. Make every file use the same name
B. Place all logic in one component
C. Remove the need for documentation
D. Make the codebase easier to maintain

15 Where should shared utility functions generally be placed?

Project Architecture Easy
A. In a dedicated utilities module
B. In the public assets folder
C. Inside every page component
D. Inside the package lock file

16 What is a reusable component?

Component Organization Easy
A. A component used in multiple places
B. A component executed only once
C. A component stored in a database
D. A component without any markup

17 Which practice improves component organization?

Component Organization Easy
A. Giving every component one filename
B. Duplicating components for each page
C. Grouping related components together
D. Putting all components in one file

18 How should application secrets such as API keys usually be stored?

Security Best Practices Easy
A. In client-side component props
B. In protected environment variables
C. In browser-visible comments
D. In public static files

19 Why should an application validate user input?

Security Best Practices Easy
A. To reduce the number of routes
B. To reject invalid or harmful data
C. To rename components automatically
D. To increase the screen resolution

20 What does a unit test usually verify?

Testing Overview Easy
A. The visual design of every page
B. The behavior of external organizations
C. The complete production infrastructure
D. One small piece of functionality

21 In a dashboard application, which feature allows the layout to render a sidebar and a main content area independently using named slots?

Parallel Routes Medium
A. Parallel Routes
B. Intercepting Routes
C. Static generation
D. Middleware

22 A user navigates between pages inside a dashboard, but the analytics panel should preserve its state while the main content changes. Which approach is most appropriate?

Parallel Routes Medium
A. Convert the entire dashboard to static HTML
B. Place both views in one client component
C. Use an API route for the analytics panel
D. Use a parallel route for the analytics panel

23 What is the most suitable use of a Next.js proxy for a protected application area?

Proxy Medium
A. Generating CSS files during compilation
B. Checking authentication before forwarding a request
C. Managing state inside a browser component
D. Rendering database records into a table

24 A proxy should run only for requests beginning with /admin. Which configuration principle should be applied?

Proxy Medium
A. Configure a route matcher
B. Add a dynamic import
C. Use a loading boundary
D. Create a client-side context

25 A product list should open a product detail page in a modal when navigated from the list, but show a full page after a direct URL visit. Which feature supports this behavior?

Intercepting Routes Medium
A. Parallel data fetching
B. Environment variables
C. Intercepting Routes
D. Static route generation

26 Why should a modal opened through an intercepted route usually include a normal page implementation as well?

Intercepting Routes Medium
A. To support direct navigation and refreshes
B. To disable browser history updates
C. To make every request run at the edge
D. To avoid using server components

27 Which implementation is most compatible with an edge runtime?

Edge Runtime Medium
A. A request handler using standard Web APIs
B. A library dependent on native Node.js binaries
C. A process that launches a child process
D. A handler requiring the Node.js fs module

28 An edge function must access a database driver that depends on Node.js TCP sockets. What is the main concern?

Edge Runtime Medium
A. The driver may not be supported
B. The route must become a static asset
C. The function cannot return JSON
D. The browser will block all requests

29 An application supports English and French URLs such as /en/products and /fr/products. What should determine the displayed language?

Internationalization Medium
A. The server's operating system
B. The locale associated with the route
C. The user's screen resolution
D. The number of URL segments

30 A price must display correctly for users in Germany and the United States. Which strategy is most reliable?

Internationalization Medium
A. Use the browser's default font settings
B. Store formatted prices as permanent strings
C. Use locale-aware number and currency formatting
D. Replace every decimal point manually

31 Which architectural choice best supports independent development of a large web application?

Project Architecture Medium
A. Place every component in one directory
B. Duplicate authentication logic in every page
C. Organize code by clear domain boundaries
D. Mix database logic into visual components

32 A team wants to prevent UI code from directly constructing database queries. Which architectural practice is most appropriate?

Project Architecture Medium
A. Duplicate queries inside each page
B. Use a service or repository layer
C. Expose database credentials to the browser
D. Move all queries into CSS files

33 A button is reused across unrelated features and has no feature-specific behavior. Where should it generally be organized?

Component Organization Medium
A. Inside the database migration folder
B. In the proxy configuration file
C. In a shared UI component directory
D. Inside the route for one feature

34 A page needs browser event handlers, but most of its content is static. How should the components be organized?

Component Organization Medium
A. Keep the page server-rendered and isolate the interactive part
B. Make every component a client component
C. Move all content into a proxy
D. Render the page only after a database mutation

35 Which practice best protects a web application from SQL injection?

Security Best Practices Medium
A. Hide the database hostname
B. Use parameterized queries
C. Rename the database tables
D. Minify the SQL statements

36 A server action receives an isAdmin value from a form. Why should the server avoid trusting that value?

Security Best Practices Medium
A. Forms cannot submit Boolean values
B. Server actions cannot access request data
C. Clients can modify submitted form values
D. Browsers automatically encrypt all form fields

37 Which cookie configuration is most appropriate for a session identifier that should not be accessible to JavaScript?

Security Best Practices Medium
A. Set the Public attribute
B. Place it in a client-side environment variable
C. Set the HttpOnly attribute
D. Store it in a visible page heading

38 Which test type is most appropriate for verifying that a form displays an error when a required field is empty?

Testing Overview Medium
A. A component or integration test
B. A load test of the production server
C. A compiler performance test
D. A database backup test

39 A test passes locally but fails intermittently in continuous integration because it depends on timing. What is the best improvement?

Testing Overview Medium
A. Disable the test in continuous integration
B. Wait for observable conditions instead of fixed delays
C. Increase every timeout to ten minutes
D. Add random delays to the application

40 Which test provides the strongest check that a user can log in, reach a protected page, and log out through the browser?

Testing Overview Medium
A. A unit test for a formatter
B. A static type-checking run
C. A snapshot test for a button
D. An end-to-end test

41 A dashboard uses parallel routes for @analytics and @activity. The user navigates from /dashboard/reports to /dashboard/settings, but the activity panel should preserve its existing state while the analytics panel refreshes. Which design best achieves this behavior?

Parallel Routes Hard
A. Store panel state in cookies and reconstruct it after navigation
B. Use separate slots with independent loading and error boundaries
C. Render both panels conditionally inside the page component
D. Place both panels in one shared layout and reload them together

42 A modal is implemented with a parallel route slot. On a hard refresh at /inbox, the modal slot receives no active child, although client-side navigation correctly opens the modal. Which file most directly defines the refresh fallback for that slot?

Parallel Routes Hard
A. default.tsx inside the modal slot
B. layout.tsx inside the modal slot
C. not-found.tsx inside the modal slot
D. loading.tsx inside the modal slot

43 Two parallel route slots display independent resources. One resource returns a 403 response while the other succeeds. What is the most appropriate boundary arrangement?

Parallel Routes Hard
A. A middleware redirect for every failed slot request
B. A single try/catch around the parent layout fetch
C. One global error boundary around the entire dashboard
D. An error boundary colocated within each parallel slot

44 A proxy should protect /admin routes but must not run for /_next/static, image optimization requests, or files containing a dot in their final path segment. Which matcher strategy is most precise?

Proxy Hard
A. Match only /admin/:path* and ignore static asset handling
B. Use a negative-lookahead matcher excluding framework assets and dotted paths
C. Match every request beginning with / and check exclusions in the handler
D. Run the proxy only from the root layout after rendering begins

45 A proxy validates an access token and then redirects unauthenticated users to /login?returnTo=<original path>. Which issue must be addressed before deploying this implementation?

Proxy Hard
A. The token must always be stored in a client-side local-storage key
B. The redirect must use a permanent status code for browser caching
C. The login page must be rendered exclusively on the Edge Runtime
D. The return path must be validated to prevent open redirects

46 A product detail route should open as a modal when reached from a product list, but render as a full page after a direct URL entry or browser refresh. Which combination is required?

Intercepting Routes Hard
A. A rewrite from the list route to the product route
B. An intercepting route for soft navigation and a canonical page route
C. A client-side state flag and a global modal component
D. A parallel route without a separate product page

47 A modal opened through an intercepting route remains visible after the user presses the browser Back button. Which implementation detail is most likely missing?

Intercepting Routes Hard
A. The modal route must use a server action
B. The intercepted page must be statically generated
C. The route must disable all client-side transitions
D. The modal must close by navigating back through browser history

48 An API handler works in Node.js but fails after being configured for the Edge Runtime because it imports a package that depends on fs and Node's TCP APIs. What is the correct diagnosis?

Edge Runtime Hard
A. The handler needs a longer request timeout
B. The package violates Edge Runtime API constraints
C. Edge handlers require a larger memory allocation
D. The route must be converted into a client component

49 A globally distributed request handler performs a 700 ms database query against a single regional database. Moving the handler to the Edge Runtime does not improve median latency. Why?

Edge Runtime Hard
A. Edge runtimes always serialize database requests
B. Edge requests cannot access databases
C. The browser bypasses the nearest edge location
D. The database remains the dominant regional bottleneck

50 An application supports locale-prefixed URLs and must preserve a user's requested path when redirecting / to a detected locale. Which behavior avoids a common routing defect?

Internationalization Hard
A. Infer locale only from the browser's time zone
B. Redirect to the detected locale while preserving the normalized path
C. Always redirect / to the default locale
D. Rewrite every locale request to a single unprefixed route

51 A localized page is statically generated for en, fr, and de. A request arrives for fr-CA, which is configured as a fallback of fr. What is the most robust rendering strategy?

Internationalization Hard
A. Redirect all regional locales permanently to the base locale
B. Render the page in English because only exact locales are valid
C. Use fr resources while preserving fr-CA formatting rules where supported
D. Treat fr-CA as unrelated and return a 404

52 A team wants feature ownership to remain clear as a Next.js application grows. Which structure best supports localized changes and prevents unrelated domain code from accumulating in a global utilities folder?

Project Architecture Hard
A. Put reusable and feature-specific components in the same global directory
B. Organize code by business feature with local components, data access, and tests
C. Organize every file by extension under components, hooks, and utils
D. Place all server actions in one root file for centralized discovery

53 A route group is introduced to give authenticated pages a shared layout without changing their public URLs. Which statement correctly describes the purpose of route groups?

Project Architecture Hard
A. They replace middleware-based authentication automatically
B. They group routes structurally without adding path segments
C. They expose a new URL segment for each directory
D. They force all grouped routes to use static rendering

54 A server component fetches private data and passes a callback that closes over a secret-bearing object to a client component. Why is this design invalid or unsafe?

Component Organization Hard
A. Functions and secret-bearing values cannot cross the server-client boundary safely
B. Server components may only return plain HTML strings
C. Private data becomes cached automatically by every browser
D. Client components cannot receive any props from servers

55 A large interactive table causes an otherwise static page to become client-rendered. Which refactoring best preserves server rendering while retaining table interactivity?

Component Organization Hard
A. Add use client to the root layout
B. Move the entire page data fetch into the browser
C. Duplicate the page as separate server and client implementations
D. Keep the page server-rendered and isolate table behavior in a client island

56 A server action updates a user's email address. The form is rendered only for administrators, but a malicious client invokes the action directly. What control is essential inside the action?

Security Best Practices Hard
A. Require JavaScript to be enabled in the browser
B. Recheck authentication and authorization on the server
C. Obfuscate the action identifier in the client bundle
D. Hide the form from non-administrators

57 An application accepts a next query parameter after login and performs redirect(next). Which validation is strongest for preventing an attacker-controlled external redirect?

Security Best Practices Hard
A. Reject values containing the substring javascript
B. Allow any absolute URL using HTTPS
C. URL-encode the value before passing it to redirect
D. Allow only normalized same-origin paths beginning with /

58 A page displays user-submitted Markdown. The renderer permits raw HTML because some trusted authors need formatting. Which mitigation is required?

Security Best Practices Hard
A. Escape only the Markdown heading syntax
B. Sanitize generated HTML with a strict allowlist before insertion
C. Render the content through a client component
D. Add a CSP header without sanitizing the generated markup

59 A component test passes because it mocks the router, but production fails when a parallel route slot is missing during a hard refresh. Which test addition most directly covers the defect?

Testing Overview Hard
A. Mock more router methods in the existing unit test
B. Measure the component's rendering time under CPU throttling
C. Increase snapshot test coverage for button labels
D. Add an end-to-end test for direct entry and refresh of the route

60 A test verifies that an unauthorized user cannot access /admin. The implementation returns either a redirect or a 403 depending on whether the request is browser navigation or an API call. What assertion strategy is most resilient?

Testing Overview Hard
A. Mock authorization so both paths return the same status
B. Assert that every request returns exactly status 302
C. Test each contract separately: redirect behavior for navigation and 403 for the API
D. Assert only that the response body contains the word unauthorized