Objectives

A few sentences on the purpose of the lab. Avoid bullet points here for formatting reasons. The title of the lab is taken from the name of this step.

Text

It's very easy to make some words bold and other words italic with Markdown. You can even inset a link to Google

Lists

Sometimes you want numbered lists:

1. One
2. Two
3. Three

Sometimes you want bullet points:

• Start a line with a star
• Profit!

Alternatively,

• Dashes work just as well
• And if you have sub points, put two spaces before the dash or star:
  • Like this
  • And this

Images

If you want a link to a local image, place the image in the img folder and then insert a link like this:

Alternatively you can directly link to images on the web:

The above includes a title.

Structured documents

Sometimes it's useful to have different levels of headings to structure your documents. Start lines with a # to create headings. Multiple ## in a row denote smaller heading sizes.

This is a third-tier heading

You can use one # all the way up to ###### six for different heading sizes.

If you'd like to quote someone, use the > character before the line:

Coffee. The finest organic suspension ever devised... I beat the Borg with it. - Captain Janeway

There are many different ways to style code with GitHub's markdown. If you have inline code blocks, wrap them in backticks: var example = true. If you've got a longer block of code, you can indent with four spaces:

if (isAwesome){
  return true
}

GitHub also supports something called code fencing, which allows for multiple lines without indentation:

if (isAwesome){
  return true
}

And if you'd like to use syntax highlighting, include the language:

if (isAwesome){
  return true
}

Tables, Lines and Images

Tables can look like this:

A horizontal rules above and below

Some more images:

Links and Code Blocks

You can inert links in bullet points:

• http://github.com
• http://bitbucket.dom

You can also insert links to other steps:

• Step 01
• Step 02
• Step 03
• Step 04

More Code Block examples

  publish(path, course) {
    const basePath = '../' + path + '/' + this.folder;
    futils.initEmptyPath(basePath);

    this.resources = this.talks.concat(this.labs);
    futils.copyFileToFolder(this.img, basePath);
    futils.writeFile(basePath + '/index.html', nunjucks.render('topic.html', this));

    futils.writeFile(basePath + '/ajaxlabel.html',
        nunjucks.render('ajaxlabel.html',
            { url: this.url.substring(5) + '/' + this.folder }));
    futils.writeFile(basePath + '/indexmoodle.html', nunjucks.render('indexmoodle.html', this));

    console.log(this.title);
    this.publishTalks(basePath);
    this.publishLabs(basePath, course);
  }

This was autodetected as javascript. This one is html:

<div class="ui segment pushable">
  <div class="ui inverted labeled icon left inline vertical sidebar menu">
    {% for resource in course.allLabs.resources %}
      {% if resource.title == title %}
        <a class="active item" href="../../{{resource.parentFolder}}/{{resource.folder}}/{{resource.link}}">
          {{resource.title}}
        </a>
      {% else %}
        <a class="item" href="../../{{resource.parentFolder}}/{{resource.folder}}/{{resource.link}}">
          {{resource.title}}
        </a>
      {% endif %}
    {% endfor %}
  </div>
  <div class="pusher">
    <div class="ui basic segment">
      <br>
      {% for chapter in chapters %}
      <div  class="ui tab segment lab" data-tab="{{chapter.shortTitle}}">
        {{ chapter.content }}
      </div>
     {% endfor %}
    </div>
  </div>
</div>

Images

Image without a title:

Image with a title:

Exercises & Archives

You can link to zipped archives:

• Solutions

This archive must be placed in the archives folder as shown above.

Exercise 1:

Instructions for exercise 1.

Exercise 2:

Instructions for exercise 2.

Exercise 3:

Instructions for exercise 3.