Wikiversity

Applied Programming/Web Design

< Applied Programming

This lesson provides a brief introduction to the website design side of GUI.

Objectives and Skills

edit

Objectives and skills for this lesson include:

  • Generate a web page
  • Manage widgets for the web page
  • Run a web page with a local host

Readings

edit
  1. Wikipedia: Web application development

Multimedia

edit
  1. YouTube: HTML Basics
  2. YouTube: HTML Styles
  3. YouTube: Flask for Beginners Tutorial
  4. YouTube: Python Flask Tutorial: Full-Featured Web App Part 1 - Getting Started
  5. YouTube: Simple Python Web Server

Examples

edit

Activities

edit
  1. Extend one of the programs developed in this course by generating the output as a web page rather than a console application. Use command-line parameters for any required input.

Lesson Summary

edit
  • Web application development is the process of developing web applications that run in a web browser. Applications like Gmail, Outlook, WhatsApp, and even E-Commerce websites are good examples.[1]
  • As with most other programming languages, Web Application Development can be done with something as simple as a text editor.[1]
  • Many web application tools support the Java programming language.[1]
  • Web applications undergo the same unit, integration and system testing as traditional desktop applications. But because web application clients vary so greatly, teams might perform some additional testing, such as:[1]
    • Security[1]
    • Performance, Load, and Stress[1]
    • HTML/CSS validation[1]
    • Accessibility[1]
    • Usability[1]
    • Cross-browser[1]
    • Many types of tests are automatable, additionally, an organization can create its own unit testing framework.[1]
  • Practicing code reuse and using web application frameworks can greatly improve both productivity and time to market (McConnell 1996:537). Reusing externally developed components can allow an organization to reap the above benefits, while potentially saving money.[1]

Key Terms

edit
API
An API is a means to communicate between two or more components of software. API interfaces make it easier for developers to use certain technologies in building applications.[2]
CLI
Command-line interface, the program is composed purely of textual content.[3]
Client
A piece of computer hardware or software that accesses a service made available by a server. Web application clients vary greatly and this warrants extended forms of testing.[4]
GUI
Graphical user interface, the program is composed of interactive widgets.[5]
GUI wrapper
Graphical user interface wrappers circumvent the command-line interface versions of (typically) Linux and Unix-like software applications. Applications may also provide both interfaces, and when they do the GUI is usually a WIMP wrapper around the command-line version.[5]
integration testing
A phase in software testing in which individual software modules are combined and tested as a group.[6]
post-WIMP interface
As of 2011, some touchscreen-based operating systems such as Apple's iOS and Android use the class of GUIs named post-WIMP. These support styles of interaction using more than one finger in contact with a display, which allows actions such as pinching and rotating, which are unsupported by one pointer and mouse.[5]
skin
Refers to the appearance of a program's interface.[5]
system testing
Testing conducted on a complete, integrated system to evaluate the system's compliance with its specified requirements.[7]
unit testing
A phase of software testing where individual units of a software are tested to determine whether they are fit for use.[8]
widget
A vessel for human-computer interaction that is characteristic of a GUI;a widget could be a button, a check box, a text box, etc.[9]
WIMP
Stands for "Windows, Icons, Menus, Pointer." which describes the graphical user interface (GUI) of personal computers.[5]
window
A graphical control element which consists of a visual area containing some of the graphical user interface of the program it belongs to and is framed by window decoration.[10]
Workbench
provides the user with a graphical interface to work with file systems and launch applications. It uses a workbench metaphor (in place of the more common desktop metaphor) for representing file system organisation.[11]
web framework
A structure support of web applications, libraries, APIs, and compilers to streamline the creation of new software.[12]
web application
A client-server program that runs in a web browser.[13]
web application development
The process and practice of developing web applications.[1]

See Also

edit

References

edit
  1. ↑ 1.00 1.01 1.02 1.03 1.04 1.05 1.06 1.07 1.08 1.09 1.10 1.11 1.12 Wikipedia: Web application development
  2. ↑ "Application programming interface". Wikipedia. 2018-07-19. https://en.wikipedia.org/w/index.php?title=Application_programming_interface&oldid=850975267. 
  3. ↑ Wikipedia: Command-line interface
  4. ↑ "Client (computing)". Wikipedia. 2018-06-03. https://en.wikipedia.org/w/index.php?title=Client_(computing)&oldid=844165126. 
  5. ↑ 5.0 5.1 5.2 5.3 5.4 Wikipedia: Graphical user interface
  6. ↑ Wikipedia: Integration testing
  7. ↑ Wikipedia: System testing
  8. ↑ Wikipedia: Unit testing
  9. ↑ Wikipedia: Widget (GUI)
  10. ↑ Wikipedia: Window (computing)
  11. ↑ Wikipedia: Workbench (AmigaOS)
  12. ↑ Wikipedia: Web framework
  13. ↑ Wikipedia: Web application
Retrieved from "https://en.wikiversity.org/w/index.php?title=Applied_Programming/Web_Design&oldid=2468895"