Skip to content
Web Development
All coursesPlacement Report
‹ Back to previous sectionCourse homeAll page URLs

Web Development Interview Questions in Kolkata

36 practice questions with answers for Web Development interviews in Kolkata.

Web Development jobs in Kolkata

Kolkata has a steady IT-services and BFSI technology job market around Salt Lake Sector V and New Town. Many openings are with service companies and their delivery centres, with a focus on strong fundamentals.

Below are 36 questions that match the mix of service, product and domain employers hiring junior web developers in Kolkata.

Solved for KolkataStart practicing
3 QUESTIONS FREESign up to unlock the full question bank and track your progress.Unlock every question and answer, then continue practising company-wise and package-wise.
3 questions free Unlock the rest in seconds
01

Should you use PDO or mysqli to connect to MySQL?

PHP ProgrammingMedium
Save to ▾
Show answer
Both support prepared statements and are secure when used correctly. PDO supports around a dozen databases with the same API, has named placeholders like :email, and throws exceptions cleanly, so switching from MySQL to PostgreSQL is easier. mysqli works only with MySQL but exposes some MySQL-specific features. Most modern codebases and frameworks like Laravel use PDO under the hood, so it is the usual recommendation.
02

What is CSRF and how do you prevent it?

Web SecurityMedium
Save to ▾
Show answer
Cross-site request forgery tricks a logged-in user's browser into sending an unwanted request, such as changing their email, because cookies are attached automatically. Prevention includes a unique CSRF token in every state-changing form that the server verifies, SameSite=Lax or Strict cookies, and checking the Origin header. GET requests should never change data. Frameworks like Laravel add CSRF tokens to forms by default.
03

What is margin collapsing?

CSS Layout and Responsive DesignMedium
Save to ▾
Show answer
When vertical margins of adjacent block elements touch, they merge into a single margin equal to the larger one instead of adding up. It also happens between a parent and its first or last child when no padding, border or block formatting context separates them. Margins do not collapse in flex or grid containers. Developers often avoid surprises by using padding, gap or margin in one direction only.
04

How do srcset and sizes help with responsive images?

HTML FundamentalsMedium
Save to ▾
Show answer
srcset lists several versions of the same image with their widths, for example hero-480.jpg 480w and hero-1200.jpg 1200w. sizes tells the browser how wide the image will be shown at different viewport widths. The browser then picks the smallest file that still looks sharp for that screen and pixel density. This saves a lot of mobile data compared to sending one large image to every device.
05

A user can view another user's invoice by changing the id in the URL. What is this and how do you fix it?

Web SecurityHard
Save to ▾
Show answer
This is an Insecure Direct Object Reference, a form of broken access control, the top OWASP risk. The fix is an authorisation check on every request: fetch the invoice with WHERE id = ? AND user_id = ? using the logged-in user's id from the session, and return 404 if not found. Using random UUIDs makes guessing harder but is not a replacement for authorisation checks.
06

Write an Nginx server block for a PHP application using PHP-FPM.

Hosting and DeploymentHard
Save to ▾
Show answer
A typical configuration: server { listen 80; server_name example.com; root /var/www/app/public; index index.php; location / { try_files $uri $uri/ /index.php?$query_string; } location ~ \.php$ { include fastcgi_params; fastcgi_pass unix:/run/php/php8.3-fpm.sock; fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name; } location ~ /\. { deny all; } } Pointing root to public keeps .env and source files out of reach.
07

What does the DOCTYPE declaration do in an HTML page?

HTML FundamentalsEasy
Save to ▾
Show answer
The DOCTYPE tells the browser which rendering mode to use. Writing <!DOCTYPE html> at the very top puts the browser in standards mode, so CSS box model and layout rules follow the modern specification. Without it, browsers fall back to quirks mode, which imitates old browser bugs and can make widths, margins and table layouts behave inconsistently across browsers.
08

Build a simple PHP endpoint that returns JSON.

PHP ProgrammingMedium
Save to ▾
Show answer
Set the header, encode the data and use proper status codes: header('Content-Type: application/json'); $id = filter_input(INPUT_GET, 'id', FILTER_VALIDATE_INT); if (!$id) { http_response_code(400); echo json_encode(['error' => 'Invalid id']); exit; } $stmt = $pdo->prepare('SELECT id, name, price FROM courses WHERE id = ?'); $stmt->execute([$id]); $course = $stmt->fetch(PDO::FETCH_ASSOC); http_response_code($course ? 200 : 404); echo json_encode($course ?: ['error' => 'Not found']);
09

A PHP page takes 8 seconds to load. How do you find the bottleneck?

PHP ProgrammingHard
Save to ▾
Show answer
I would measure before guessing, using a profiler like Xdebug or Blackfire, or simple microtime logs around sections. Usually the cause is database queries, such as an N+1 pattern running a query inside a loop, missing indexes, or slow external API calls. Fixes include joining or eager loading, adding indexes, caching results in Redis, making API calls async with a queue, and enabling OPcache.
10

Find the top 3 highest-paid employees in each department.

MySQL DatabaseHard
Save to ▾
Show answer
Use a window function in MySQL 8: WITH ranked AS ( SELECT name, department_id, salary, DENSE_RANK() OVER (PARTITION BY department_id ORDER BY salary DESC) AS rnk FROM employees ) SELECT name, department_id, salary FROM ranked WHERE rnk <= 3; PARTITION BY restarts ranking per department. DENSE_RANK keeps ties together, while ROW_NUMBER would return exactly three rows even if salaries tie.
11

Create a dark mode toggle that remembers the user's choice.

DOM and Browser EventsMedium
Save to ▾
Show answer
Store the choice in localStorage and apply it on load: const root = document.documentElement; const saved = localStorage.getItem('theme'); if (saved) root.dataset.theme = saved; toggle.addEventListener('click', () => { const next = root.dataset.theme === 'dark' ? 'light' : 'dark'; root.dataset.theme = next; localStorage.setItem('theme', next); toggle.setAttribute('aria-pressed', next === 'dark'); }); Running the first lines in a small inline script in the head avoids a flash of the wrong theme.
12

Explain the difference between async and defer on a script tag.

HTML FundamentalsMedium
Save to ▾
Show answer
Both download the script in parallel without blocking HTML parsing. An async script executes as soon as it finishes downloading, in no fixed order, so it suits independent scripts like analytics. A defer script waits until the HTML is fully parsed and runs in document order, so it suits application code that depends on the DOM or on other scripts. A plain script tag blocks parsing completely.
13

Why is the meta viewport tag needed for mobile pages?

HTML FundamentalsMedium
Save to ▾
Show answer
Without a viewport meta tag, mobile browsers render the page at a virtual width of around 980 pixels and then zoom out, so text looks tiny. Adding <meta name='viewport' content='width=device-width, initial-scale=1'> tells the browser to use the real device width, which makes media queries work as expected. Avoid disabling user zoom with maximum-scale=1 because it hurts accessibility for users with low vision.
14

A modal appears behind the header even with z-index 9999. What is wrong?

CSS Layout and Responsive DesignMedium
Save to ▾
Show answer
The modal is most likely inside a parent that creates its own stacking context, for example through transform, opacity, filter or a positioned element with a lower z-index. Inside that context the 9999 is compared only with siblings. I would inspect ancestors in DevTools, then either render the modal directly under body, which is what portals do, or remove the property creating the context. The native dialog element with showModal also places it in the top layer.
15

Write a function that groups an array of students by city.

JavaScript CoreMedium
Save to ▾
Show answer
Object.groupBy is available in modern browsers and Node 21+, with reduce as a fallback: const students = [ { name: 'Asha', city: 'Delhi' }, { name: 'Ravi', city: 'Pune' }, { name: 'Neha', city: 'Delhi' } ]; const byCity = Object.groupBy(students, s => s.city); const byCity2 = students.reduce((acc, s) => { (acc[s.city] ||= []).push(s); return acc; }, {}); Both return { Delhi: [...], Pune: [...] }.
16

What is MVC and how does Laravel follow it?

PHP ProgrammingMedium
Save to ▾
Show answer
MVC separates an application into Models for data and business rules, Views for presentation, and Controllers that handle requests and connect the two. In Laravel, routes send a request to a controller, the controller uses Eloquent models to query the database, and returns a Blade view or JSON. This separation makes code testable and lets frontend and backend developers work on different layers without conflicts.
17

Write a query to find duplicate email addresses in a users table.

MySQL DatabaseMedium
Save to ▾
Show answer
Group by the column and keep groups with more than one row: SELECT email, COUNT(*) AS total FROM users GROUP BY email HAVING COUNT(*) > 1; To delete duplicates but keep the lowest id: DELETE u1 FROM users u1 JOIN users u2 ON u1.email = u2.email AND u1.id > u2.id; Afterwards add a UNIQUE index on email so duplicates cannot come back.
18

What is the difference between px, em and rem units?

CSS Layout and Responsive DesignMedium
Save to ▾
Show answer
px is a fixed unit. em is relative to the font size of the current element, so nested em values compound and can grow unexpectedly. rem is relative to the root html font size, usually 16 pixels, so 1.5rem is always 24 pixels unless the user changes browser settings. Using rem for font sizes and spacing respects user preferences and keeps scaling consistent across the site.
19

What is hoisting in JavaScript?

JavaScript CoreEasy
Save to ▾
Show answer
Hoisting means declarations are processed before code runs, so they behave as if moved to the top of their scope. Function declarations are hoisted completely and can be called before they appear. var variables are hoisted but set to undefined until assignment. let, const and class are hoisted too, but accessing them before declaration throws a ReferenceError because of the temporal dead zone.
20

Your frontend on one domain gets a CORS error calling your API on another. How do you resolve it?

Web SecurityMedium
Save to ▾
Show answer
The fix belongs on the API server, not the frontend. I would configure it to return Access-Control-Allow-Origin with the exact frontend origin, handle OPTIONS preflight requests with the allowed methods and headers, and add Access-Control-Allow-Credentials: true if cookies are needed. Alternatively, serving the API under the same domain through a reverse proxy, like /api, removes cross-origin calls altogether.
21

A third-party widget's CSS keeps overriding your button styles. How do you handle it?

CSS Layout and Responsive DesignHard
Save to ▾
Show answer
First I would check which selector wins in DevTools and why. Options include scoping my styles with a more specific component class, using CSS cascade layers so third-party CSS sits in a lower layer, or loading the widget inside an iframe or Shadow DOM so its styles are isolated. I would avoid adding !important everywhere, because it starts an override war that becomes impossible to maintain.
22

Compare localStorage, sessionStorage and cookies.

DOM and Browser EventsMedium
Save to ▾
Show answer
localStorage stores about 5 MB per origin and persists until cleared. sessionStorage has similar size but is cleared when the tab closes and is separate per tab. Cookies are small, around 4 KB, are sent to the server with every request, and can be HttpOnly, Secure and SameSite. Use cookies for session identifiers, and storage for UI preferences. Never store tokens or passwords in localStorage, since any XSS can read it.
23

What are data-* attributes and when do you use them?

HTML FundamentalsMedium
Save to ▾
Show answer
Custom data attributes such as data-product-id or data-price let you store extra information on an element without misusing class or id. JavaScript reads them through element.dataset, for example button.dataset.productId, and CSS can target them with attribute selectors. They are ideal for passing small values from server-rendered HTML to scripts, but sensitive data should never be stored there because anyone can read the page source.
24

Explain the types of cross-site scripting (XSS).

Web SecurityMedium
Save to ▾
Show answer
XSS lets an attacker run their JavaScript in another user's browser. Stored XSS saves the payload in the database, such as a malicious comment shown to every visitor. Reflected XSS bounces a payload from a URL parameter straight into the response. DOM-based XSS happens entirely in client code, for example writing location.hash into innerHTML. Defences are context-aware output escaping, safe DOM APIs and a Content Security Policy.
25

Use clamp() to create fluid typography.

CSS Layout and Responsive DesignHard
Save to ▾
Show answer
clamp(min, preferred, max) scales text smoothly between limits: h1 { font-size: clamp(1.75rem, 1rem + 3vw, 3.5rem); } p { font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem); } The heading never goes below 28 pixels on phones or above 56 pixels on large screens. Mixing rem with vw in the middle value keeps text zoomable for accessibility, unlike pure vw values.
26

A comment section displays user input using innerHTML. What is the risk and fix?

DOM and Browser EventsMedium
Save to ▾
Show answer
It allows stored cross-site scripting: a user can post <img src=x onerror=...> and the script runs for every visitor, stealing sessions or defacing the page. I would switch to textContent or createElement for rendering, escape output on the server, and if rich text is needed, sanitise with a library like DOMPurify. A strict Content Security Policy adds another layer by blocking inline scripts.
27

What is a mistake you made in web development and what did you learn?

Web SecurityEasy
Save to ▾
Show answer
Situation: in my first project, I stored user passwords using md5. Task: when a mentor reviewed my code, I had to fix it before launch. Action: I learned why fast hashes are unsafe, switched to password_hash and password_verify, and added rehashing on login for existing users. Result: the system became secure, and since then I always research security best practices before building authentication.
28

Schedule a nightly database backup with cron.

Hosting and DeploymentMedium
Save to ▾
Show answer
Edit the crontab with crontab -e and add: 30 2 * * * mysqldump --single-transaction -u backup school | gzip > /backups/school_$(date +\%F).sql.gz 0 3 * * * find /backups -name '*.sql.gz' -mtime +14 -delete The first line runs at 2:30 AM daily; the second removes backups older than 14 days. Keep credentials in ~/.my.cnf with restricted permissions instead of the command, escape % in crontab, and copy backups to off-server storage.
29

Tell me about a time you found a security issue in someone else's code.

Web SecurityMedium
Save to ▾
Show answer
Situation: during a code review, I noticed a teammate built a search query by concatenating user input. Task: I had to flag it without making them feel blamed. Action: I messaged them privately, showed a harmless injection example on staging, and suggested a prepared statement fix with a short snippet. Result: they fixed it before release, and we added a SQL injection check to our review checklist.
30

Your page has a high Cumulative Layout Shift because of fonts and ads. How do you reduce it?

CSS Layout and Responsive DesignHard
Save to ▾
Show answer
For fonts I would preload the main font file, use font-display: swap or optional, and tune fallback fonts with size-adjust so the swap does not move text. For ads and embeds I would reserve space with a fixed min-height or aspect-ratio box before they load. I would also set width and height on all images and avoid inserting banners above existing content after load.
31

What is the difference between a shallow copy and a deep copy?

JavaScript CoreMedium
Save to ▾
Show answer
A shallow copy, made with spread syntax or Object.assign, copies only top-level properties, so nested objects are still shared references. Changing copy.address.city also changes the original. A deep copy duplicates every nested level. Modern browsers and Node provide structuredClone(obj), which handles dates, maps and circular references. JSON.parse(JSON.stringify(obj)) also works but drops functions, undefined and converts dates to strings.
32

How do arrow functions differ from regular functions?

JavaScript CoreMedium
Save to ▾
Show answer
Arrow functions have shorter syntax, an implicit return for single expressions, and no own this, arguments or super; they inherit these from the outer scope. They cannot be used as constructors with new and do not have a prototype property. This makes them ideal for callbacks like array.map, but unsuitable for object methods that need this to refer to the object, or for event handlers that rely on this as the element.
33

What is the difference between id and class attributes?

HTML FundamentalsEasy
Save to ▾
Show answer
An id must be unique within a page and identifies one element, so it is used for anchor links, label for attributes and getElementById. A class can be reused on many elements and is the normal hook for CSS styling and grouping in JavaScript. Ids also have much higher CSS specificity, so styling with ids makes overrides harder; most teams style only with classes.
34

Emails sent from your website contact form land in spam. How do you fix it?

Hosting and DeploymentMedium
Save to ▾
Show answer
I would stop sending through PHP mail() from the web server and use an authenticated SMTP or transactional email service. Then I would publish SPF to authorise the sender, DKIM to sign messages, and a DMARC policy in DNS. The From address should belong to the verified domain, while the visitor's email goes in Reply-To. Mail testing tools show the spam score and missing records.
35

Time to first byte is over 2 seconds even for simple pages. What do you check?

Hosting and DeploymentMedium
Save to ▾
Show answer
High TTFB points to the server, not the browser. I would check if OPcache is enabled, profile slow database queries, look for blocking external API calls during page generation, and check whether the server is low on CPU or memory. Fixes include full-page caching for anonymous users, object caching with Redis, upgrading PHP, choosing a server region close to Indian users, and putting a CDN in front.
36

How do you keep yourself updated with changes in web standards?

HTML FundamentalsMedium
Save to ▾
Show answer
I follow MDN Web Docs, web.dev and the release notes of Chrome and Firefox, and I check Can I Use before adopting a new feature. Every few weeks I build a small demo with something new, such as container queries or the popover attribute, and push it to GitHub. For example, after reading about native lazy loading, I replaced a JavaScript library in my project and reduced the bundle size.

Companies with offices in Kolkata (2)

IT services

Wipro

Web Development interview questions

  • 30 questions
  • 4 rounds

Bengaluru, Hyderabad, Pune +2

View questions
IT services

Cognizant

Web Development interview questions

  • 30 questions
  • 4 rounds

Chennai, Bengaluru, Pune +2

View questions

Frequently asked questions

Which companies hire Web Development professionals in Kolkata?

Companies with large offices in Kolkata include Wipro, Cognizant. Use their company pages below to practise employer-specific sets.

Are Web Development interviews in Kolkata different from other cities?

The questions depend more on the company than the city. Kolkata's mix of employers decides the style: Many openings are with service companies and their delivery centres, with a focus on strong fundamentals

How do I find Web Development jobs in Kolkata?

Shortlist companies with Kolkata offices, keep your CV focused on Web Development projects, apply on company career pages and job portals with the Kolkata filter, and practise the questions on this page before each interview.

Other cities

DelhiNoidaGurgaonBangaloreHyderabadPuneChennaiMumbaiAhmedabadJaipurLucknowChandigarhIndoreKochiCoimbatoreBhubaneswarNagpurVisakhapatnamThiruvananthapuram

More ways to practise

Company-wise Web Development questionsExperience-wise Web Development questionsRole-wise Web Development questionsCity-wise Web Development questionsMost asked Web Development questionsScenario-based questionsPractical / hands-on questionsHR & behavioural questionsWeb Development mock interviewOnline assessment questionsTechnical round questionsManagerial round questionsWeb Development topic sheets