Interview Preparation
Full Stack Interview Questions and Answers for Freshers — 2026
These are the most commonly asked Full Stack interview questions for freshers in 2026 — compiled by Vtricks faculty based on real interview feedback from students placed at companies like Accenture, Mindtree, Mphasis, Sapient, startups, product companies in Bangalore.
There are currently 5,200+ active Full Stack job openings in Bangalore. Freshers can expect ₹4.5–7 LPA at companies across Bangalore's tech corridor — Whitefield, Electronic City, Koramangala, and the CBD. Preparation matters: candidates who practise these questions consistently perform significantly better in technical rounds.
Interview Tips from Vtricks Faculty
- Always explain your reasoning process — interviewers want to see how you think, not just the final answer.
- Use real examples from projects you have worked on when answering scenario-based questions.
- If you don't know the answer, say so honestly and describe how you would find the answer — this is better than guessing.
- For Bangalore companies specifically: be ready to answer follow-up questions — they often go 2-3 levels deep on any concept.
- Always ask clarifying questions before answering complex scenario-based questions — this demonstrates professional problem-solving approach.
Easy — basic concept check
Medium — applied knowledge
All 20 Questions
Full Stack Interview Questions — Freshers
Q1. What is the difference between frontend, backend, and full stack development?
Conceptual
Easy
ANSWER
Frontend development involves building everything users see and interact with in the browser — HTML for structure, CSS for styling, and JavaScript for interactivity. Technologies: React, Angular, Vue. Backend development involves server-side logic, database interactions, authentication, and APIs — what happens behind the scenes. Technologies: Node.js, Python (Django), Java (Spring). Full Stack development involves working on both frontend and backend, with the ability to build a complete web application. Full stack developers are valued for understanding the complete system and are especially common in startups where one person needs to handle multiple responsibilities.
Q2. What is the DOM and how does JavaScript interact with it?
Technical
Easy
ANSWER
The DOM (Document Object Model) is a programming interface that represents an HTML document as a tree of objects — each HTML element becomes a node in the tree. JavaScript interacts with the DOM to dynamically change content, structure, and styles without reloading the page. Common DOM operations: document.getElementById(), document.querySelector() to select elements; element.innerHTML, element.textContent to change content; element.style to change CSS; element.addEventListener() to handle events; document.createElement() and element.appendChild() to add new elements. In React, you rarely manipulate the DOM directly — React uses a Virtual DOM to efficiently update the real DOM.
Q3. What is the difference between let, const, and var in JavaScript?
Technical
Easy
ANSWER
var is function-scoped, hoisted (moved to top of function), and can be re-declared — causes unexpected bugs and is largely replaced by let and const. let is block-scoped (limited to the nearest {}), not hoisted like var, can be reassigned but not re-declared in same scope — use for variables that change. const is block-scoped, cannot be reassigned after declaration — use for values that should not change. Note: const for objects and arrays means you cannot reassign the variable, but you can still mutate the object's properties or push to the array. Best practice: use const by default, use let when reassignment is needed, avoid var.
Q4. What is React and what problem does it solve?
Conceptual
Easy
ANSWER
React is a JavaScript library developed by Facebook for building user interfaces — specifically, component-based UIs. It solves the problem of efficiently updating the UI when data changes. Traditional approach: manually updating the DOM is slow and error-prone. React's solution: Virtual DOM — React creates a virtual representation of the UI in memory, compares it with the previous version (diffing), and only updates the actual DOM where changes occurred (reconciliation). Key concepts: components (reusable UI pieces), props (data passed from parent to child), state (data that changes over time), JSX (HTML-like syntax in JavaScript).
Master These Questions
Practice Full Stack with Live Mentors at Vtricks
600+ students placed · 89% placement rate · Starts at ₹40,000
Free Demo Class →
Q5. What is the difference between == and === in JavaScript?
Technical
Easy
ANSWER
== is the loose equality operator — it compares values after performing type coercion (converting types to match). Examples: 1 == '1' returns true (number converted to string), 0 == false returns true (false converted to 0), null == undefined returns true. === is the strict equality operator — it compares both value AND type with no coercion. Examples: 1 === '1' returns false (different types), 0 === false returns false. Always use === in JavaScript to avoid unexpected type coercion bugs. The only common exception is checking for null or undefined together: if (value == null) catches both null and undefined.
Q6. What is REST API and how do you consume it from the frontend?
Technical
Easy
ANSWER
A REST API is a server interface that allows clients to access and manipulate data using HTTP methods: GET (read), POST (create), PUT/PATCH (update), DELETE (remove). Data is typically exchanged in JSON format. Consuming from frontend using JavaScript: Fetch API (built-in) — fetch('/api/users').then(res => res.json()).then(data => console.log(data)). Axios (popular library) — axios.get('/api/users').then(response => console.log(response.data)). In React, API calls are typically made in useEffect hook. Handle loading states (show spinner), error states (show error message), and success states (render data). Use async/await for cleaner asynchronous code.
Q7. What is Node.js and how does it differ from browser JavaScript?
Conceptual
Easy
ANSWER
Node.js is a JavaScript runtime environment built on Chrome's V8 engine that allows JavaScript to run outside the browser — on servers. Key differences from browser JavaScript: No DOM or browser APIs (window, document, localStorage) in Node.js. Node.js has access to file system (fs module), OS information, network sockets, and child processes. Node.js uses CommonJS module system (require/module.exports) though ES modules (import/export) are supported. Node.js is single-threaded but handles concurrency through its event loop and non-blocking I/O — making it excellent for I/O-heavy applications like APIs and real-time applications.
Q8. What is MongoDB and when do you choose it over a relational database?
Conceptual
Easy
ANSWER
MongoDB is a NoSQL document database that stores data as flexible JSON-like documents (BSON) without a fixed schema. Choose MongoDB over relational databases when: your data structure is flexible or evolving (no rigid schema needed), you are storing hierarchical or nested data naturally (user with array of addresses), you need horizontal scaling across many servers, you are building applications with rapidly changing requirements (startups). Choose relational databases (PostgreSQL, MySQL) when: you need ACID transactions across multiple tables, your data has complex relationships with referential integrity, you need complex JOIN queries, or your data is highly structured.
Q9. Explain the concept of promises and async/await in JavaScript.
Technical
Medium
ANSWER
A Promise is an object that represents the eventual completion or failure of an asynchronous operation. It has three states: pending (initial), fulfilled (resolved successfully), rejected (failed). Promise chaining: fetch(url).then(res => res.json()).then(data => ...).catch(err => ...). Async/await is syntactic sugar over Promises that makes asynchronous code look synchronous and more readable. async function makes a function return a Promise. await pauses execution until the Promise resolves. Always wrap await in try-catch for error handling. Under the hood, async/await uses Promises — they are equivalent in functionality. Async/await is generally preferred for readability in modern JavaScript.
Master These Questions
Practice Full Stack with Live Mentors at Vtricks
600+ students placed · 89% placement rate · Starts at ₹40,000
Free Demo Class →
Q10. What is CSS Flexbox and when do you use it?
Technical
Easy
ANSWER
Flexbox is a CSS layout model that provides an efficient way to align and distribute items within a container along a single axis (horizontal or vertical). Enable with display: flex on the container. Key properties: flex-direction (row or column), justify-content (alignment on main axis — center, space-between, space-around), align-items (alignment on cross axis — center, stretch, flex-start), flex-wrap (allow items to wrap to next line), gap (space between items), flex-grow/shrink/basis on child items. Use Flexbox for: navigation bars, centering elements, distributing items in a toolbar or card row. Use CSS Grid for two-dimensional layouts (rows AND columns simultaneously).
Q11. What is the difference between HTTP and HTTPS?
Conceptual
Easy
ANSWER
HTTP (Hypertext Transfer Protocol) transfers data between browser and server in plain text — anyone who intercepts the traffic can read it. HTTPS (HTTP Secure) encrypts data using SSL/TLS — data is encrypted in transit so interceptors only see unreadable ciphertext. HTTPS also authenticates the server using digital certificates from Certificate Authorities, preventing man-in-the-middle attacks. How it works: SSL/TLS handshake establishes encrypted connection, then HTTP communication happens over this secure channel. Google Chrome marks HTTP sites as 'Not Secure'. Search engines rank HTTPS sites higher. Always use HTTPS in production — free certificates are available from Let's Encrypt.
Q12. What is Express.js and what is its role in a full stack application?
Technical
Easy
ANSWER
Express.js is a minimal and flexible Node.js web framework that provides routing, middleware support, and HTTP utilities for building web applications and REST APIs. In a full stack MERN application (MongoDB, Express, React, Node): Express runs on the server (Node.js), handles HTTP requests from the React frontend, queries MongoDB, and returns JSON responses. Key Express concepts: Routes define endpoints (app.get('/api/users', handler)), Middleware are functions that run before route handlers (authentication, logging, body parsing), Request and Response objects provide access to headers, body, params, and query strings. Express is intentionally minimal — you add functionality through npm packages.
Q13. What is useState and useEffect in React?
Technical
Easy
ANSWER
useState is a React Hook that adds state to functional components. It returns an array with the current state value and a function to update it: const [count, setCount] = useState(0). Calling setCount triggers a re-render. useEffect is a Hook that performs side effects in functional components — it runs after every render by default. Use cases: fetching data from an API, subscribing to events, updating the document title, setting up timers. The dependency array controls when useEffect runs: empty array [] means run once after mount; [value] means run when value changes; no array means run after every render. Return a cleanup function to unsubscribe from events or clear timers.
Q14. What is CORS and why do you encounter it in full stack development?
Technical
Medium
ANSWER
CORS (Cross-Origin Resource Sharing) is a browser security mechanism that blocks web pages from making requests to a different domain than the one that served the page. You encounter it when your React app (running on localhost:3000) makes an API request to your Express server (running on localhost:5000) — different ports means different origins, triggering CORS. Fix: in Express, use the cors npm package — app.use(cors()) allows all origins (for development) or configure specific origins for production. Never use cors() with wildcard in production for APIs that handle authentication — specify exact allowed origins, methods, and headers.
Master These Questions
Practice Full Stack with Live Mentors at Vtricks
600+ students placed · 89% placement rate · Starts at ₹40,000
Free Demo Class →
Q15. How does authentication work in a full stack application?
Technical
Medium
ANSWER
Common authentication flow using JWT (JSON Web Token): User submits login form with email and password to the backend. Server verifies credentials against database (using bcrypt to compare hashed password). If valid, server creates a JWT containing user ID and role, signed with a secret key, and sends it to the client. Client stores the JWT (in memory or HttpOnly cookie — not localStorage for security). On subsequent requests, client sends JWT in Authorization header (Bearer token). Server middleware verifies JWT signature, extracts user info, and allows or denies access. JWTs expire (set expiry time). Use refresh tokens for longer sessions. Always use HTTPS to prevent token interception.
Q16. What is the event loop in JavaScript?
Conceptual
Medium
ANSWER
The JavaScript event loop is the mechanism that allows single-threaded JavaScript to handle asynchronous operations. How it works: Call Stack — executes synchronous code; when empty, the event loop checks the queue. Web APIs (browser) / Node APIs — handle async operations (setTimeout, fetch, file read) outside the main thread. Callback Queue (Macro Task Queue) — stores callbacks from setTimeout, setInterval. Microtask Queue — stores Promise callbacks and mutation observers — processed before the callback queue. Event loop: checks if call stack is empty → processes all microtasks → processes one macro task → repeat. This is why Promise callbacks run before setTimeout callbacks even if setTimeout is set to 0ms.
Q17. What is the purpose of package.json in a Node.js project?
Technical
Easy
ANSWER
package.json is the configuration file for a Node.js project. It contains: project metadata (name, version, description, author, license), dependencies (packages required to run the application in production), devDependencies (packages only needed for development — testing, build tools), scripts (custom commands run with npm run scriptName — npm start, npm test, npm build), engine requirements (minimum Node.js version), and entry point (main field). npm install reads package.json and installs all listed dependencies. package-lock.json locks exact versions of all dependencies for reproducible installs. Always commit both package.json and package-lock.json to version control.
Q18. What is Mongoose and why do you use it with MongoDB?
Technical
Easy
ANSWER
Mongoose is an Object Data Modelling (ODM) library for MongoDB in Node.js. It provides: Schema definition — define the structure and data types of your MongoDB documents, with validation rules. Models — JavaScript classes that represent MongoDB collections, with methods for CRUD operations. Validation — automatically validate data against the schema before saving. Middleware (hooks) — run code before or after operations (pre-save password hashing). Population — join documents from different collections (like SQL JOINs). Without Mongoose, you work directly with the MongoDB driver which is more flexible but has no built-in validation or schema enforcement. Mongoose adds structure and reliability to MongoDB operations.
Q19. Explain the concept of responsive design.
Conceptual
Easy
ANSWER
Responsive design makes web pages look good and function correctly on all screen sizes — from mobile phones (320px) to large desktops (1920px+). Techniques: CSS Media Queries — apply different styles based on screen width: @media (max-width: 768px) { ... }. Flexible grid layouts — use percentage widths or CSS Grid/Flexbox instead of fixed pixel widths. Flexible images — max-width: 100% ensures images scale down. Viewport meta tag — — tells mobile browsers to use the device's actual width. Mobile-first approach — design for mobile first, then add styles for larger screens using min-width media queries.
Q20. Walk me through building a simple CRUD application with MERN stack.
Scenario
Medium
ANSWER
MERN (MongoDB, Express, React, Node) CRUD app structure: Backend: Set up Node.js + Express server. Connect to MongoDB using Mongoose. Define a schema and model (e.g., Todo with title, completed fields). Create routes: GET /api/todos (read all), POST /api/todos (create), PUT /api/todos/:id (update), DELETE /api/todos/:id (delete). Add CORS middleware. Frontend: Create React app. In a TodoList component, use useEffect to fetch todos from API on mount. Display todos with map(). Add a form with controlled inputs and useState. On form submit, call POST endpoint. Add delete button that calls DELETE endpoint. Use conditional rendering for loading and empty states. Connect frontend to backend via API base URL.
Company Insights
What Full Stack Companies in Bangalore Actually Ask
Based on interview feedback from Vtricks students placed at Bangalore companies in 2026:
Round 1 — Written/Online Test
Most Bangalore companies start with a written or online test covering full stack fundamentals, multiple choice questions on React and Node.js, and basic problem-solving questions. Duration: 30–60 minutes. Companies like Accenture and Mindtree use platforms like HackerRank or their own internal assessments.
Round 2 — Technical Interview (Most Important)
This is where most candidates are filtered. Expect: direct questions from this list, hands-on tasks (write a SQL query, debug a piece of code, explain a dashboard you built), and scenario-based questions where you walk through how you would solve a real problem. Be prepared to share your screen and code live.
Round 3 — Managerial / HR Round
Focuses on: why you chose full stack as a career, how you handle ambiguous requirements, a project you are proud of (have this ready in detail — situation, what you did, result), and salary expectations. Research the company's tech stack and recent news before this round.
Tools You Must Be Able to Demonstrate
- React — be ready to use this live in an interview
- Node.js — be ready to use this live in an interview
- MongoDB — be ready to use this live in an interview
- Express — be ready to use this live in an interview
- HTML — be ready to use this live in an interview
- CSS — be ready to use this live in an interview
- JavaScript — be ready to use this live in an interview
More Resources
More Full Stack Interview Preparation
Prepare for Your Full Stack Interview at Vtricks
Our students practise all these questions with live mentors and get placed at top Bangalore companies. Join 600+ students already working in Full Stack.
Mock interviews with mentors
Live daily classes
89% placement rate
Starts at ₹40,000
Book Free Demo Class at Vtricks →
Vijayanagar, Bangalore · Online also available · No payment required