-atom-coderoad:

title:Atom-CodeRoad

href:/atom-coderoad.html

image:

id:atom-coderoad

href:atom-coderoad-demo

alt:Atom-CodeRoad Demo

src:images/demos/atom-coderoad.jpg

video:

src:DbLpdgrYVOU

height:328px

width:574px

categories:

title:Builder-CodeRoad

href:/builder-coderoad.html

image:

id:builder-coderoad

href:builder-coderoad-demo

alt:Builder-CodeRoad Demo

src:images/demos/builder-demo.jpg

height:328px

width:574px

id:tutorial-overview

alt:CodeRoad Tutorial Overview

src:images/landing/elements.svg

height:300px

width:300px

categories:

-features

Build tutorials using simple and familiar tools:[Markdown](//www.markdowntutorial.com/) &unit tests. Making tutorials is easy with the new"builder-coderoad" plugin.

Build tutorials using simple and familiar tools:**Markdown** &**Unit Tests**. Making tutorials is easy with the newBuilder-CodeRoad plugin.

{% if feature.image.href %}

<aid="{{feature.image.id}}"href="#{{feature.image.href}}"class="modal-link">

{% endif %}

{% if feature.image %}

class="lazy"

alt="{{feature.image.alt}}"

src="{{feature.image.src}}"

height="{{feature.image.height}}"

width="{{feature.image.height}}"

{% endif %}

{% if feature.video.src %}

width="{{feature.video.width}}"

height="{{feature.video.height}}"

src="https://www.youtube.com/embed/{{feature.video.src}}"

frameborder="0"

{% endif %}

{% if feature.image.href %}

{% endif %}

<li><ahref="/overview.html"class="button fit">Overview</a></li>

{% include modal.html id="atom-coderoad-demo" title="Atom-CodeRoad" image="atom-coderoad.gif" %}

{% include modal.html id="builder-coderoad-demo" title="Builder-CodeRoad" image="builder-demo.gif" %}