Skip to content

Quickstart

Build your first deck and serve it locally.

Starting from scratch?

kslides-init.sh scaffolds a complete project — build config, a starter deck, and a GitHub Pages workflow — in one command. See Installation.

curl -fsSL https://raw.githubusercontent.com/kslides/kslides/master/kslides-init.sh | bash -s -- my-talk --title "My Talk"

1. Minimal program

A complete kslides program is just a main() calling the kslides {} DSL:

fun main() {
  kslides {
    presentation {
      markdownSlide {
        content {
          """
          # Hello, kslides!
          A Kotlin DSL for reveal.js.
          """
        }
      }
    }
  }
}

The default output is a static site under docs/ plus a Ktor server on port 8080.

2. Choose where it goes

You can switch off either output, or change the port:

fun staticOutput() {
  kslides {
    output {
      enableFileSystem = true
      enableHttp = false
      // outputDir defaults to "docs"
    }

    presentation {
      path = "index.html"
      markdownSlide { content { "# Static site" } }
    }
  }
}
fun httpOutput() {
  kslides {
    output {
      enableFileSystem = false
      enableHttp = true
      httpPort = 8080
    }

    presentation {
      path = "index.html"
      markdownSlide { content { "# Live server" } }
    }
  }
}

3. Add more presentations

Each presentation { } block becomes its own deck at the given path:

fun multiplePresentations() {
  kslides {
    presentation {
      path = "index.html"
      markdownSlide { content { "# Welcome" } }
    }

    presentation {
      path = "talks/2026.html"
      markdownSlide { content { "# 2026 talk" } }
    }
  }
}

After running, you'll have docs/index.html and docs/talks/2026.html.

4. Mix slide types

You're not limited to Markdown — see the Slides overview for the full picture.

fun dslBasic() {
  kslides {
    presentation {
      dslSlide {
        content {
          h1 { +"Kotlin HTML DSL" }
          p { +"Build slides with kotlinx.html." }
        }
      }
    }
  }
}

5. Iterate without the restart dance

Set devMode = true alongside enableHttp and the browser follows your edits — reloading on every app restart and returning you to the slide you were on:

fun devModeOutput() {
  kslides {
    output {
      // Live-reload dev server: the page refreshes to the current slide when the app restarts.
      enableHttp = true
      devMode = true
      enableFileSystem = false // no need to write static files while authoring
    }

    presentation {
      path = "index.html"
      markdownSlide { content { "# Editing live" } }
    }
  }
}

Pair it with ./kslides-dev.sh to rebuild and restart automatically on every source change. See Dev mode.

Next steps