WELecture01.pptx
- 1. What is The Web? • World Wide Web aka. ‘The Web’ is a way of exchanging information between computers on the Internet • A network of pages containing images, text and sound which can be viewed using browser software. • Internet: The global infrastructure which facilitates the data transfer • Browser: A software application for accessing information on the World Wide Web. 1
- 2. Web Components • Web Page: A container to hold texts, images videos and sounds • Web Site: A collection of related web pages and associated items • Web Server: A computer that stores web site and delivers web pages on client’s request • Uniform Resource Locator (URL): aka. Web Address is a pointer to a web site stored on a web server 2
- 4. • Hypertext Markup Language (HTML) • Cascading Stylesheet (CSS) • Client-side Scripting (JavaScript) • Server-side Programming (.NET/PHP/J2EE) • Databases (SQL Server / MySQL / Oracle / MongoDB) Web Application Development 4
- 5. Software Engineering • Software engineering is an engineering discipline that is concerned with all aspects of software production • Software Engineering is the science and art of building significant software systems that are: – on time – on budget – with acceptable performance – with correct operation 5
- 6. 6
- 7. Web Engineering • Web engineering is the study of the process, used to create high quality Web-based applications • Web engineering draws heavily on the principles and management activities found in software engineering processes • Web engineering extends Software Engineering to Web applications 7
- 8. Scenarios A company is looking to launch an e-commerce website to sell their products online. As a web engineer, you are tasked with designing and developing the website. What are the key considerations you need to keep in mind during the design and development process? 8
- 10. Software Engineering Process 10 How software engineering process model can be applied on the development of the website?
- 11. Web Engineering • The application of systematic and quantifiable approaches to cost-effective analysis, design, implementation, testing, operation, and maintenance of high-quality web applications 11
- 12. Defining Web Application • The application of systematic and quantifiable approaches to cost-effective analysis, design, implementation, testing, operation, and maintenance of high-quality web applications • Application development on the Web remains largely ad hoc. – Spontaneous, one-time events – Individual experience – Little or no documentation for code/design • Short-term savings lead to long-term problems in operation, maintenance, usability, etc. 12
- 13. The case of Web Engineering • Top project pitfalls (Cutter, 2000) – 84% - Failure to meet business objectives – 79% - Project schedule delays – 63% - Budget overrun – 53% - Lack of functionality • Web Engineering’s solution: – Clearly defined goals & objectives – Systematic, phased development – Careful planning – Iterative & continuous auditing of the entire process 13
- 14. Categories of Web Applications • Document-centric websites • Interactive and transactional web applications • Workflow-based web applications • Collaborative and social web applications • Portal-oriented web applications • Ubiquitous web applications 14
- 15. Document-centric Websites • Originator to Web applications • Static HTML documents • Manual updates • Pros – Simple, stable, short response times • Cons – High management costs for frequent updates & large collections – More prone to inconsistent/redundant info • Example: static home pages 15
- 16. Interactive and Transactional Web Applications • Not only read-only content but also allow content modification • Come with the introduction of HTML forms • Simple interactivity • Dynamic page creation – Web pages and links to other pages generated dynamically based on user input • Content updates -> Transactions – Database connectivity – Increased complexity • Examples: news sites, booking systems, online banking 16
- 17. Workflow based Applications • Designed to handle business processes across departments, organizations & enterprises • Automates processes consisting of series of steps • Business logic defines the structure • High complexity; autonomous entities • Examples: B2B & e-Government 17
- 18. Collaborative & Social Web Applications • Unstructured, cooperative environments – Support shared information workspaces to create, edit and manage shared information – Interpersonal communication is paramount • Classic example: Wikis • The Social Web – Moving towards communities of interest • Examples: Blogs, facebook, twitter etc. 18
- 19. Web Portals • One specially-designed at a website which brings information together from diverse sources in a uniform way • Each information source gets its dedicated area • Specialized portals – Business portals – Marketplace portals – Community portals 19
- 20. Ubiquitous web application • These kind of applications provides customized facilities for any device from anywhere at any time. • It has limited interaction facility and support limited device. • It require advance knowledge of context where the web application is being used for dynamic adjustment. • Services based on location is an example of such web application. 20
- 21. Knowledge-based web application • This kind of application is used for providing knowledge for both human and machine. • The knowledge management is based on semantic web technologies. • Example: Expert System 21
- 22. 22
- 23. Characteristics of Web Applications • How do Web applications differ from traditional applications? • 3 dimensions – Product-based – Usage-based – Development-based 23
- 25. Usage-based Characteristics ● Much greater diversity compared to traditional non-Web applications – Users vary in numbers, cultural background, devices, h/w, s/w, location etc ● Social Context (Users) – Spontaneity - scalability – Heterogeneous groups ● Technical Context (Network & Devices) – Quality-of-Service ● Natural Context (Place & Time) – Globality – Availability 25
- 26. Development-based Characteristics ● The Development Team – Multidisciplinary – print publishing, s/w development, marketing & computing, art & technology ● Technical Infrastructure – Lack of control on the client side ● Integration – Internal – with existing legacy systems – External – with Web services – Integration issues: correct interaction, guaranteed QoS 26
Editor's Notes
- #4: User inputs the web application URL into their web browser and hits Enter. The web server receives the request and sends back the HTML code that makes up the web page. The web browser renders the HTML code and displays the web page on the user's device. The user interacts with the web page by clicking on links or buttons, filling out forms, and so on. As the user interacts with the web page, the browser sends requests to the web server, asking for additional data or resources. The web server responds to these requests by sending back more data or resources, which the browser uses to update the web page. This process of sending requests and receiving responses continues until the user has completed their task within the web application.
- #6: Web engineering is a subset of software engineering that deals specifically with the development of web-based software systems. Therefore, the principles, techniques, and best practices of software engineering are also applicable to web engineering. In order to develop high-quality web-based software systems, web engineers must follow the same fundamental principles of software engineering, such as requirements gathering, analysis and design, testing, and maintenance. software engineering provides the foundational principles and practices that web engineering builds upon to design, develop, test, and maintain web-based software systems.
- #7: AI software is a type of computer program that uses machine learning algorithms, natural language processing, and other techniques to simulate human intelligence and perform tasks that would typically require human intelligence to complete. Web application is a software program that runs on a web server and can be accessed by users over the internet using a web browser. Web applications are designed to be interactive and allow users to perform tasks or access information through a web-based interface. Examples of web applications include email clients, online banking portals, e-commerce websites, and project management tools. Product line software: Microsoft Office: Each program in the suite shares a common user interface and set of features, but is designed for a different set of tasks.
- #9: Search engine optimization
- #10: the waterfall model should only be applied when requirements are well understood and unlikely to change radically during development as this model -> The process to gather the software requirements from client, analyze and document them -> System and software design involves defining the architecture, components, and interfaces of a system or software solution to meet specified requirements. -> Implementation is the process of writing and coding software based on the design, while unit testing is the process of testing individual units or components of the software to ensure they function correctly in isolation. -> Integration testing is the process of testing how multiple software components work together, while system testing is the process of testing the entire system as a whole to ensure it meets functional and non-functional requirements. -> Operation and maintenance refer to the ongoing processes of managing, updating, and supporting a system or software solution to ensure it continues to function effectively and efficiently throughout its lifecycle.
- #11: Requirements Gathering: The development team meets with the client to understand the requirements for the website, including the purpose, features, and target audience. Design: Based on the requirements, the development team creates a design for the website, including the layout, color scheme, and overall look and feel. Implementation: Using the design as a guide, the development team begins coding the website, including the HTML, CSS, and JavaScript necessary for the site's functionality. Testing: Once the development is complete, the team conducts various testing activities to ensure that the website works as intended, including unit testing, integration testing, and system testing. Deployment: Once testing is complete and any necessary fixes have been made, the website is deployed to a production environment and made available to users. Maintenance: After deployment, the team provides ongoing maintenance and support for the website, including bug fixes, security updates, and feature enhancements as needed. Regenerate response
- #16: document-centric websites primarily focus on presenting and sharing information through documents.
- #21: Personalized services
- #22: Aims to
- #23: -> Increasing scope: As a website grows and evolves, its scope can expand, requiring new features and functionality. This can add complexity to the website's architecture and codebase, as well as to the development process itself. -> Integration with other systems: As websites become more integrated with other systems, such as databases, third-party APIs, and social media platforms, the complexity of the development process can increase. -> Mobile responsiveness: With the rise of mobile devices, websites need to be responsive and optimized for different screen sizes and devices. This can add complexity to the development process, particularly if the website was not designed with mobile responsiveness in mind from the beginning. -> Security Security: As websites become more complex and handle more sensitive data, the need for security measures also increases. This can add complexity to the development process, particularly if the website needs to comply with strict security regulations or standards.