Author SHA1 Message Date
Tirsvad 8776b30df3 Add README, screenshot and wiki in en, da and ms (MIL-003)
English comments / english-comments (pull_request) Successful in 26s
README from the framework template. Wiki pages Home, Getting-Started, Usage
and Development in English, Danish and Bahasa Malaysia with sidebar and
footer. Milestone links added to the Project Plan.

Task: MIL-003#1
Task: MIL-003#2
Task: MIL-003#3
Task: MIL-003#4
Task: MIL-003#5
2026-10-25 00:00:25 +08:00
Tirsvad baf05cb62b Merge pull request 'MIL-002 Movie page' (#14) from mil-002-movie-page into main
Publish accepted milestones / publish (push) Successful in 16s
TirSystem/github-action: Sync GitHub mirror metadata / sync-metadata (push) Successful in 9s
2026-10-24 17:58:37 +02:00
17 changed files with 540 additions and 89 deletions
+101 -1
View File
@@ -1,2 +1,102 @@
# 041-web-movie-ranking # 🚀 041 Web Movie Ranking
My solution to Day 41 of Udemy's "100 Days of Code: The Complete Python Pro Bootcamp": a plain HTML page that ranks my top 3 movies of all time. It is for fellow course participants and for anyone who browses the repository for ideas.
![The Best Movies According to Tirsvad][screenshot]
## 📚 Table of Contents
- [Overview](#-overview)
- [Requirements](#-requirements)
- [Setup](#-setup)
- [Run](#-run)
- [Tests](#-tests)
- [License](#-license)
- [Links](#-links)
- [Appendix: Project documents](#-appendix-project-documents)
## 🧭 Overview
"The Favorite Movie Project" asks for a web page with a title (`h1`), a subtitle (`h2`), a horizontal rule (`hr`), and at least three movies, each as an `h3` followed by a `p` that says why it is a favourite. This page has the title "The Best Movies According to Tirsvad" and ranks 13 element, 5th element and Drive.
The repository holds only HTML and CSS, with no dependencies:
- `src/index.html`: the page.
- `src/styles.css`: the typography and spacing.
- `tests/manual-checklist.md`: the checks that prove the page structure.
- `docs/`: the project documents and the wiki (English, Danish and Bahasa Malaysia).
## 📋 Requirements
A web browser. Nothing else is needed: there is no build step, no package to install and no server.
## 🛠️ Setup
Clone the repository:
```bash
git clone https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking.git
cd 041-web-movie-ranking
```
## ▶️ Run
Open `src/index.html` in a browser by double-clicking it, or from a terminal:
```bash
# Windows
start src/index.html
# macOS
open src/index.html
# Linux
xdg-open src/index.html
```
## 🧪 Tests
The tests are a manual checklist, because the whole product is one static page. Open `src/index.html`, then go through the items of [`tests/manual-checklist.md`](./tests/manual-checklist.md) (one `h1`, one `h2`, one `hr`, three `h3` each followed by a `p`, no external request, and a narrow window without sideways scroll).
## 📄 License
[GNU Affero General Public License v3.0][license].
## 🔗 Links
- [Repository][repository]
- [Documentation][documentation]
- [Issue tracker][issues]
## 📎 Appendix: Project documents
The documents a newcomer needs, in reading order.
| Document | What it tells you |
| --- | --- |
| [AGENTS.md][agents] | The rules AI agents follow in this repository |
| [Business Case][BC-001] | Why the project exists, its scope and success criteria |
| [Stakeholder Analysis][SA-001] | Who is involved; the stakeholder IDs used for owners and reviewers |
| [Project Plan][PP-001] | The gateways and their schedule |
| [Milestones][milestones] | One document per gateway: Go/No-Go criteria and tasks |
| [Artifact registry][registry] | Where each artifact type lives, the next version, the PO language and domain |
| [Traceability matrix][TM-001] | How the artifacts link and when each was last reviewed |
| [Framework README][framework-readme] | The framework this project uses |
| [Framework changelog][framework-changelog] | What changed in each framework release |
The workflows installed from `TirSystem/github-action` need these secrets in the organisation: `TOKEN_FOR_GITEA` (publish accepted milestones) and `TOKEN_FOR_GITEA_WIKI` (publish the wiki, which must be enabled in the repository settings).
---
[screenshot]: ./docs/images/favorite-movie-page.jpg
[license]: ./LICENSE
[repository]: https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking
[documentation]: https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/wiki
[issues]: https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/issues
[agents]: ./AGENTS.md
[BC-001]: ./docs/business-case.md
[SA-001]: ./docs/stakeholder-analysis.md
[PP-001]: ./docs/project-plan.md
[milestones]: ./docs/milestones/
[registry]: ./docs/artifact-registry.md
[TM-001]: ./docs/sqa/traceability-matrix.md
[framework-readme]: ./framework/README.md
[framework-changelog]: ./framework/CHANGELOG.md
Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

+3 -3
View File
@@ -31,9 +31,9 @@ This plan schedules the three gateways of the HTML-only Favorite Movie project o
| Gateway | Document | Window | Decision date | Owner | Stories | Main deliverable | Milestone | | Gateway | Document | Window | Decision date | Owner | Stories | Main deliverable | Milestone |
| --- | --- | --- | --- | --- | --- | --- | --- | | --- | --- | --- | --- | --- | --- | --- | --- |
| Foundation | [MIL-001] | 2026-10-24 to 2026-10-25 | 2026-10-25 | S01 | none | Folder skeleton, workflows, repository metadata | | | Foundation | [MIL-001] | 2026-10-24 to 2026-10-25 | 2026-10-25 | S01 | none | Folder skeleton, workflows, repository metadata | [Foundation](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/milestones/247) |
| Movie page | [MIL-002] | 2026-10-25 to 2026-10-26 | 2026-10-26 | S01 | none | index.html, styles.css, manual checklist | | | Movie page | [MIL-002] | 2026-10-25 to 2026-10-26 | 2026-10-26 | S01 | none | index.html, styles.css, manual checklist | [Movie page](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/milestones/248) |
| Documentation | [MIL-003] | 2026-10-26 to 2026-10-27 | 2026-10-27 | S01 | none | README, screenshots, wiki in en, da, ms | | | Documentation | [MIL-003] | 2026-10-26 to 2026-10-27 | 2026-10-27 | S01 | none | README, screenshots, wiki in en, da, ms | [Documentation](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/milestones/249) |
```plantuml ```plantuml
@startgantt @startgantt
+32
View File
@@ -0,0 +1,32 @@
[English](Development) · **Dansk** · [Bahasa Malaysia](Development-ms)
# Udvikling
## Mapper
| Mappe | Indhold |
| --- | --- |
| `src/` | `index.html` og `styles.css` |
| `tests/` | Den manuelle tjekliste |
| `docs/` | Business Case, interessentanalyse, projektplan, milepæle, gennemgangsnotater, billeder og denne wiki |
| `framework/` | SQA- og QC-rammeværket (et git-submodul, som ikke redigeres her) |
## Sådan foregår arbejdet
Projektet har tre milepæle: Foundation, Movie page og Documentation. Hver milepæl har sin egen gren og pull request, og hver opgave er en issue. En milepæl udgives til issue-systemet af et workflow, når dens dokument er godkendt med en `Go`-gennemgang.
## Workflows
Workflows kommer fra `TirSystem/github-action` (version `v2.2.0`):
| Workflow | Hvornår | Hvad det gør |
| --- | --- | --- |
| English comments | Pull request | Kontrollerer, at tilføjede kommentarer er på engelsk |
| Publish accepted milestones | Push til `main`, der ændrer milepæle eller gennemgange | Opretter milepæle og issues. Hemmelighed: `TOKEN_FOR_GITEA` |
| Publish wiki | Push til `main`, der ændrer `docs/wiki/` | Kopierer disse sider til wikien. Hemmelighed: `TOKEN_FOR_GITEA_WIKI` |
Python- og shell-kvalitetskontrollerne er ikke installeret, fordi repositoryet ikke har sådanne filer.
## Wikien
Wikien findes på engelsk, dansk og bahasa malaysia. Engelsk er den gældende tekst; de andre sprog følger den side for side (`Page.md`, `Page-da.md`, `Page-ms.md`).
+32
View File
@@ -0,0 +1,32 @@
[English](Development) · [Dansk](Development-da) · **Bahasa Malaysia**
# Pembangunan
## Folder
| Folder | Kandungan |
| --- | --- |
| `src/` | `index.html` dan `styles.css` |
| `tests/` | Senarai semak manual |
| `docs/` | Kes Perniagaan, Analisis Pihak Berkepentingan, Pelan Projek, pencapaian, rekod semakan, imej dan wiki ini |
| `framework/` | Rangka kerja SQA dan QC (submodul git, tidak diubah di sini) |
## Cara kerja dijalankan
Projek ini mempunyai tiga pencapaian: Foundation, Movie page dan Documentation. Setiap pencapaian mempunyai cabang dan pull request sendiri, dan setiap tugas ialah satu issue. Sesuatu pencapaian diterbitkan ke penjejak isu oleh satu workflow selepas dokumennya diterima dengan semakan `Go`.
## Workflow
Workflow datang daripada `TirSystem/github-action` (versi `v2.2.0`):
| Workflow | Bila | Fungsi |
| --- | --- | --- |
| English comments | Pull request | Menyemak bahawa komen yang ditambah dalam bahasa Inggeris |
| Publish accepted milestones | Push ke `main` yang mengubah pencapaian atau semakan | Mencipta pencapaian dan issue. Rahsia: `TOKEN_FOR_GITEA` |
| Publish wiki | Push ke `main` yang mengubah `docs/wiki/` | Menyalin halaman ini ke wiki. Rahsia: `TOKEN_FOR_GITEA_WIKI` |
Semakan kualiti Python dan shell tidak dipasang kerana repositori ini tiada fail sedemikian.
## Wiki
Wiki ini dalam bahasa Inggeris, Denmark dan Bahasa Malaysia. Bahasa Inggeris ialah teks utama; bahasa lain mengikutinya halaman demi halaman (`Page.md`, `Page-da.md`, `Page-ms.md`).
+32
View File
@@ -0,0 +1,32 @@
**English** · [Dansk](Development-da) · [Bahasa Malaysia](Development-ms)
# Development
## Folders
| Folder | Content |
| --- | --- |
| `src/` | `index.html` and `styles.css` |
| `tests/` | The manual checklist |
| `docs/` | Business Case, Stakeholder Analysis, Project Plan, milestones, review records, images and this wiki |
| `framework/` | The SQA and QC framework (a git submodule, not edited here) |
## How the work is done
The project has three milestones: Foundation, Movie page and Documentation. Each milestone has its own branch and pull request, and each task is an issue. A milestone is published to the issue tracker by a workflow after its document is accepted with a `Go` review.
## Workflows
The workflows come from `TirSystem/github-action` (version `v2.2.0`):
| Workflow | When | What it does |
| --- | --- | --- |
| English comments | Pull request | Checks that added comments are English |
| Publish accepted milestones | Push to `main` that changes milestones or reviews | Creates milestones and issues. Secret: `TOKEN_FOR_GITEA` |
| Publish wiki | Push to `main` that changes `docs/wiki/` | Copies these pages to the wiki. Secret: `TOKEN_FOR_GITEA_WIKI` |
The Python and shell quality checks are not installed, because the repository has no such files.
## The wiki
The wiki is in English, Danish and Bahasa Malaysia. English is the authoritative text; the other languages follow it page by page (`Page.md`, `Page-da.md`, `Page-ms.md`).
+31
View File
@@ -0,0 +1,31 @@
[English](Getting-Started) · **Dansk** · [Bahasa Malaysia](Getting-Started-ms)
# Kom i gang
## Krav
En webbrowser. Der er intet byggetrin, ingen pakke og ingen server.
## Hent filerne
```bash
git clone https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking.git
cd 041-web-movie-ranking
```
## Åbn siden
Dobbeltklik på `src/index.html`, eller kør en af disse kommandoer:
```bash
# Windows
start src/index.html
# macOS
open src/index.html
# Linux
xdg-open src/index.html
```
Du skulle gerne se siden nedenfor.
![Siden i en browser](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/raw/branch/main/docs/images/favorite-movie-page.jpg)
+31
View File
@@ -0,0 +1,31 @@
[English](Getting-Started) · [Dansk](Getting-Started-da) · **Bahasa Malaysia**
# Bermula
## Keperluan
Sebuah pelayar web. Tiada langkah binaan, tiada pakej dan tiada pelayan.
## Dapatkan fail
```bash
git clone https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking.git
cd 041-web-movie-ranking
```
## Buka halaman
Klik dua kali `src/index.html`, atau jalankan salah satu arahan ini:
```bash
# Windows
start src/index.html
# macOS
open src/index.html
# Linux
xdg-open src/index.html
```
Anda patut melihat halaman di bawah.
![Halaman dalam pelayar web](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/raw/branch/main/docs/images/favorite-movie-page.jpg)
+31
View File
@@ -0,0 +1,31 @@
**English** · [Dansk](Getting-Started-da) · [Bahasa Malaysia](Getting-Started-ms)
# Getting started
## Requirements
A web browser. There is no build step, no package and no server.
## Get the files
```bash
git clone https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking.git
cd 041-web-movie-ranking
```
## Open the page
Double-click `src/index.html`, or run one of these commands:
```bash
# Windows
start src/index.html
# macOS
open src/index.html
# Linux
xdg-open src/index.html
```
You should see the page below.
![The page in a browser](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/raw/branch/main/docs/images/favorite-movie-page.jpg)
+17
View File
@@ -0,0 +1,17 @@
[English](Home) · **Dansk** · [Bahasa Malaysia](Home-ms)
# Forside
En almindelig HTML-side, der rangerer mine 3 bedste film nogensinde. Det er min løsning på dag 41 i Udemys "100 Days of Code: The Complete Python Pro Bootcamp", projektet "The Favorite Movie Project".
![The Best Movies According to Tirsvad](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/raw/branch/main/docs/images/favorite-movie-page.jpg)
Siden har en titel (`h1`), en undertitel (`h2`), en vandret streg (`hr`) og tre film, hver som en `h3` efterfulgt af en `p` med begrundelsen. Der er ingen kode at bygge, og intet skal installeres.
Sider:
- [Kom i gang](Getting-Started-da): åbn siden i en browser.
- [Brug](Usage-da): hvad der står på siden, og hvordan du ændrer filmene.
- [Udvikling](Development-da): mapper, kontroller, grene og workflows.
Repository: <https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking>
+17
View File
@@ -0,0 +1,17 @@
[English](Home) · [Dansk](Home-da) · **Bahasa Malaysia**
# Laman Utama
Satu halaman HTML biasa yang menyusun 3 filem terbaik saya sepanjang zaman. Ini penyelesaian saya untuk Hari 41 kursus Udemy "100 Days of Code: The Complete Python Pro Bootcamp", projek "The Favorite Movie Project".
![The Best Movies According to Tirsvad](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/raw/branch/main/docs/images/favorite-movie-page.jpg)
Halaman ini mempunyai tajuk (`h1`), subtajuk (`h2`), garis mendatar (`hr`) dan tiga filem, setiap satu sebagai `h3` diikuti `p` yang memberi sebabnya. Tiada kod untuk dibina dan tiada apa yang perlu dipasang.
Halaman:
- [Bermula](Getting-Started-ms): buka halaman dalam pelayar web.
- [Penggunaan](Usage-ms): apa yang ada pada halaman dan cara menukar filem.
- [Pembangunan](Development-ms): folder, semakan, cabang dan workflow.
Repositori: <https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking>
+17
View File
@@ -0,0 +1,17 @@
**English** · [Dansk](Home-da) · [Bahasa Malaysia](Home-ms)
# Home
A plain HTML page that ranks my top 3 movies of all time. It is my solution to Day 41 of Udemy's "100 Days of Code: The Complete Python Pro Bootcamp", the project "The Favorite Movie Project".
![The Best Movies According to Tirsvad](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking/raw/branch/main/docs/images/favorite-movie-page.jpg)
The page has a title (`h1`), a subtitle (`h2`), a horizontal rule (`hr`), and three movies, each an `h3` followed by a `p` with the reason. There is no code to build and nothing to install.
Pages:
- [Getting started](Getting-Started): open the page in a browser.
- [Usage](Usage): what is on the page and how to change the movies.
- [Development](Development): folders, checks, branches and workflows.
Repository: <https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking>
+30
View File
@@ -0,0 +1,30 @@
[English](Usage) · **Dansk** · [Bahasa Malaysia](Usage-ms)
# Brug
## Hvad der står på siden
| Element | Tekst |
| --- | --- |
| `h1` | The Best Movies According to Tirsvad |
| `h2` | My top 3 movies of all-time. |
| `hr` | En vandret streg |
| `h3` og `p` (tre gange) | 13 element, 5th element, Drive, hver med en kort begrundelse |
## Ændr filmene
Åbn `src/index.html` i en teksteditor og ret parrene af `h3` og `p`. Lad hver `p` stå lige efter sin `h3`:
```html
<h1>The Best Movies According to Tirsvad</h1>
<h2>My top 3 movies of all-time.</h2>
<hr>
<h3>13 element</h3>
<p>This is my favourite anime. I love the beautiful images.</p>
```
Gem filen og genindlæs browseren.
## Kontrollér siden
Gå `tests/manual-checklist.md` igennem: én `h1`, én `h2`, én `hr`, tre `h3` hver efterfulgt af en `p`, ingen eksterne forespørgsler og ingen sidelæns rulning i et smalt vindue.
+30
View File
@@ -0,0 +1,30 @@
[English](Usage) · [Dansk](Usage-da) · **Bahasa Malaysia**
# Penggunaan
## Apa yang ada pada halaman
| Elemen | Teks |
| --- | --- |
| `h1` | The Best Movies According to Tirsvad |
| `h2` | My top 3 movies of all-time. |
| `hr` | Garis mendatar |
| `h3` dan `p` (tiga kali) | 13 element, 5th element, Drive, masing-masing dengan sebab yang ringkas |
## Tukar filem
Buka `src/index.html` dalam penyunting teks dan ubah pasangan `h3` dan `p`. Pastikan setiap `p` berada tepat selepas `h3`nya:
```html
<h1>The Best Movies According to Tirsvad</h1>
<h2>My top 3 movies of all-time.</h2>
<hr>
<h3>13 element</h3>
<p>This is my favourite anime. I love the beautiful images.</p>
```
Simpan fail dan muat semula pelayar web.
## Semak halaman
Ikut senarai semak `tests/manual-checklist.md`: satu `h1`, satu `h2`, satu `hr`, tiga `h3` yang masing-masing diikuti `p`, tiada permintaan luaran dan tiada tatal ke sisi dalam tetingkap sempit.
+30
View File
@@ -0,0 +1,30 @@
**English** · [Dansk](Usage-da) · [Bahasa Malaysia](Usage-ms)
# Usage
## What is on the page
| Element | Text |
| --- | --- |
| `h1` | The Best Movies According to Tirsvad |
| `h2` | My top 3 movies of all-time. |
| `hr` | A horizontal rule |
| `h3` and `p` (three times) | 13 element, 5th element, Drive, each with a short reason |
## Change the movies
Open `src/index.html` in a text editor and edit the `h3` and `p` pairs. Keep each `p` directly after its `h3`:
```html
<h1>The Best Movies According to Tirsvad</h1>
<h2>My top 3 movies of all-time.</h2>
<hr>
<h3>13 element</h3>
<p>This is my favourite anime. I love the beautiful images.</p>
```
Save the file and reload the browser.
## Check the page
Go through `tests/manual-checklist.md`: one `h1`, one `h2`, one `hr`, three `h3` each followed by a `p`, no external request, and no sideways scroll in a narrow window.
+1
View File
@@ -0,0 +1 @@
[Repository](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/041-web-movie-ranking) · AGPL-3.0
+20
View File
@@ -0,0 +1,20 @@
**English**
- [Home](Home)
- [Getting started](Getting-Started)
- [Usage](Usage)
- [Development](Development)
**Dansk**
- [Forside](Home-da)
- [Kom i gang](Getting-Started-da)
- [Brug](Usage-da)
- [Udvikling](Development-da)
**Bahasa Malaysia**
- [Laman Utama](Home-ms)
- [Bermula](Getting-Started-ms)
- [Penggunaan](Usage-ms)
- [Pembangunan](Development-ms)