danhollick

<StackPanel ItemSpacing="20" ux:Class="MyFirstClass">
  <string ux:Property="HeadlineText"/>
  <Text FontSize="24" TextColor="#0006" Value="{Property    
   HeadlineText}" />
  <Text FontSize="16" TextColor="#0004" Value="This is a sub-
   heading. It can be much longer and wrap over two lines 
   sometimes." TextWrapping="Wrap" /> 
</StackPanel>

danhollick

<Text FontSize="24" TextColor="#0006" Value="{Property HeadlineText}" />

danhollick

<MyFirstClass HeadlineText="Woah, they can be different everytime? "/>
<MyFirstClass HeadlineText="Hey, this is neat"/>

danhollick

Fruits: [
      { type: "Apple" },
      { type: "Orange" },
      { type: "Pear" },
      { type: "Banana" },
      { type: "Plum"}
    ]

danhollick

Fruits: [
  {
    type: "Apple",
    subtypes: [
      "GrannySmith",
      "Crab",
      "Red",
      "Toffee"
     ]
  },

danhollick

<JavaScript>
    module.exports = {
    };
 </JavaScript>

danhollick

<JavaScript >
module.exports = { 
    Fruits: [
      { type: "Apple" },
      { type: "Orange" },
      { type: "Pear" },
      { type: "Banana" },
      { type: "Plum"}
    ]
 }

danhollick

<Grid Alignment="Center" CellSpacing="10">
  <Each Items="{Fruits}">
    <Text Value="{type}"/>
  </Each>
</Grid>

danhollick

<JavaScript >
module.exports = { 
    Fruits: [
      { type: "Apple" },
      { type: "Orange" },
      { type: "Pear" },
      { type: "Banana" },
      { type: "Plum"}
    ]
 }

danhollick

<Grid Alignment="Center" CellSpacing="10" >
  <Each Items="{Fruits}">
    <Text Value="{type}" />
  </Each>
</Grid>