Web Computing Viva Questions and Answers Semester 5 Mumbai University
Table of Contents
Module 1: Web Programming Fundamentals (Web Computing Viva)
1. What is the role of a web browser in web programming?
A web browser is a software application that retrieves and displays web content. It interprets HTML, CSS, and JavaScript to render web pages.
2. Explain the difference between HTTP and HTTPS protocols.
HTTP (Hypertext Transfer Protocol) is not secure, while HTTPS (Hypertext Transfer Protocol Secure) is secure. HTTPS encrypts data for secure communication.
3. What is DNS, and how does it work in the context of web programming?
DNS (Domain Name System) is a system that translates domain names (e.g., www.example.com) into IP addresses. It’s essential for locating web servers on the internet.
4. What is TLS, and why is it important in web programming?
TLS (Transport Layer Security) is a protocol that ensures secure communication over the internet. It encrypts data to protect it from unauthorized access.
5. Explain the concepts of XML and JSON in web programming.
XML (eXtensible Markup Language) and JSON (JavaScript Object Notation) are data interchange formats used in web development to structure and exchange data.
6. What does DOM stand for, and how is it used in web programming?
DOM (Document Object Model) is a programming interface for web documents. It represents the structure of a web page, allowing scripts to interact with the page’s content.
7. What is the difference between URL and URI in the context of web programming?
A URL (Uniform Resource Locator) is a specific type of URI (Uniform Resource Identifier) that identifies the location of a resource on the web. URI is a more general term.
8. Define REST API in the context of web programming.
REST (Representational State Transfer) is an architectural style used to design networked applications. A REST API provides access to resources and performs CRUD (Create, Read, Update, Delete) operations.
9. How does HTTP work, and what is its role in web programming?
HTTP is a protocol used for transferring data between a web server and a client (e.g., a web browser). It defines the structure of requests and responses for web communication.
10. Describe the structure of a typical JSON object in web programming.
A JSON object consists of key-value pairs, where keys are strings and values can be strings, numbers, booleans, objects, arrays, or null. It’s a lightweight data format widely used in web development.
11. How does a web browser interpret and render HTML and CSS in web programming?
A web browser parses HTML to create a Document Object Model (DOM) and applies CSS styles to render a web page. The DOM structure is used to display content visually.
12. Why is URI encoding important in web programming, and how is it achieved?
URI encoding is crucial for handling special characters and spaces in URIs. It’s achieved by converting characters to their respective percent-encoded representations, making URIs safe for transmission.
13. Explain the key principles of a RESTful API in web programming.
RESTful APIs adhere to principles such as statelessness, resource-based URLs, and the use of standard HTTP methods (GET, POST, PUT, DELETE) to perform operations on resources.
14. What is the significance of the HTTPS protocol in web security?
HTTPS encrypts data during transmission, providing security and privacy. It’s essential for protecting sensitive information like login credentials and financial transactions on the web.
15. How does the DNS system help users access websites in web programming?
The DNS system translates human-readable domain names into IP addresses, enabling users to locate and access websites on the internet through user-friendly URLs.
Module 2: JavaScript
1. What are the key language constructs in JavaScript?
JavaScript language constructs are the basic building blocks of the language and include variables, data types, operators, and control structures (e.g., conditionals and loops).
2. Explain the different types of objects in JavaScript.
JavaScript has built-in objects, browser objects, and DOM objects. Built-in objects are part of the core language, while browser and DOM objects allow interaction with the web page and the Document Object Model.
3. How does JavaScript handle event handling?
Event handling in JavaScript allows you to respond to user actions on a web page, such as clicks and keyboard input. You can use event listeners to execute functions in response to events.
4. What is the role of JavaScript in form validation and cookies?
JavaScript can be used to validate form data on the client side, ensuring that user inputs meet specific criteria. Cookies can also be set, read, and manipulated using JavaScript for client-side data storage.
5. What are ES5 and ES6 in JavaScript, and how do they differ?
ES5 and ES6 are different versions of the ECMAScript standard for JavaScript. ES6 introduced new features like arrow functions, classes, and let/const for variable declaration, making the language more powerful and readable.
6. Explain the concept of variables in JavaScript.
Variables in JavaScript are used to store and manage data. They can hold different types of data, and their scope can be global or local, depending on how they are declared.
7. Describe the role of conditions and loops in JavaScript.
Conditions (if statements, switch) are used to make decisions in JavaScript, while loops (for, while) allow you to execute code repeatedly based on a condition.
8. What are arrow functions, and how do they differ from regular functions in JavaScript?
Arrow functions are a concise way to write functions in JavaScript. They have a shorter syntax and a different behavior with respect to the “this” keyword compared to regular functions.
9. How can you set CSS styles using JavaScript?
You can manipulate CSS styles in JavaScript by accessing the “style” property of HTML elements and modifying their CSS properties. This allows dynamic styling of web elements.
10. What is DOM manipulation in JavaScript?
DOM manipulation involves changing the content or structure of a web page using JavaScript. It allows you to add, modify, or remove elements from the Document Object Model (DOM).
11. Explain the concepts of classes and inheritance in JavaScript.
JavaScript introduced class syntax to create objects and support inheritance. Classes provide a blueprint for object creation, and inheritance allows objects to inherit properties and methods from other objects.
12. What are iterators and generators in JavaScript?
Iterators and generators are features that make it easier to work with collections of data in JavaScript. Iterators allow you to loop through data, while generators provide a way to create iterators with less boilerplate code.
13. What is a Promise in JavaScript, and how does it work?
A Promise is an object representing the eventual completion (or failure) of an asynchronous operation. It simplifies handling asynchronous tasks and allows chaining of operations when the task is completed.
14. How does JavaScript facilitate client-server communication?
JavaScript can make network requests to servers using methods like Fetch, which enables client-server communication. This is crucial for retrieving data from a server or sending data to it.
Module 3: React Fundamentals
1. How do you install React and set up a React project?
You can install React using npm or yarn and set up a project using create-react-app. This generates a project with the necessary files and dependencies.
2. What are the essential libraries commonly used in React development?
Common libraries in React development include React Router for routing, Axios for HTTP requests, and Redux for state management.
3. Describe the typical folder and file structure in a React project.
A standard React project structure includes folders for components, styles, assets, and pages. It also has configuration files like package.json and webpack.config.js.
4. What is a React component, and how is it used in React development?
A React component is a reusable, self-contained piece of UI. Components can be composed to build complex UIs, making development more modular and maintainable.
5. Explain the concept of component lifecycle in React.
The component lifecycle in React consists of three phases: Mounting, Updating, and Unmounting. These phases provide hooks for performing actions at different points in a component’s existence.
6. What are state and props in React, and how do they differ?
State is used for managing internal component data, while props are used to pass data from a parent component to a child component. Props are read-only, while state is mutable.
7. How does React Router facilitate single-page applications (SPAs)?
React Router is a library that enables navigation and routing in SPAs. It allows you to define routes, linking URLs to specific components, and rendering them dynamically without full page reloads.
8. What are the key considerations in UI design in React development?
UI design in React involves creating a responsive and user-friendly interface. It includes considerations such as layout, styling, and accessibility for a better user experience.
9. How do you work with forms in React, and what is controlled and uncontrolled components?
In React, you can create forms by handling form events and managing form data. Controlled components are React components that have their value controlled by React, while uncontrolled components rely on the DOM to manage values.
10. How can you handle events in React components?
You can handle events in React by attaching event handlers to elements and specifying functions to be executed when the events occur. Common events include onClick, onChange, and onSubmit.
11. What are some common techniques for implementing animations in React applications?
Animations in React can be achieved using CSS transitions, libraries like React Spring or React Transition Group, and by directly manipulating the DOM elements using JavaScript animations.
12. What are some best practices for React development?
Best practices in React development include component reusability, following a consistent folder structure, using functional components when possible, and managing state and side effects carefully to maintain a clean codebase.
Module 4: Node.js
1. How do you set up the Node.js environment on your machine?
You can set up Node.js by downloading the installer from the official website and following the installation instructions for your operating system.
2. What is the first step in creating a Node.js application?
The first step in creating a Node.js application is to initialize a project using npm or yarn by running “npm init” or “yarn init” in your project directory.
3. Explain the concept of asynchronous programming in Node.js.
Asynchronous programming in Node.js allows non-blocking execution of code, enabling multiple tasks to be performed simultaneously without waiting for each to complete.
4. What is the callback concept in Node.js, and how is it used?
A callback is a function passed as an argument to another function. It is executed when a particular operation or task is complete, allowing for asynchronous control flow in Node.js.
5. How does the event loop work in Node.js?
The event loop in Node.js is responsible for managing asynchronous operations. It continually checks the message queue for pending events and executes their associated callbacks when resources are available.
6. What is the REPL (Read-Eval-Print Loop) in Node.js, and how is it used?
The REPL is an interactive command-line tool that allows you to execute JavaScript code, line by line. It’s helpful for testing and experimenting with code in a live environment.
7. How does Node.js’s Event Emitter module work?
The Event Emitter module in Node.js provides an implementation of the observer pattern. It allows objects to subscribe to and emit events, enabling communication and event-driven programming.
8. Explain the role of the networking module in Node.js.
The networking module in Node.js allows you to create network servers and clients. You can build applications that communicate over protocols like HTTP, TCP, and UDP using this module.
9. What are buffers in Node.js, and how are they used?
Buffers in Node.js are used to handle binary data. They represent fixed-size chunks of memory and are commonly used for I/O operations, such as reading and writing binary data from streams or files.
10. How do streams work in Node.js, and what are their advantages?
Streams in Node.js are used for reading from or writing to I/O devices, such as files or network connections, in a memory-efficient and non-blocking manner. They help handle large data efficiently.
11. Describe the File System module in Node.js and its use cases.
The File System module in Node.js allows you to work with the file system on your server or local machine. It provides methods for file and directory operations, making it suitable for reading, writing, and manipulating files.
12. How does the Web module in Node.js enable web server development?
The Web module in Node.js is used for creating web servers. It provides features to handle HTTP requests and responses, making it suitable for building web applications and RESTful APIs.
Module 5: Express
1. What is Express and how does it relate to Node.js?
Express is a web application framework for Node.js. It simplifies the process of building web applications and APIs by providing a set of tools and features.
2. How does Express use the concept of middleware in web applications?
Express uses middleware functions to handle requests and responses in the request-response cycle. Middleware functions are executed sequentially, allowing for various operations like routing, authentication, and data processing.
3. What is an Express router, and how does it help organize routes in an application?
An Express router is a mini-application within an Express application. It helps organize and define routes and their corresponding handlers, making it easier to manage complex route structures.
4. What is the role of Express in building RESTful APIs?
Express is commonly used to build RESTful APIs by defining routes that correspond to resources. It simplifies the creation of endpoints for various HTTP methods like GET, POST, PUT, and DELETE.
5. How can generators be used in Express applications, and what are their benefits?
Generators can be used in Express applications to handle asynchronous code more cleanly. They help in avoiding callback hell and improving code readability. Generator-based control flow libraries like co can be used with Express to achieve this.
6. What is the significance of authentication in web applications, and how can Express facilitate authentication?
Authentication is the process of verifying the identity of users. Express can facilitate authentication by using middleware like Passport.js, which provides various authentication strategies for applications.
7. How does Express handle user sessions, and why are sessions important in web applications?
Express can handle user sessions by using session middleware, like express-session. Sessions are crucial for maintaining user state and storing data between HTTP requests in stateless applications.
8. What are some common methods of integrating Express with a front-end library or framework like React?
Express can be integrated with React by serving React apps and assets using Express, setting up routes for API calls, and using libraries like axios for making HTTP requests between the front end and the Express back end.
9. Explain the concept of URL routing in Express.
URL routing in Express refers to the process of mapping specific URLs (routes) to corresponding server-side actions. It allows the application to handle different HTTP requests differently based on the URL.
10. How can Express handle request and response objects in route handlers?
Express route handlers receive request and response objects as arguments. These objects contain information about the incoming request and allow you to send responses back to the client, making it easy to handle HTTP requests.
11. What is the role of the Express application generator in project setup?
The Express application generator is a tool that helps set up the initial structure of an Express application. It creates a project directory with the necessary files and directories to start building an Express app.
12. How can you use route parameters in Express to create dynamic routes?
Route parameters in Express are placeholders in route patterns that match sections of the URL. They allow you to create dynamic routes by extracting values from the URL, which can be used in route handlers.
Module 6: Advanced React
1. What are refs in React, and how are they used in functional components?
Refs in React provide a way to access and interact with a DOM element directly. In functional components, you can use the `useRef` hook to create and work with refs.
2. How does the `useEffect` hook work in React?
The `useEffect` hook is used for side effects in functional components. It allows you to perform tasks like data fetching, DOM manipulation, and subscriptions in a functional component, and it runs after rendering.
3. What are React hooks, and why were they introduced?
React hooks are functions that allow functional components to “hook into” React state and lifecycle features. They were introduced to enable state and side effect management in functional components without using class components.
4. What is the Flow architecture in React, and how does it differ from other state management solutions?
Flow architecture is an approach to state management in React that encourages unidirectional data flow. It’s similar to Flux and Redux but offers a simpler and more predictable way of managing application state.
5. Explain the Model-ViewController (MVC) framework in the context of React.
The Model-ViewController framework is a design pattern that separates an application into three interconnected components: Model (data and business logic), View (user interface), and Controller (intermediary for user input). React can be used to implement this pattern.
6. What is the Flux architecture, and how does it address the challenges of state management in React?
Flux is an architectural pattern for managing data flow in React applications. It introduces unidirectional data flow, which helps avoid complexities associated with two-way binding and ensures predictable updates of the user interface.
7. What is Webpack, and how does it play a role in bundling a React application?
Webpack is a popular JavaScript module bundler. It’s used to bundle various assets, including JavaScript, CSS, and images, into a single bundle or multiple bundles, making them suitable for deployment in a web application.
8. How can you use the `useRef` hook in React to work with DOM elements?
You can use the `useRef` hook to create a ref, attach it to a DOM element using the `ref` attribute, and then access and manipulate the DOM element directly from your functional component.
9. Explain the concept of side effects in React and when to use the `useEffect` hook.
Side effects in React are operations that occur after the initial render, such as data fetching, DOM manipulation, and subscriptions. The `useEffect` hook is used to manage these side effects in functional components.
10. What are the key advantages of using React hooks over class components?
React hooks provide cleaner and more concise code, improved reusability, better separation of concerns, and a simpler way to manage state and side effects compared to class components.
11. How does Flow architecture maintain a unidirectional data flow in React applications?
Flow architecture maintains a unidirectional data flow by ensuring that changes in the Model trigger updates to the View, and user interactions are dispatched as actions to update the Model. This one-way flow simplifies data management and reduces bugs.
12. How does React play a role in implementing the Model-ViewController (MVC) framework?
React can be used to create the View component in the MVC framework, where it represents the user interface and renders data. React components can also be used to control user interactions and communicate with the Model component.
