| Table of Contents | ||||
|---|---|---|---|---|
|
...
The basic idea is that we will create essentially a single string that consists of the HTML webpage code. We will utilize a combination of Prolog, HTML and Bootstrap to generate the code for dynamic webpages. Prolog rules are used to generate our HTML code. In other words, the HTML code represented as a Prolog atom, essentially a string, is manipulated with Prolog. So what does that look like? We will first take a look at how to construct some very basic HTML code, then explain how we can add more complicated HTML code that is also using Bootstrap components, and, finally, how we can piece together these components into a complete webpage.
Generating basic HTML elements with short tags
An HTML page consists of HTML elements. HTML elements consists of HTML tags that are used to organize content on that page. Tags often come in pairs of a start and end tag. Basic HTML tags, for example, are the tags <p>YOUR PARAGRAPH TEXT HERE</p> that defines an HTML paragraph, the <h1>...</h1> defining a large heading, <b>...</b> defining bold text, etc. There are many of these basic tags which, moreover, are also short which facilitates their frequent and easy use. The idea to generate basic HTML code for these elements in Prolog is very simple: Simply use single quotes '...' to generate such an element. The table next lists a few simple examples:
HTML Element | HTML code | Prolog code (single quoted atom) |
|---|---|---|
Large heading |
|
|
Paragraph |
|
|
Bold text |
|
|
| Note |
|---|
It is very important to use the right quote symbol in your code. For example, |
There are many simply simple, short tags where it is easiest to simply put them between single quotes to create a Prolog atom for generating the corresponding HTML code. Similarly, Another class of short tags are the single tags such as '<br>' for breaking a line and '<hr>' for adding a horizontal line can be simply . These are also most easily generated by simply quoting them.
Generating more complicated HTML elements
...
By means of these and generate with the rule. The HTML code is represented in Bootstrap format, which is also clearly illustrated by examples below or on Bootstrap's documentation website (Bootstrap Documentation).
| Note |
|---|
Prolog Advice: To manipulate strings and atoms in Prolog it is useful to look at documentation of the following built-in functions: atomic_list_concat, atom_concat, string_concat, append, and maplist here: https://www.swi-prolog.org/. The predicate applyTemplate is a defined predicate that will be explained below. |
...