| 1 | --- |
| 2 | title: Full Example |
| 3 | --- |
| 4 | import Chart from "./chart.marko"; |
| 5 | static const year = 2026; |
| 6 | export const slug = "full-example"; |
| 7 | |
| 8 | // Page starts here |
| 9 | |
| 10 | # ${title} |
| 11 | |
| 12 | This is a **complete** example of *markodown* featuring ${year}. |
| 13 | |
| 14 | server { |
| 15 | const data = await fetchData(); |
| 16 | } |
| 17 | |
| 18 | <if=data> |
| 19 | |
| 20 | ## Chart |
| 21 | |
| 22 | <Chart data=data year=year /> |
| 23 | |
| 24 | <for|point| of=data.points> |
| 25 | |
| 26 | - **${point.label}**: ${point.value} |
| 27 | |
| 28 | </for> |
| 29 | </if> |
| 30 | <else> |
| 31 | No data available. Visit <https://example.com> for help. |
| 32 | </else> |
| 33 | |
| 34 | <div#footer.site-footer> |
| 35 | <app-footer year=year /> |
| 36 | </div> |