A simple, in-browser, markdown-driven slideshow tool targeted at people who know their way around HTML and CSS, featuring:
- Markdown formatting, with smart extensions
- Presenter mode with markdown formatted speaker notes and cloned slideshow view
- Syntax highlighting, supporting a range of languages
- Slide scaling, thus similar appearance on all devices / resolutions
- Simple markdown templates for customized slides
- Touch support for smart phones and pads, i.e. swipe to navigate slides
Check out this remark slideshow for a brief introduction.
To render your Markdown-based slideshow on the fly, checkout Remarkise.
It takes only a few, simple steps to get up and running with remark:
- Create an HTML file to contain your slideshow (see boilerplate below)
- Open the HTML file in a decent browser
- Edit the Markdown and/or CSS styles as needed, save and refresh!
- Press
Cto clone a display; then pressPto switch to presenter mode. Open help menu withh.
See any of the boilerplate-*.html files (the -local one requires building remark first), or just copy the boilerplate HTML below to start:
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<meta charset="utf-8">
<style>
@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic);
@import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic);
body { font-family: 'Droid Serif'; }
h1, h2, h3 {
font-family: 'Yanone Kaffeesatz';
font-weight: normal;
}
.remark-code, .remark-inline-code { font-family: 'Ubuntu Mono'; }
</style>
</head>
<body>
<textarea id="source">
class: center, middle
# Title
---
# Agenda
1. Introduction
2. Deep-dive
3. ...
---
# Introduction
</textarea>
<script src="https://remarkjs.com/downloads/remark-latest.min.js">
</script>
<script>
var slideshow = remark.create();
</script>
</body>
</html>The wiki pages contain all the how-to, templating, and API help.
On using remark:
Other interesting stuff:
- gnab.github.com/editorjs
- judoole.github.com/GroovyBDD
- bekkopen.github.com/infrastruktur-som-kode
- ivarconr.github.com/Test-Driven-Web-Development/slides
- havard.github.com/node.js-intro-norwegian
- mobmad.github.com/js-tdd-erfaringer
- roberto.github.com/ruby-sinform-2012
- http://asmeurer.github.io/python3-presentation/slides.html
- Lecture notes using remark
- Time series analysis: theory and practice (a course using Remark)
Converting to PDF is primarily supported via Chrome's Print to PDF feature. Note that the styling is not exact; See #50 for some recommended CSS to add to your styles.
Alternatively, you can use DeckTape, a PDF exporter for HTML presentation frameworks that provides support for remark.
Thanks goes to these people for their contributions:
- Aaron Meurer
- Adam Obeng
- Adam Strzelecki
- Aleksandar Trifunovic
- Alexander Brett
- Alex Claman
- Alex Y. Wagner
- Allan Jiang
- Amin Bandali
- Andrea Georgieva
- Andrew Gaul
- Andrey Ustyuzhanin
- Antonin Stefanutti
- Axel Rauschmayer
- Baron Schwartz
- Bastian Venthur
- Bengt Lüers
- Benjamin Stigsen
- Bernát Kalló
- bobappleyard
- Brandon Keepers
- Breno Polanski
- Bruno Fagundez
- bugdone
- Cameron Daigle
- Chris Kanich
- Christian Dreier
- Christopher McClellan
- Christoph Gnip
- cjwit
- Claudio Bley
- Daan van Berkel
- Daniel Stankiewicz
- Daniel Wang
- Danny Tuppeny
- Dan Steingart
- datamike
- Dave Henderson
- David Richards
- derickfay
- Dirk Husemann
- Erwänn Mest
- Fabian
- Felix C. Stegerman
- Florian Rathgeber
- follower
- Gerard Capes
- gnab
- Grégoire Pineau
- Gurjeet Singh
- Hadrien Frank Cardinal de Cuzey
- Hiroshi Fukada
- Hubert Chen
- Hunter-Github
- hydroid7
- Ivo Wever
- J_4lexander
- Jason
- Jason Underhill
- Jérôme Petazzoni
- Jimmy Merrild Krag
- Joe Beda
- Joel Porquet
- Johannes Wienke
- Julien Wajsberg
- kellyoconor
- kerim
- kernc
- Kim Joar Bekkelund
- Lauro Caetano
- Loreia
- Marcel Schilling
- Markus Schanz
- Martin
- Martin 'Hasan' Bramwell
- Mathias Bynens
- Matthew
- Mears-UFL
- mhor
- Michael Byrne
- Michael Grosser
- Michael Mol
- Michael Sanford
- Mike Pennisi
- Morton Fox
- mrbald
- Nicolas Hart
- Oleksiy Syvokon
- Ole Petter Bang
- Ozan K
- Pavel Boldyrev
- Pedro
- Pedro Martin
- Peter Jausovec
- petitviolet
- Pi-Hsun Shih
- pille1842
- piranha
- pospi
- Psychos-Yi
- punkish
- Radovan Bast
- Rahul Bansal
- Rasmus Vestergaard Hansen
- rasmusvhansen
- Renato Alves
- rglepe
- Rich Trott
- Roberto Soares
- Robert Perce
- Robert Szmurło
- Robin Berjon
- Rolf
- Rostyk
- Russell Keith-Magee
- Ryan Thomson
- Sarah Binney
- Scott Hewitt
- Sebastian Pipping
- Sequoia McDowell
- Shane Curcuru
- Shaun Hammill
- siba prasad samal
- Simon Hengel
- Stian Mathiassen
- stu-b-doo
- Sylvain Abélard
- Takashi Kanemoto
- Tej Chajed
- Thomas Ballinger
- Tobias Løfgren
- Todd Brannam
- Todd Gureckis
- Tome Tanasovski
- Tom Kraak
- Torgeir Thoresen
- tripu
- vdepabk2t
- William Ghelfi
- Willi Rath
- Wouter Sioen
- Yihui Xie
- Yinhe Zhang
- Yohan Lasorsa
- Yoshiya Hinosawa
remark is licensed under the MIT license. See LICENSE for further details.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent