MERN Stack Online Assessment Questions &amp; Answers

Show answer

Data router setup with nested routes: import { createBrowserRouter, RouterProvider, Outlet, useParams } from 'react-router'; const Layout = () => (<><Navbar /><Outlet /></>); const ProductPage = () => { const { id } = useParams(); return <ProductDetails id={id} />; }; const router = createBrowserRouter([ { path: '/', element: <Layout />, children: [ { index: true, element: <Home /> }, { path: 'products', element: <ProductList /> }, { path: 'products/:id', element: <ProductPage /> } ] } ]); export default function App() { return <RouterProvider router={router} />; }

What is the difference between var, let and const in JavaScript?

Show answer

var is function-scoped, hoisted with the value undefined and can be redeclared. let and const are block-scoped and sit in the temporal dead zone until their declaration line runs. const blocks reassignment of the binding, but an object or array declared with const can still be mutated. In modern MERN code use const by default, let when the value must change, and avoid var.

What is the difference between CommonJS and ES modules in Node.js?

Show answer

CommonJS uses require and module.exports, loads synchronously and is the historic Node default. ES modules use import and export, are statically analysable, support top-level await and enable tree shaking. Node treats .mjs files, or .js files when package.json has type: module, as ESM. Modern Node versions can even require synchronous ES modules, but mixing systems still needs care, so new MERN projects usually pick ESM throughout.

Create a basic HTTP server in Node.js without Express that returns JSON.

Show answer

The built-in node:http module is enough for simple servers. import http from 'node:http'; const server = http.createServer((req, res) => { if (req.method === 'GET' && req.url === '/health') { res.writeHead(200, { 'Content-Type': 'application/json' }); return res.end(JSON.stringify({ status: 'ok' })); } res.writeHead(404); res.end(); }); server.listen(3000, () => console.log('Listening on 3000')); Express adds routing, middleware and body parsing on top of this.

Why does React need keys in lists, and why is using the array index risky?

React FundamentalsEasy

Show answer

Keys tell React which list item is which between renders, so it can reuse, move or remove the correct DOM nodes and component state. Use stable unique ids, such as a MongoDB _id. Index keys break when items are inserted, removed or reordered: state such as input text or checkbox values can attach to the wrong item, and rendering becomes less efficient. Indexes are acceptable only for static lists.

Explain indexes in MongoDB, compound indexes and the ESR rule.

MongoDB and MongooseHard

Show answer

An index is a sorted structure that lets queries avoid scanning every document. A compound index covers multiple fields in order, like { userId: 1, createdAt: -1 }, and supports queries on its leading prefix. The ESR guideline says order fields as Equality first, then Sort, then Range. Indexes speed reads but slow writes and use memory, so create them for real query patterns and drop unused ones.

How does routing work in a React single-page app using React Router?

Show answer

React Router maps URL paths to components without full page reloads. You define routes, often with createBrowserRouter or Routes and Route elements, including nested routes that render inside a parent layout through Outlet. Link and NavLink change the URL, useNavigate navigates in code, and useParams reads dynamic segments like /products/:id. Recent versions also provide loaders and actions for data fetching and form submission.

Write a docker-compose file to run a MERN app locally.

Testing, Deployment and DevOpsMedium

Show answer

Three services on one network: services: mongo: image: mongo:8 volumes: - mongo-data:/data/db api: build: ./server environment: MONGO_URI: mongodb://mongo:27017/shop JWT_SECRET: dev-secret ports: - "5000:5000" depends_on: - mongo web: build: ./client ports: - "8080:80" depends_on: - api volumes: mongo-data: The API reaches the database through the service name mongo.

Write a Mongoose schema for a user with validation and timestamps.

MongoDB and MongooseEasy

Show answer

A typical schema: import mongoose from 'mongoose'; const userSchema = new mongoose.Schema({ name: { type: String, required: true, trim: true, maxlength: 60 }, email: { type: String, required: true, unique: true, lowercase: true }, password: { type: String, required: true, minlength: 8, select: false }, role: { type: String, enum: ['user', 'admin'], default: 'user' } }, { timestamps: true }); export const User = mongoose.model('User', userSchema); select: false hides the password from queries by default.

Explain CSR, SSR, hydration and React Server Components.

React Hooks, State and PerformanceHard

Show answer

With client-side rendering, the browser downloads JavaScript and builds the page, which is slower for first paint and SEO. Server-side rendering sends ready HTML, then hydration attaches React event handlers in the browser. React Server Components run only on the server, can query data directly, and send no JavaScript for themselves, while client components marked use client handle interactivity. Frameworks like Next.js implement these patterns.

What is the difference between app.use, app.get and express.Router?

Express.js and REST APIsEasy

Show answer

app.use mounts middleware for all HTTP methods on a path prefix, so app.use('/api', fn) runs for /api/anything. app.get registers a handler only for GET requests matching that exact path pattern. express.Router creates a mini application with its own routes and middleware, which you mount with app.use('/api/users', userRouter). Routers keep large projects modular, with one file per resource.

What is the difference between package.json and package-lock.json, and what do ^ and ~ mean?

Show answer

package.json lists dependencies with version ranges, scripts and metadata. package-lock.json records the exact installed versions of every package, including nested ones, so every machine and CI build gets the same tree. Commit both and use npm ci in pipelines. A caret like ^4.18.2 allows minor and patch updates below 5.0.0; a tilde like ~4.18.2 allows only patch updates below 4.19.0.

Why are functional components preferred over class components today?

React FundamentalsEasy

Show answer

Functional components with hooks need less code, avoid confusion around this binding, and let you reuse stateful logic through custom hooks instead of higher-order components or render props. All new React features, such as Server Components and hooks like useActionState, target functions. Class components still work and appear in older codebases, and error boundaries still require a class or a library wrapper.

What is a Buffer in Node.js?

Show answer

A Buffer is a fixed-size chunk of raw binary memory allocated outside the V8 heap, used for files, network packets, images and encodings. You create one with Buffer.from('hello') or Buffer.alloc(10) and convert with toString('utf8'), toString('base64') or toString('hex'). Streams deliver data as Buffers by default. Buffer.allocUnsafe is faster but may contain old memory, so it must be filled before use.

How should passwords be stored, and why use bcrypt?

Authentication and SecurityEasy

Show answer

Never store plain or reversibly encrypted passwords. Store a slow, salted hash. bcrypt generates a random salt per password, so identical passwords produce different hashes and rainbow tables fail, and its cost factor, typically 10 to 12, makes brute force expensive. At login use bcrypt.compare. Argon2id is a modern alternative. Fast hashes like MD5 or SHA-256 alone are unsuitable for passwords.

What are BSON and ObjectId in MongoDB?

MongoDB and MongooseEasy

Show answer

BSON is the binary format MongoDB uses to store documents. It extends JSON with types like Date, ObjectId, Decimal128, binary data and 32 or 64-bit integers, and is fast to traverse. ObjectId is the default 12-byte _id value made of a 4-byte timestamp, a 5-byte random value and a 3-byte counter. Because it starts with a timestamp, ObjectIds roughly sort by creation time.

The React app works locally but shows CORS errors after deployment. What would you check?

Express.js and REST APIsEasy

Show answer

Check that the production frontend origin, including https and exact subdomain, is in the API's allowed origins list, and that no trailing slash mismatch exists. If cookies are sent, the server needs credentials: true with a specific origin, not *, and the client needs credentials: 'include' or withCredentials. Also confirm the preflight OPTIONS request is not blocked by a proxy or auth middleware returning 401.

Build a simple todo list in React with add and delete.

Show answer

Update arrays immutably. function Todos() { const [todos, setTodos] = useState([]); const [text, setText] = useState(''); const add = (e) => { e.preventDefault(); if (!text.trim()) return; setTodos((t) => [...t, { id: crypto.randomUUID(), text }]); setText(''); }; const remove = (id) => setTodos((t) => t.filter((x) => x.id !== id)); return ( <form onSubmit={add}> <input value={text} onChange={(e) => setText(e.target.value)} /> <ul>{todos.map((t) => ( <li key={t.id}>{t.text} <button type='button' onClick={() => remove(t.id)}>x</button></li> ))}</ul> </form> ); }

What are the important changes in Express 5 compared to Express 4?

Express.js and REST APIsMedium

Show answer

Express 5 requires a modern Node version and forwards rejected Promises from async handlers to error middleware. Route path syntax moved to a newer path-to-regexp, so wildcards must be named, like /*splat, and regex-style characters in strings are no longer supported. Deprecated methods like res.send(status, body) were removed, req.query is read-only, and req.body is undefined unless a body parser runs.

How should errors be handled in a Node.js application?

Node.js CoreHard

Show answer

Separate operational errors, like a failed DB connection or invalid input, which you handle and respond to, from programmer errors, like undefined property access, which signal bugs. Use try/catch with async/await, always handle Promise rejections and stream error events. Listen to uncaughtException and unhandledRejection only to log and exit cleanly, then let a process manager restart the app, because state may be corrupted.

The business wants total sales per category for the last 30 days. How would you build it in MongoDB?

MongoDB and MongooseMedium

Show answer

Use an aggregation pipeline: $match orders with status paid and createdAt in the last 30 days, using an index on createdAt; $unwind the items array; $group by items.category summing items.price times items.qty; then $sort by total descending. If the report is viewed often, precompute daily totals into a summary collection with a scheduled job or $merge, so the dashboard reads small documents.

Write a unit test for a function that calculates a cart total.

Testing, Deployment and DevOpsEasy

Show answer

Vitest and Jest share the same syntax. // cart.js export const cartTotal = (items) => items.reduce((sum, i) => sum + i.price * i.qty, 0); // cart.test.js import { describe, it, expect } from 'vitest'; import { cartTotal } from './cart.js'; describe('cartTotal', () => { it('returns 0 for an empty cart', () => { expect(cartTotal([])).toBe(0); }); it('multiplies price by quantity', () => { expect(cartTotal([{ price: 100, qty: 2 }, { price: 50, qty: 1 }])).toBe(250); }); });

What is a closure and where is it useful?

Show answer

A closure is a function that remembers the variables of the scope where it was created, even after that outer function has returned. For example, a makeCounter function can return an inner function that increments a private count variable. Closures power data privacy, function factories, memoization, debounce and throttle helpers, and React hooks, where event handlers capture props and state from the render that created them.

What is a JWT and what are its three parts?

Authentication and SecurityEasy

Show answer

A JSON Web Token is a compact, URL-safe token made of three Base64URL-encoded parts separated by dots: the header with algorithm and type, the payload with claims like sub, role and exp, and the signature created from the header and payload using a secret or private key. The signature proves the token was not altered, but the payload is readable by anyone, so never put passwords or sensitive data in it.

Create an AuthContext with a provider and a custom hook.

React Hooks, State and PerformanceMedium

Show answer

A provider plus a safe hook: const AuthContext = createContext(null); export function AuthProvider({ children }) { const [user, setUser] = useState(null); const login = async (creds) => { const res = await api.post('/auth/login', creds); setUser(res.data.user); }; const logout = () => setUser(null); const value = useMemo(() => ({ user, login, logout }), [user]); return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>; } export function useAuth() { const ctx = useContext(AuthContext); if (!ctx) throw new Error('useAuth must be used inside AuthProvider'); return ctx; }

A for loop using var with setTimeout inside prints 3, 3, 3 instead of 0, 1, 2. Why, and how do you fix it?

Show answer

var is function-scoped, so all three callbacks close over the same variable, which has become 3 by the time the timers fire. The simplest fix is to declare the loop variable with let, because let creates a fresh binding for every iteration. Older fixes include wrapping the body in an immediately invoked function or passing i as the third argument to setTimeout.

Group an array of order objects by their status using reduce.

Modern JavaScript (ES6+)Medium

Show answer

reduce builds an object whose keys are statuses and values are arrays. const grouped = orders.reduce((acc, order) => { (acc[order.status] ||= []).push(order); return acc; }, {}); // { paid: [...], pending: [...] } Newer runtimes also offer Object.groupBy(orders, (o) => o.status), which returns the same shape with a null prototype.

Write basic CRUD commands in mongosh for a users collection.

MongoDB and MongooseEasy

Show answer

Core shell commands: db.users.insertOne({ name: 'Riya', email: 'riya@mail.com', age: 24 }) db.users.find({ age: { $gte: 21 } }, { name: 1, email: 1, _id: 0 }) db.users.updateOne({ email: 'riya@mail.com' }, { $set: { age: 25 } }) db.users.deleteMany({ isActive: false }) db.users.countDocuments({ city: 'Pune' }) The second argument of find is a projection that controls which fields are returned.

What practical steps do you take to sanitise and validate input in an Express and MongoDB API?

Authentication and SecurityMedium

Show answer

Validate every request body, params and query against a schema with zod or Joi, rejecting unknown fields and wrong types. Apply body size limits with express.json({ limit: '100kb' }). Strip MongoDB operator keys from input with a small sanitising middleware or library, and keep Mongoose strict mode on. Escape or sanitise HTML with DOMPurify before storing rich text, and validate ObjectIds before querying.

What is the difference between controlled and uncontrolled components?

Show answer

In a controlled component, form input values live in React state and change through onChange, so React is the single source of truth, which makes validation and conditional UI easy. In an uncontrolled component, the DOM holds the value and you read it with a ref or FormData when needed. Uncontrolled inputs mean fewer re-renders and suit simple forms and file inputs; libraries like React Hook Form use this approach.

Write an Express middleware that verifies a JWT from the Authorization header.

Authentication and SecurityMedium

Show answer

Reject missing or invalid tokens with 401. import jwt from 'jsonwebtoken'; export function requireAuth(req, res, next) { const header = req.headers.authorization || ''; const token = header.startsWith('Bearer ') ? header.slice(7) : null; if (!token) return res.status(401).json({ message: 'Token missing' }); try { req.user = jwt.verify(token, process.env.JWT_SECRET); next(); } catch { res.status(401).json({ message: 'Invalid or expired token' }); } } router.get('/me', requireAuth, getProfile);

What are the core principles of a RESTful API, and which HTTP methods are idempotent?

Express.js and REST APIsMedium

Show answer

REST models data as resources identified by URLs, uses standard HTTP methods, is stateless, and returns representations like JSON with proper status codes. Use nouns, for example GET /orders and POST /orders. GET, PUT, DELETE, HEAD and OPTIONS are idempotent: repeating them gives the same server state. POST is not idempotent, and PATCH usually is not, which matters when clients retry requests.

How does async/await improve on Promise chains, and how do you handle errors with it?

Modern JavaScript (ES6+)Medium

Show answer

async/await is syntax over Promises that lets asynchronous code read top to bottom like synchronous code. An async function always returns a Promise, and await pauses that function until the Promise settles. Errors are handled with try/catch/finally instead of chained catch calls. A common mistake is awaiting independent calls one after another; use Promise.all to run them in parallel when they do not depend on each other.

When should you use useReducer instead of useState?

React Hooks, State and PerformanceMedium

Show answer

Use useReducer when state has multiple related fields, when the next state depends on complex logic, or when many event handlers update state in different ways. A reducer is a pure function (state, action) => newState that centralises transitions and is easy to unit test, for example a cart with add, remove, change quantity and clear actions. For simple independent values, useState is clearer.

Explain destructuring, the spread operator and rest parameters.