Web Development Flashcards
(13 cards)
Explain client-server architecture in web applications.
Client-side: Browser runs HTML, CSS, JS, handles UI/UX, sends HTTP requests.
Server-side: Processes requests, accesses databases, applies business logic, returns responses.
Uses HTTP/HTTPS protocols. May include APIs, microservices, and CDNs.
What is REST API and how does it differ from SOAP?
REST: Uses HTTP methods (GET, POST, PUT, DELETE), stateless, JSON, resource-based URLs.
SOAP: Uses XML, strict protocol, built-in error handling, higher overhead.
REST is simpler and widely used; SOAP is robust for enterprise systems.
Explain responsive web design principles.
Ensures websites work on various devices:
Fluid grids: Layouts in percentages
Flexible images: Auto-scale
Media queries: Conditional CSS
Mobile-first approach
Touch-friendly UI. Frameworks: Bootstrap, CSS Grid.
Explain client-server architecture in web applications.
A distributed application structure that separates tasks between servers and clients.
Client:
- The user’s web browser (e.g., Chrome, Firefox).
- Responsible for the user interface and user experience.
- Sends requests to the server for data or web pages (e.g., ‘GET /index.html’).
Server:
- A powerful computer that stores the website’s files, data, and application logic.
- Listens for requests from clients, processes them, and sends back responses (e.g., HTML/CSS/JS files, data as JSON).
What are the roles of HTML, CSS, and JavaScript?
The three core technologies of the World Wide Web.
HTML (HyperText Markup Language):
- Provides the basic structure and content of a web page.
- It’s the skeleton of the page (e.g., headings, paragraphs, images).
CSS (Cascading Style Sheets):
- Used for styling and layout; controls the presentation of the HTML.
- It’s the ‘look and feel’ (e.g., colors, fonts, spacing).
JavaScript (JS):
- A programming language that adds interactivity and dynamic behavior to web pages.
- It’s the ‘brains’ (e.g., handling user clicks, form validation, fetching data).
What is the DOM (Document Object Model)?
The DOM is a programming interface for web documents. It represents the page so that programs (like JavaScript) can change the document structure, style, and content.
- It represents an HTML document as a tree of objects (nodes).
- JavaScript can manipulate the DOM to dynamically update what the user sees without needing to reload the entire page.
What is a REST API and how does it differ from SOAP?
REST (Representational State Transfer):
- An architectural style for designing networked applications, not a strict protocol.
- Uses standard HTTP methods (GET, POST, PUT, DELETE).
- Is stateless (each request from a client to a server must contain all the information needed to understand and complete the request).
- Often uses JSON for data format, making it lightweight and easy to read.
SOAP (Simple Object Access Protocol):
- A formal, standardized protocol with strict rules.
- Uses XML exclusively for its message format.
- Can be stateful.
- Generally considered more heavyweight and complex than REST.
What are common HTTP methods and what do they represent?
HTTP methods are verbs that indicate the desired action to be performed on a resource.
GET: Retrieve data from a server (Read).
POST: Submit new data to a server (Create).
PUT: Update an existing resource on the server entirely (Update/Replace).
DELETE: Remove a resource from the server (Delete).
PATCH: Partially update an existing resource.
Explain responsive web design principles.
An approach to web design that makes web pages render well on a variety of devices and window or screen sizes.
Core Principles:
1. Fluid Grids: Using relative units (like percentages) for page element sizing, rather than absolute units (like pixels).
2. Flexible Images: Using CSS rules to ensure images can scale within their containing elements without overflowing.
3. CSS Media Queries: Applying different CSS styles based on the characteristics of the device, such as its width, height, or orientation.
What is the difference between Frontend and Backend development?
Frontend (Client-Side):
- Everything the user directly sees and interacts with in the browser.
- Focuses on UI/UX.
- Technologies: HTML, CSS, JavaScript, and frameworks like React, Angular, Vue.
Backend (Server-Side):
- The ‘behind-the-scenes’ part of the application.
- Focuses on the server, application logic, and database.
- Technologies: Languages like Node.js, Python, Java, PHP, and databases like MySQL, PostgreSQL, MongoDB.
What is a cookie and what is it used for?
A small piece of data that a server sends to a user’s web browser. The browser may store it and send it back with later requests to the same server.
Uses:
1. Session Management: To keep users logged in as they navigate a site.
2. Personalization: To store user preferences (e.g., theme, language).
3. Tracking: To record and analyze user behavior.
Explain the ‘Same-Origin Policy’ and CORS.
Same-Origin Policy (SOP):
- A critical security mechanism that restricts how a document or script loaded from one ‘origin’ (domain, protocol, port) can interact with a resource from another origin.
- It prevents malicious scripts on one page from obtaining sensitive data from another web page.
CORS (Cross-Origin Resource Sharing):
- A mechanism that uses additional HTTP headers to tell browsers to give a web application running at one origin, access to selected resources from a different origin.
- It is a safe way to relax the Same-Origin Policy when needed.
What is version control and why is Git popular?
Version Control: A system that records changes to a file or set of files over time so that you can recall specific versions later.
Why Git is popular:
- It is a distributed version control system, meaning every developer has a full copy of the project history on their local machine.
- It has a powerful branching and merging model, which makes it easy to work on different features in parallel and integrate them later.
