Wpis ten ma na celu przedstawić jedno z narzędzi JavaScript, pozwalające w łatwy sposób dostarczać i wyświetlać dane na stronach internetowych: AppML
1. Co to jest AppML?
AppML oznacza język modelowania aplikacji. Może działać na dowolnej stronie HTML, bez instalacji. Pozwala w łatwy sposób wprowadzić dane do aplikacji HTML z obiektów JavaScript, plików lub baz danych.
2. Przykład wykorzystania
Aby móc korzystać z AppML, musimy dołączyć do naszej strony skrypt https://www.w3schools.com/appml/2.0.3/appml.js
Załóżmy, że mamy następujący plik z danymi zapisanymi jako obiekt w pliku js o nazwie baza.js:
{"wpisy":[
{"imie":"Jan Kowalski","miasto":"Warszawa","kraj":"Polska"},
{"imie":"Johny English","miasto":"Londyn","kraj":"Wielka Brytania"},
{"imie":"April Ryan","miasto":"Nowy Jork","kraj":"USA"}
]
}
Tak może wyglądać szablon naszego dokumentu html:
<!DOCTYPE html>
<html lang="pl">
<script src="https://www.w3schools.com/appml/2.0.3/appml.js"></script>
<body>
<table appml-data="baza.js">
<tr>
<th>Imię</th>
<th>Miasto</th>
<th>Kraj</th>
</tr>
<tr appml-repeat="wpisy">
<td>{{imie}}</td>
<td>{{miasto}}</td>
<td>{{kraj}}</td>
</tr>
</table>
</body>
</html>
Po otworzeniu pliku w przeglądarce zobaczymy tabelkę z uzupełnionymi danymi z pliku baza.js czyli takie coś:
| Imię | Miasto | Kraj |
|---|---|---|
| Jan Kowalski | Warszawa | Polska |
| Johny English | Londyn | Wielka Brytania |
| April Ryan | Nowy Jork | USA |
3. Podsumowanie
Jak widać, jest to proste narzędzie, ale z naprawdę olbrzymi możliwościami! Jeszcze nie miałem okazji sam go używać, ale kto wie, może w niedalekiej przyszłości… 🙂
Wpis został oparty o artykuł ze strony https://www.w3schools.com/appml/default.asp