Đề Thi FE FER202 - SP26 - B5 - FE - RE

admin · 5/5/26

FER202 SP26 B5 FE RE

Multiple Choice Question 1(Choose 1 answer)import React from 'react'const Greeting $(\{name\})=1$return <h1>Hello, (name)</h1>export default Greeting,What type of component is represented by the code above?A. Class component B. Functional component C. Container component D. Higher-order component

Multiple Choice Question 2(Choose 1 answer)What is JSX?A. A JavaScript library for building user interfaces B. A syntax extension for JavaScript that allows you to write HTML-like code C. A React component that renders HTML elements D. A JavaScript framework for building web applications

Multiple Choice Question 3(Choose 1 answer)What is a core feature of Next is that enhances SEO?A. Real-time data fetching B. Client-side routing C. Automatic code splitting. D. Server-side rendering

Multiple Choice Question 4(Choose 1 answer)Who created React?A. Google B. Microsoft C. Facebook D. Amazon

Multiple Choice Question 5(Choose 1 answer)Which ES6 feature allows you to extract values from arrays or objects and assign them to variables in a concise way?A. Spread operator B. Template literals C. Destructuring assignment D. Default parameters

Multiple Choice Question 6(Choose 1 answer)What is the purpose of the initial state parameter in a Redux reducer function?A. To define the structure of the Redux store B. To specify the actions that can be dispatched. C. To handle asynchronous operations D. To define the initial state of the reducer

Multiple Choice Question 7(Choose 1 answer)What command is used to create a new Next is project?A. npx create-react-app B. npm install next C. npx create-next-app D. git clone next.js

Multiple Choice Question 8(Choose 1 answer)What is the primary purpose of Redux Thunk in a React-Redux application?A. To connect React components directly to the Redux store without the need for action creators or reducers. B. To provide a way to store and manage the application's state on the server-side, separate from the client-side state C. To enable creating action creators that return functions (for asynchronous operations like API calls) instead of plain action objects D. To automatically generate the code for action creators and reducers based on the application's data structure.

Multiple Choice Question 9(Choose 1 answer)What is the purpose of window fetch in JavaScript?A. To manipulate the browser window's size and position. B. To store data in the browser's local storage C. To make HTTP requests to retrieve data from a server D. To define the styling and layout of a webpage

Multiple Choice Question 10(Choose 1 answer)What is the main feature of Tailwind CSS compared to other CSS frameworks?A. It provides pre-designed Ul components and themes B. It uses a utility-first approach, allowing developers to build custom designs using small utility classes C. It provides pre-built JavaScript components D. It is a framework specifically for mobile development

Multiple Choice Question 11(Choose 1 answer)What is the primary function of the Dispatcher in the Flux architecture?A. To render the user interface based on the application's state B. To manage the application's state and logic C. To distribute actions to the relevant stores. D. To handle user interactions and events

Multiple Choice Question 12(Choose 1 answer)What is a RESTful API typically used for?A. To provide a standard way for systems to communicate over the network B. To store large amounts of data in a database C. To create real-time interactive applications D. To compile and execute server-side code

Multiple Choice Question 13(Choose 1 answer)What is the primary purpose of Nextjs?A. To enable server-side rendering and generate static websites B. To manage state in React applications C. To provide a Ul component library. D. To create database schemas.

Multiple Choice Question 14(Choose 1 answer)in JSX, which of the following is the correct way to embed a JavaScript expression within an HTML element?A. <span><h1> greeting }) </h1></span> B. <span><h1> <greeting> </h1></span> C. <span><h1> [greeting) </h1></span> D. <span><h1> \$ greeting) </h1></span>

Multiple Choice Question 15(Choose 1 answer)Which of the following is the correct way to use use Selector to access a value from the Redux store?A. const value useSelector((store) > store value), B. const value useSelector((state) => state value); C. const value useSelector((context) => context.value); D. const value useSelector((redux) => redux value),

Multiple Choice Question 16(Choose 1 answer)How can you access Chrome Dev Tools?A. By pressing F12 or right-clicking and selecting "Inspect B. By installing a Chrome extension C. By typing "chrome://devtools" in the address bar D. By opening the Chrome menu and selecting "Dev Tools"

Multiple Choice Question 17(Choose 1 answer)Which Bootstrap class provides a fluid container that adapts to all breakpoints?A. container-fluid B. container C. container-Ig D. container-xs

Multiple Choice Question 18(Choose 1 answer)What is the main purpose of the await keyword within an async function?A. To return a new Promise object. B. To immediately execute the next line of code without warting. C. To pause the execution of the asyrnic function until the Promise it's waiting for is resolved or rejected. D. To define a synchronous block of code

Multiple Choice Question 19(Choose 1 answer)What is the main advantage of using asynciawait over Promises?A. It allows for a more readable and simpler syntax for handling asynchronous code. B. It uses callbacks instead of promises. C. It only works for synchronous operations. D. It increases the loading time of web pages.

Multiple Choice Question 20(Choose 1 answer)Which of the following can be passed as a prop to a React component?A. Only strings B. Only numbers C. Any JavaScript value, including objects, arrays, and functions D. Only other React components

Multiple Choice Question 21(Choose 1 answer)What is the main purpose of React-Bootstrap?A. To build React components using jQuery B. To use Bootstrap styles with inline CSS only C. To provide Bootstrap-styled components built entirely with React D. To convert Bootstrap HTML into Angular components

Multiple Choice Question 22(Choose 1 answer)Bootstrap is a front-end framework that primarily focuses onA. Server-side logic B. Styling and responsive design C. Database connections D. Data manipulation

Multiple Choice Question 23(Choose 1 answer)How do you define an action in the reducer function?A. case 'increment retum count+1] B. case 'increment retum (count state count + 1) C. case 'increment return count= count $+1$ D. case increment return (state.count $+1\}$

Multiple Choice Question 24(Choose 1 answer)How do you provide a context value to components in the tree?A. <span><MyContext value=(someValue)> <Component/> <MyContext></span> B. <span><MyContext Provider value someValue)> <Component </MyContext Provider></span> C. <span><MyContext.Consumer value (someValue)> <Component/> </MyContext.Consumer></span> D. <span><MyContext Provider> <Component value (someValue) /> </MyContext Provider></span>

Multiple Choice Question 25(Choose 1 answer)Which lifecycle method is called after a component is rendered for the first time?A. componentDidMount B. componentWillUnmount C. componentDidUpdate D. shouldComponenti.Jpdate

Multiple Choice Question 26(Choose 1 answer)Fill in the blank in this event handling code to declare an inline handier that logs 'Clicked on button click:<button onClick=A. console.log('Clicked") >Click B. event console.log('Clicked') C. ( $0=\infty$ console log('Clicked") D. handleClick console.log( Clicked")

Multiple Choice Question 27(Choose 1 answer)What does the HTTP response code 404 indicate?A. OK B. Created C. Not Found D. Internal Server Error

Multiple Choice Question 28(Choose 1 answer)What protocol is commonly used for client-server communication over the web?A. HTTP B. FTP C. SMTP D. SSH

Multiple Choice Question 29(Choose 1 answer)What is the first step in migrating from useState to useReducer with this code?const [count, setCount] useState(0);function increment() { setCount(count + 1) }A. Replace setCount with dispatch in the existing code B. Move all state update logic into a reducer function C. Define the reducer function and use dispatch to replace setCount D. Import useReducer without changing any code

Multiple Choice Question 30(Choose 1 answer)What is the purpose of code splitting in React?A. To reduce the initial load time of an application by splitting JavaScript bundles. B. To combine multiple React components into a single bundle C. To handle all the state management in React applications D. To make the app compatible with server-side rendering

Multiple Choice Question 31(Choose 1 answer)Which of the following is the correct way to handle a click event in React?A. onClick handieClick()" B. onClick(handleClick) C. event handleClick" D. handleClick()

Multiple Choice Question 32(Choose 1 answer)Execute the following Git command sequence. What is the final state of the repository?git init, git add, git commit-m "Initial commit, git branch new-feature, git checkout new-feature, git add new-file is, git commit -m "Add new file", git checkout main, git merge new-featureA. The repository has a new branch called new-feature with new-file js added. B. The main branch has new-file is added C. The new-feature branch is merged into main without new-file is D. The repository remains unchanged.

Multiple Choice Question 33(Choose 1 answer)Create a React component that uses the Suspense component to display a fallback while loading a lazily loaded component. Which code snippet is correct?A. Snippet using <span>lazy</span>, <span>Suspense</span>, and <span>fallback</span> prop B. Snippet using <span>Suspense</span> without <span>lazy</span> C. Snippet using <span>lazy</span> but with <span>div fallback</span> D. Snippet using <span>React lazy</span> and <span>React Suspense</span> without <span>fallback</span>

Multiple Choice Question 34(Choose 1 answer)In JSX, how can you embed a JavaScript expression?A. By adding js before it B. By wrapping it in ( C. By using () only D. By using (0)

Multiple Choice Question 35(Choose 1 answer)Which code snippet demonstrates how to handle a route parameter in React Router?A. <span><Route path="/users/id" component [UserDetail) /></span> B. <span><Link to"/users">Users</Link></span> C. <span>import Browser Router as Router, Route from "react-router-dom</span> D. <span>import (Link, Route) from "react-router-dom</span>

Multiple Choice Question 36(Choose 1 answer)Which of the following will navigate to the root path (7) using the useNavigate hook?A. navigate("); B. navigate('home ); C. navigate() D. navigate('root'),

Multiple Choice Question 37(Choose 1 answer)Which of the following is the correct syntax to make a GET request using the Fetch API?A. fetch(url).then(response => response.json()) B. fetch(url).catch(response => response json()) C. fetch(url).then(response => response text()) D. fetch(url) then(response => response.get())

Multiple Choice Question 38(Choose 1 answer)Which HTTP method is typically used to retrieve data from a server?A. GET B. POST C. PUT D. DELETE

Multiple Choice Question 39(Choose 1 answer)What is the primary purpose of React Router in a React application?A. To enhance the performance of a React application by optimizing component rendering B. To manage state globally across all components in a React application C. To manage data flow between components within a React application D. To manage navigation and routing between components within a React application

Multiple Choice Question 40(Choose 1 answer)What is the purpose of the getSnapshotBeforeUpdate() lifecycle method in React?A. It is called before the component is updated B. It is called after the component is updated. C. It is used to update the component's state D. It is used to handle events

Multiple Choice Question 41(Choose 1 answer)How do you pass multiple props to a child component in React?A. <span><Child props={{ name: "John", age: 30 /></span> B. <span><Child name John" age=(30) /></span> C. <span><Child name="John" age "30" /></span> D. <span><Child name="John" age 30 /></span>

Multiple Choice Question 42(Choose 1 answer)How would you use the 'useState" hook to toggle the value of a boolean variable "is Active"?A. const (isActive, setisActive) useState(false), setlsActive(lis.Active); B. const isActive = useState(false); isActive lisActive; C. const isActive false; setisActive(lis Active) D. const [is Active] = useState(false),

Multiple Choice Question 43(Choose 1 answer)Which React-Bootstrap component is used to display a popup dialog with customizable content?A. Modal B. Checkbak C. Button D. Card

Multiple Choice Question 44(Choose 1 answer)In the context of React, what does the term "stateless component refer to?A. A component that does not use props. B. A component that does not manage its own state C. A component that does not render any JSX D. A component that does not handle events.

Multiple Choice Question 45(Choose 1 answer)How can you define a route with multiple parameters, such as userld and postid?A. Route path="/user/userld/post/postid" component=(UserPost) /> B. <span><Route path user/userid/ postid component=(UserPost) /></span> C. <span><Route path="/user/userid/post/ postid component=[UserPost /></span> D. <span><Route path="/user?userid/post?postid" component (UserPost) /></span>

Multiple Choice Question 46(Choose 1 answer)Which of the following is a valid way to declare a route in React Router v6?A. <span><Route path home" component= Home)</span> B. <span><Route path home" element= <Home />/</span> C. <span><Route path= /home" render () => <Home /&gt /></span> D. Route component Home] path="/home" />

Multiple Choice Question 47(Choose 1 answer)Which of the following is the correct way to navigate to the "home" route using the useNavigate hook?A. const navigate useRoute(); navigate('/home'), B. const navigate C. const navigate use History(); navigate('/home'); useNavigate(); navigate('/home'); D. const navigate = useNavigation(); navigate /home );

Multiple Choice Question 48(Choose 1 answer)One of the main characteristics of React-Bootstrap is "Component-Based What does this imply?A. React-Bootstrap only provides components for CSS styling B. It enables developers to create modular and reusable Ul elements as React components. C. It requires custom JavaScript to be written for each component D. Components can only be used once in the application

Multiple Choice Question 49(Choose 1 answer)Why might this code produce unexpected results?function Counter() { const [count, setCount = useState(0); const handleClick = 0 => 1 setCount(count + ), setCount(count 1); return <button onClick= handleClick]>[count]</button> }A. Because setCount is called twice, it resets state B. Because setCount merges the updates automatically C. Both setCount(count + 1) calls use the same snapshot of count D. It's invalid to call setCount twice

Multiple Choice Question 50(Choose 1 answer)What is the primary purpose of the fallback prop in the Suspense component?A. To handle errors during component rendering. B. To define an alternative component to render after the lazy component has loaded C. To display a lightweight placeholder UI, such as a loading spinner, or an altermate Ul to render in place of the actual Ul if it has not finished loading D. To determine when to tigger a re-render of the lazy-loaded component

Đề Thi FE FER202 - SP26 - B5 - FE - RE

admin

Member

Đính kèm

Đề Thi FE FER202 - SP26 - B5 - FE - RE

adminadmin is verified member.

Member

Đính kèm

admin