use same images for all guide
|
@ -5,7 +5,7 @@
|
||||||
based on state. The final UI looks like this:
|
based on state. The final UI looks like this:
|
||||||
|
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src='displaying-data-example1.png')
|
img(src='/resources/images/examples/displaying-data-example1.png' alt="Example of Todo App")
|
||||||
|
|
||||||
.l-main-section
|
.l-main-section
|
||||||
h2#section-create-an-entry-point Create entry points and pubspec
|
h2#section-create-an-entry-point Create entry points and pubspec
|
||||||
|
|
|
@ -124,7 +124,7 @@
|
||||||
You should see something like this:
|
You should see something like this:
|
||||||
|
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src='setup-example1.png')
|
img(src='/resources/images/examples/setup-example1.png' alt="Example of Todo App")
|
||||||
|
|
||||||
.l-main-section
|
.l-main-section
|
||||||
h2#section-explanations Explanations
|
h2#section-explanations Explanations
|
||||||
|
|
Before Width: | Height: | Size: 19 KiB |
|
@ -32,7 +32,7 @@
|
||||||
Let's do something a little more complex, where the user enters items
|
Let's do something a little more complex, where the user enters items
|
||||||
that the app adds to a list:
|
that the app adds to a list:
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src='user-input-example1.png')
|
img(src='/resources/images/examples/user-input-example1.png' alt="Example of Todo App")
|
||||||
|
|
||||||
|
|
||||||
.l-main-section
|
.l-main-section
|
||||||
|
|
Before Width: | Height: | Size: 12 KiB |
|
@ -8,7 +8,7 @@
|
||||||
based on state. We'll end up with a UI that looks like this:
|
based on state. We'll end up with a UI that looks like this:
|
||||||
|
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src='displaying-data-example1.png')
|
img(src='/resources/images/examples/displaying-data-example1.png' alt="Example of Todo App")
|
||||||
|
|
||||||
.callout.is-helpful
|
.callout.is-helpful
|
||||||
header Typescript vs ES5
|
header Typescript vs ES5
|
||||||
|
|
Before Width: | Height: | Size: 8.4 KiB |
|
@ -125,8 +125,9 @@
|
||||||
|
|
||||||
p.
|
p.
|
||||||
Open <code>index.html</code> through your web server and you should see:
|
Open <code>index.html</code> through your web server and you should see:
|
||||||
div(align='center')
|
|
||||||
img(src='setup-example1.png')
|
figure.image-display
|
||||||
|
img(src='/resources/images/examples/setup-example1.png' alt="Example of Todo App")
|
||||||
|
|
||||||
.l-main-section
|
.l-main-section
|
||||||
h2#section-explanations Explanations
|
h2#section-explanations Explanations
|
||||||
|
|
|
@ -24,8 +24,9 @@
|
||||||
event. And the <code>{{myname.value}}</code> binds the text node of the <code><p></code> element to the
|
event. And the <code>{{myname.value}}</code> binds the text node of the <code><p></code> element to the
|
||||||
input's value property.
|
input's value property.
|
||||||
p Let's do something a little more complex where users enter items and add them to a list like this:
|
p Let's do something a little more complex where users enter items and add them to a list like this:
|
||||||
|
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src='user-input-example1.png')
|
img(src='/resources/images/examples/user-input-example1.png' alt="Example of Todo App")
|
||||||
|
|
||||||
|
|
||||||
.l-ain-section
|
.l-ain-section
|
||||||
|
|
Before Width: | Height: | Size: 6.5 KiB After Width: | Height: | Size: 6.5 KiB |
Before Width: | Height: | Size: 8.4 KiB After Width: | Height: | Size: 8.4 KiB |
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |