More Text-Based Formats#
There are many more formats that are just some variation of plain text with some structure. I want to mention the following ones very superficially because they come up a lot. It is worth to at least know they exist and maybe how they look.
HTML — Hypertext Markup Language#
This one is very dear to my heart. I write and read this all the time. In fact you are currently reading this, because this is what makes the whole world wide web tick. We used to use it for documents only, but now it powers whole web applications. HTML is made up of "tags" like <title>
and these can go around other pieces information like this:
<title>ER-T1 Text-Based Formats</title>
A full (but short) example of an HTML document looks like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>This title goes in the browser tab</title>
</head>
<body>
<h1>This is a headline</h1>
<p>This is some text</p>
</body>
</html>
XML — HTML's cousin for data#
XML looks extremely similar to HTML, because it was derived from HTML. It has a much stricter specification and is often used for data storage or transfer. If you have ever used SVG, this is a file format based on XML. If you have ever used LibreOffice or Microsoft Office (in the past 15 years) their file formats are based on XML. In fact there are literally over 200 well known file formats and languages that are based on XML. In XML you make up your own tags as you see fit.
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="391" height="391" viewBox="-70.5 -70.5 391 391" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect fill="#fff" stroke="#000" x="-70" y="-70" width="390" height="390"/>
<g opacity="0.8">
<rect x="25" y="25" width="200" height="200" fill="lime" stroke-width="4" stroke="pink" />
<circle cx="125" cy="125" r="75" fill="orange" />
<polyline points="50,150 50,200 200,200 200,100" stroke="red" stroke-width="4" fill="none" />
<line x1="50" y1="50" x2="200" y2="200" stroke="blue" stroke-width="4" />
</g>
</svg>
(example above was taken from Wikipedia)
YAML — Yet Another Markup Language#
This might be interesting to you because it is what Unity3d uses to store its scenes. It is also a common format for configuration files. It looks a little bit like JSON but without the curly braces.
Indentation Matters
In Java and JSON, I often urge you to use indentation correctly to help everyone see how the code is structured. In YAML, this indentation is what makes the whole format work. Instead of curly braces, the actual indentation - yes, the white space - is used to parse the document.
site_name: 2023-WS ER-T1 SD
site_url: https://docs.claudiuscoenen.de/2023-WS-ER-T1-SD/
extra:
# footer buttons
social:
- name: Moodle
icon: fontawesome/solid/graduation-cap
link: https://lernen.h-da.de/course/view.php?id=21136
- name: Gitlab
icon: simple/gitlab
link: https://code.fbi.h-da.de
- name: BBB
icon: simple/bigbluebutton
link: https://rooms.h-da.de/r?room=F18%2F014
- name: Chat (Matrix)
icon: simple/matrix
link: https://chat.fbi.h-da.de/#/room/#2023-ws-er-t1-sd:matrix.fbi.h-da.de
- name: Updates via RSS
icon: simple/rss
link: /feed_rss_updated.xml
This is an actual excerpt from the config file powering this website.