An easy way to communicate

I'm a little nervous about offering you simple interfaces, but I'm very good at it. Simplicity can often hide good integrations and high-quality, fast interaction of services.
If you look at open source products like PostgreSQL/Swagger/React it's very easy to understand how the systems work without having to get a job working in a company working on commercial software.

<h1>Canvas and Slider</h1>

<canvas id="d1" class="aquaback"></canvas>

<input type="color" value="#8B0000"; id="clr" onchange="docolor()">

<input type="range" min="10" max="100" value="10" id="slr" oninput=dosquare()>

All objects that can be managed on the web are described in HTML, the structure of which resembles XML (I wrote about it earlier) and JSON (I will write about it later).

Basically, knowing the structure of HTML:

1. How memory area headers and opening/closing symbols are formed
2. The nesting structure of certain objects/data types
3. Possibilities to place characteristics and type of the object inside the description of the object

You can easily handle XML and JSON when systems interact via API.

API is not the simplest, but in my opinion a successful (compared to brokers) type of data transport. There is also the ESB data bus, but the base is API.

 <div>
      <h1>My interests</h1>
    <h3 id="TitleText"> Hello! My name is <b>Kate</b> and here I want to tell you about my interests.</h3>
  <div>
    <h1>Let's start!</h1>
    <ol>
      <li  class="boxdiv">
    <h3>Danсing</h3>
    <p>...
      <ul> <p>
      <li>  <a href="https://www.belcanto.ru/ballet_classic.html">classical dance</a>
        </li>
        <li> <a href="https://www.belcanto.ru/narodny_tanec.html">folk dance</a>
        </li>
        <li> <a href="https://ru.wikiversity.org/wiki/%D0%93%D0%B8%D0%BC%D0%BD%D0%B0%D1%81%D1%82%D0%B8%D0%BA%D0%B0">gymnastics</a>
        </li>
         </p>
        </ul>
    <img src="https://obrmos.ru/do/do_dance/Im/cl_chor.jpg" width="150px" height="70px">
      </li>

Working with indents is important when describing a web page. There're cooler graphic editors, but we are talking about programming here...
Useful links that can help you: there are now excellent tutorials on open source software. You can install the software and open the basic documentation to perform operations with your program.
It seems that everything has already been done so that people can comfortably explore new things!