🔹MCQs Of Class 19: Project 2
Mini Blog App
(React.js)
✅ Section 1: React Basics (Q1–10)
1.
Which
hook is used to create state in a functional component?
A. useEffect
B. useState
C. useRef
D. useMemo
Answer: B
2.
What
does useState(0) return?
A. Just a state value
B. A function
C. A value and a function to update it
D. An object with state
Answer: C
3.
In
React, props are:
A. Mutable
B. Used for managing state
C. Read-only
D. Stored in local storage
Answer: C
4.
JSX
stands for:
A. Java Syntax Extension
B. JavaScript XML
C. Java Server eXtension
D. JavaScript Execution
Answer: B
5.
Which
of the following is NOT a valid React hook?
A. useState
B. useEffect
C. useReducer
D. useStatic
Answer: D
6.
What
is the purpose of keys in a list in React?
A. To style the elements
B. To identify each element uniquely
C. To store state
D. To make API calls
Answer: B
7.
React
component names must start with:
A. $
B. Lowercase letter
C. Uppercase letter
D. Number
Answer: C
8.
Which
folder is commonly used to store React components?
A. pages/
B. src/
C. components/
D. assets/
Answer: C
9.
How
many root elements can a React component return?
A. Only one
B. Two
C. Any number
D. None
Answer: A
10.
What
should be imported to use JSX in a React file?
A. import JSX from 'react-jsx'
B. import React from 'react'
C. import useState from 'react'
D. Nothing is needed
Answer: B
✅ Section 2: React Router (Q11–20)
11.
Which
component wraps the entire app for routing?
A. Routes
B. RouterProvider
C. BrowserRouter
D. Router
Answer: C
12.
Which
hook helps to access URL parameters?
A. useState()
B. useParams()
C. useRoute()
D. useLocation()
Answer: B
13.
What
does <Route path="/home" element={<Home />} /> mean?
A. Redirects to homepage
B. Renders Home when path is /home
C. Loads script home.js
D. Fetches data from /home
Answer: B
14.
Which
component allows navigation links in React Router?
A. a
B. Link
C. NavLink
D. Button
Answer: B
15.
To
define routes in React Router v6, you use:
A. RouteContainer
B. Routes
C. Switch
D. RouterView
Answer: B
16.
What
is the purpose of useNavigate()?
A. Access URL params
B. Navigate programmatically
C. Fetch blog data
D. Change component state
Answer: B
17.
In
React Router, which tag is used to wrap all route definitions?
A. Switch
B. Routes
C. RouteList
D. RouterMap
Answer: B
18.
What
does element={<Component />} do in Route?
A. Links component
B. Defines page
C. Renders the component
D. Loads CSS
Answer: C
19.
To
navigate to a dynamic route /blog/:id, you use:
A. useId()
B. useParams()
C. useBlog()
D. useNavigate()
Answer: B
20.
What
will <Link to="/blogs/1"> do?
A. Redirect to homepage
B. Redirect to blog with ID 1
C. Link to homepage
D. Do nothing
Answer: B
✅ Section 3: Blog App
Functionalities (Q21–30)
21.
In
a blog app, each blog should have a unique:
A. Title
B. Author
C. ID
D. URL
Answer: C
22.
Which
hook is used to handle blog list state?
A. useRef()
B. useMemo()
C. useEffect()
D. useState()
Answer: D
23.
Where
should blog data be stored in a React app?
A. Props
B. State
C. Local Storage
D. Cookies
Answer: B
24.
What
is the purpose of the "Add Blog" form?
A. Delete blog
B. Fetch blog
C. Insert new blog into state
D. Clear the form
Answer: C
25.
Which
function prevents a form from refreshing the page on submit?
A. formReset()
B. stopPropagation()
C. e.preventDefault()
D. resetForm()
Answer: C
26.
How
do you assign a unique id to each blog post?
A. Math.random()
B. Date.now()
C. parseInt()
D. blog.id++
Answer: B
27.
Where
should you call the function to add a new blog?
A. Inside the return
B. In handleSubmit()
C. On render
D. On page load
Answer: B
28.
What
does <textarea> collect in the blog form?
A. Title
B. Author
C. Body
D. ID
Answer: C
29.
Which
input type is suitable for author's name?
A. textarea
B. input type="text"
C. input type="email"
D. password
Answer: B
30.
What
happens after adding a blog to the list?
A. State updates
B. Page reloads
C. Nothing
D. Form deletes itself
Answer: A
✅ Section 4: Props and Components
(Q31–40)
31.
What
are props in React used for?
A. Managing component styles
B. Passing data to components
C. Defining routes
D. Creating loops
Answer: B
32.
Props
are passed using:
A. useProps()
B. HTML attributes
C. API call
D. Redux
Answer: B
33.
In
a component, how do you access props?
A. this.props.name
B. props = []
C. function MyComponent(props)
D. getProps()
Answer: C
34.
Props
are:
A. Mutable
B. Read-only
C. Optional
D. Temporary
Answer: B
35.
Which
of the following is a valid way to render props?
A. {props.name}
B. {props:name}
C. props[name]
D. props->name
Answer: A
36.
Passing
props to child components helps in:
A. UI styling
B. Component reuse
C. Data encryption
D. API integration
Answer: B
37.
Which
of the following is NOT a prop?
A. title
B. onClick
C. style
D. useState
Answer: D
38.
How
do you pass a function as a prop?
A. <Comp fn='function' />
B. <Comp fn={myFunction} />
C. <Comp function={fn} />
D. <Comp useFunction={fn()} />
Answer: B
39.
Props
in React help in building:
A. Static websites only
B. Dynamic and reusable components
C. Only styled apps
D. One-time-use pages
Answer: B
40.
What
should you do to modify data received via props?
A. Change it directly
B. Clone and update in state
C. Delete the prop
D. Use props.set()
Answer: B
✅ Section 5: Bonus Logic and
Application (Q41–50)
41.
What
is the return type of useState() hook?
A. Number
B. Object
C. Array
D. String
Answer: C
42.
What
does onChange={e => setTitle(e.target.value)} do?
A. Sets a static title
B. Updates title based on input
C. Changes body
D. Logs title
Answer: B
43.
How
many blogs can be displayed using .map() in BlogList?
A. Only 1
B. 10
C. Any number
D. Fixed at 5
Answer: C
44.
What
is the type of event parameter in form submission?
A. Object
B. MouseEvent
C. HTMLFormElement
D. SyntheticEvent
Answer: D
45.
React
Router is used for:
A. Styling pages
B. State management
C. Client-side routing
D. Creating backend APIs
Answer: C
46.
The
path /blogs/:id is called a:
A. Static route
B. Nested route
C. Dynamic route
D. Named route
Answer: C
47.
Which
tag is used to display form inputs in React?
A. <input>
B. <div>
C. <span>
D. <header>
Answer: A
48.
What
does setBlogs([...blogs, newBlog]) do?
A. Deletes all blogs
B. Adds new blog to list
C. Clears blog state
D. Filters blog array
Answer: B
49.
Where
is useParams() used?
A. Home page
B. Blog list
C. Blog detail
D. Navigation
Answer: C
50.
What
should you return when a blog ID is not found?
A. Null
B. 404 page or error message
C. Alert
D. Console log
Answer: B
