Web Applications with Javascript or Java

Volume 1: Constraint Validation, Enumerations, Special Datatypes

Gerd Wagner, Mircea Diaconescu

• Publisher: De Gruyter Oldenbourg
• Year: 2017
• Print ISBN: 9783110499933
• eBook ISBN: 9783110497243
• Edition: 1
• Topic: Computer Science
• Subtopic: Information Management
• Index: Computer Science

Today, web applications are the most important type of software applications. This textbook shows how to design and implement them, using a model-based engineering approach that covers general information management concepts and techniques and the two most relevant technology platforms: JavaScript and Java. The book provides an in-depth tutorial for theory-underpinned and example-based learning by doing it yourself, supported by quiz questions and practice projects. Volume 1 provides an introduction to web technologies and model-based web application engineering, discussing the information management concepts of constraint-based data validation, enumerations and special datatypes. Volume 2 discusses the advanced information management concepts of associations and inheritance in class hierarchies.

Web apps are designed using UML class diagrams and implemented with two technologies: JavaScript for front-end (and distributed NodeJS) apps, and Java (with JPA and JSF) for back-end apps. The six example apps discussed in the book can be run, and their source code downloaded, from the book's website.

Gerd Wagner

is Professor of Internet Technology at Brandenburg University of Technology, Germany, and Adjunct Associate Professor at Old Dominion University, Norfolk, VA, USA. He works in the areas of web engineering and modeling and simulation.

Mircea Diaconescu

is a Software Architect and Technical Team Leader at Entri GmbH, Berlin. He enjoys to work with the newest web technologies and to build Web of Things projects. Java, JavaScript/NodeJS and C# are his favorite programming languages.

Part IGetting Started

In this first part of the book we provide a brief introduction to the Web and show how to build

1. a simple front-end web app using plain JavaScript and local storage,
2. a simple back-end web app using Java with JSF, JPA and a MySQL/MariaDB database.

We also provide brief introductions to information modeling and to software application architectures.

The minimal examples of data management apps discussed in this part of the book only include a minimum of the overall functionality required for a complete app. They take care of only one object type (“books”) and support the four standard data management use cases (Create/Retrieve/Update/Delete), but they need to be extended by adding further important parts of an app’s overall functionality.

1A Quick Tour of the Foundations of Web Apps

If you are already familiar with HTML, XML and JavaScript, you may skip this chapter and immediately start developing a minimal web application by going to the next chapter.

1.1The World Wide Web (WWW)

After the Internet had been established in the 1980’ies, Tim Berners-Lee4 developed the idea and the first implementation of the WWW in 1989 at the European research institution CERN in Geneva, Switzerland. The WWW (or, simply, “the Web”) is based on the Internet technologies TCP/IP (the Internet Protocol) and DNS (the Domain Name System). Initially, the Web consisted of

1. the Hypertext Transfer Protocol (HTTP),
2. the Hypertext Markup Language (HTML), and
3. web server programs, acting as HTTP servers, as well as web ’user agents’ (such as browsers), acting as HTTP clients.

Later, further important technology components have been added to this set of basic web technologies:

–the page/document style language Cascading Style Sheets (CSS) in 1995,

–the web programming language JavaScript in 1995,

–the Extensible Markup Language (XML), as the basis of web formats (like SVG and RDF/XML), in 1998,

–the XML-based Scalable Vector Graphics (SVG) format in 2001,

–the Resource Description Framework (RDF) for knowledge representation on the Web in 2004.

1.2HTML and XML

HTML allows to mark up (or describe) the structure of a human-readable web document or web user interface, while XML allows to mark up the structure of all kinds of documents, data files and messages, whether they are human-readable or not. XML can also be used as the basis for defining a version of HTML that is called XHTML.

1.2.1XML documents

XML provides a syntax for expressing structured information in the form of an XML document with nested elements and their attributes. The specific elements and attributes used in an XML document can come from any vocabulary, such as public standards or (private) user-defined XML formats. XML is used for specifying

–document formats, such as XHTML5, the Scalable Vector Graphics (SVG) format or the DocBook format,

–data interchange file formats, such as the Mathematical Markup Language (MathML) or the Universal Business Language (UBL),

–message formats, such as the web service message format SOAP5

1.2.2Unicode and UTF-8

XML is based on Unicode, which is a platform-independent character set that includes almost all characters from most of the world’s script languages including Hindi, Burmese and Gaelic. Each character is assigned a unique integer code in the range between 0 and 1,114,111. For example, the Greek letter π has the code 960, so it can be inserted in an XML document as π using the XML entity syntax.

Unicode includes legacy character sets like ASCII and ISO-8859–1 (Latin-1) as subsets.

The default encoding of an XML document is UTF-8, which uses only a single byte for ASCII characters, but three bytes for less common characters.

Almost all Unicode characters are legal in a well-formed XML document. Illegal characters are the control characters with code 0 through 31, except for the carriage return, line feed and tab. It is therefore dangerous to copy text from another (non-XML) text to an XML document (often, the form feed character creates a problem).

1.2.3XML namespaces

Generally, namespaces help to avoid name conflicts. They allow to reuse the same (local) name in different namespace contexts. Many computational languages have some form of namespace concept, for instance, Java and PHP.

XML namespaces are identified with the help of a namespace URI, such as the SVG namespace URI “ http://www.w3.org/2000/svg”, which is associated with a namespace prefix, such as svg. Such a namespace represents a collection of names, both for elements and attributes, and allows namespace-qualified names of the form prefix:name, such as svg:circle as a namespace-qualified name for SVG circle elements.

A default namespace is declared in the start tag of an element in the following way:

This example shows the start tag of the HTML root element, in which the XHTML namespace is declared as the default namespace.

The following example shows an SVG namespace declaration for an svg element embedded in an HTML document:

1.2.4Corre...

Table of contents

• Cover
• Title Page
• Copyright
• Dedication
• Contents
• Foreword
• List of Figures
• List of Tables
• Part I Getting Started
• Part II Constraint Validation
• Part III Enumerations
• Part IV Special Datatypes and Derived Properties
• Glossary
• Index