Instantly share code, notes, and snippets.

What would you like to do?
title: "Presentation Ninja"
subtitle: "⚔<br/>with xaringan"
author: "Yihui Xie"
date: "2016/12/12 (updated: `r Sys.Date()`)"
lib_dir: libs
- default
- default-fonts
- ""
highlightStyle: github
highlightLines: true
countIncrementalSlides: false
```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
class: animated, flipInY
background-image: url(
Image credit: [Wikimedia Commons](
class: center, middle, animated, slideInRight
# xaringan
### /ʃæ.'riŋ.ɡæn/
class: inverse, center, middle, animated, bounceInDown
# Get Started
class: animated, fadeIn
# Hello World
Install the **xaringan** package from [Github](
```{r eval=FALSE, tidy=FALSE}
You are recommended to use the [RStudio IDE](, but you do not have to.
- Create a new R Markdown document from the menu `File -> New File -> R Markdown -> From Template -> Ninja Presentation`;<sup>1</sup>
- Click the `Knit` button to compile it;
- or use the [RStudio Addin](<sup>2</sup> "Infinite Moon Reader" to live preview the slides (every time you update and save the Rmd document, the slides will be automatically reloaded in RStudio Viewer.
[1] 中文用户请看[这份教程](
[2] See [#2]( if you do not see the template or addin in RStudio.
background-image: url(`r xaringan:::karl`)
background-position: 50% 50%
class: center, bottom, inverse, animated, rollIn
# You only live once!
class: animated, lightSpeedIn
# Hello Ninja
As a presentation ninja, you certainly should not be satisfied by the "Hello World" example. You need to understand more about two things:
1. The [remark.js]( library;
1. The **xaringan** package;
Basically **xaringan** injected the chakra of R Markdown (minus Pandoc) into **remark.js**. The slides are rendered by remark.js in the web browser, and the Markdown source needed by remark.js is generated from R Markdown (**knitr**).
class: animated, zoomInUp
# remark.js
You can see an introduction of remark.js from [its homepage]( You should read the [remark.js Wiki]( at least once to know how to
- create a new slide (Markdown syntax<sup>*</sup> and slide properties);
- format a slide (e.g. text alignment);
- configure the slideshow;
- and use the presentation (keyboard shortcuts).
It is important to be familiar with remark.js before you can understand the options in **xaringan**.
.footnote[[*] It is different with Pandoc's Markdown! It is limited but should be enough for presentation purposes. Come on... You do not need a slide for the Table of Contents! Well, the Markdown support in remark.js [may be improved]( in the future.]
background-image: url(`r xaringan:::karl`)
background-size: cover
class: center, bottom, inverse, animated, tada
# I was so happy to have discovered remark.js!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment