Lecture 3
By Dr. Ali Saeed
Outline
• Web Engineering Process
• Web Engineering Framework and its components
• Modeling Framework
• Internet basic for web Applications
• Language for web and there structure
• Principal of Web Design
Web Engineering Process
• Requirement Analysis
• System Design
• Development
• Testing
• Deployment
• Maintenance and Support
Web Engineering Framework and its
components
• A web framework is a software framework designed to aid and streamline the development of web applications
• Routing: Allows developers to define URL patterns and map them to specific functions or handlers within the application.
• Template Engine: Provides tools for generating dynamic HTML content by combining static templates with dynamic data.
• Database Interaction: Offers mechanisms for interacting with databases, including object-relational mapping (ORM) tools for
simplified database access.
• Middleware: Middleware components allow developers to add functionality to the request-response cycle, such as
authentication, logging, and error handling.
• Security Features: Built-in features or plugins for handling authentication, authorization, data validation, and protection against
common web vulnerabilities like SQL injection and cross-site scripting (XSS).
• Session Management: Provides mechanisms for managing user sessions and storing session data.
• Integration with External Services: Tools and libraries for integrating with external services such as APIs, authentication
providers, and cloud services.
• Testing Support: Includes utilities and frameworks for writing and running automated tests to ensure application quality and
stability.
• Documentation and Community Support: Well-documented APIs, tutorials, and community forums to assist developers in
learning and using the framework effectively.
Example
• Django: A high-level Python web framework that encourages rapid
development and clean, pragmatic design.
• Ruby on Rails: A web application framework written in Ruby that
emphasizes convention over configuration and follows the Model-View-
Controller (MVC) pattern.
• [Link]: A minimalist web framework for [Link] that provides a
flexible, unopinionated set of tools for building web applications and
APIs.
• Flask: A lightweight Python web framework that offers simplicity and
flexibility, allowing developers to quickly build web applications with
minimal boilerplate code.
Modeling in Web
Data Modeling: Designing the structure and relationships of data within a web application for efficient storage
and management.
•User Interface (UI) Modeling: Creating visual representations of the layout and interaction flow of the web
application's user interface.
•Behavioral Modeling: Describing the dynamic behavior and interactions between components within
the web application.
•Architectural Modeling: Defining the overall structure and organization of the web application's components
and their interactions.
•Process Modeling: Visualizing the workflow or business processes supported by the web application to optimize efficiency.
•Security Modeling: Identifying and mitigating potential security threats and vulnerabilities in the web application.
Internet basics for Web Applications
[Link] (Hypertext Transfer Protocol): A protocol for transmitting hypertext requests and
responses between web servers and clients.
[Link] (Uniform Resource Locator): A web address that specifies the location of a resource on the
internet.
[Link] (Hypertext Markup Language): The standard markup language for creating web pages
and web applications.
[Link] (Cascading Style Sheets): A style sheet language used for describing the presentation of
HTML documents.
[Link]: A programming language that enables interactive and dynamic behavior on web pages.
[Link] (Domain Name System): A system that translates domain names into IP addresses.
[Link] Servers: Software that stores, processes, and delivers web content to clients over the internet.
[Link] Browsers: Software that retrieves, renders, and displays web pages to users.
Language for web and there structure
[Link] (Hypertext Markup Language): Markup language used for
creating the structure and content of web pages.
[Link] (Cascading Style Sheets): Style sheet language used for
defining the presentation and layout of HTML documents.
[Link]: Programming language used for adding interactivity and
dynamic behavior to web pages.
[Link] (Hypertext Preprocessor): Server-side scripting language used
for generating dynamic web content.
[Link]: General-purpose programming language often used for
server-side web development with frameworks like Django or Flask.