<!-- Black (default) - White - League - Sky - Beige - Simple
Serif - Blood - Night - Moon - Solarized -->
<style>
body {
background: #ffffff;
background-color: #ffffff;
}
.reveal .slides {
font-size: 24px;
font-family: Palatino;
}
.reveal .slides h2 {
font-size: 48px;
font-family: Palatino;
letter-spacing: 0.005em;
}
.reveal .slides h3 {
font-size: 36px;
font-family: Palatino;
letter-spacing: 0.005em;
}
.reveal .slides h4 {
font-family: Palatino;
font-size: 28px;
letter-spacing: 0.005em;
}
.reveal pre {
display: block;
width: 80%;
}
.reveal pre code {
max-height: 500px;
font-size: 20px;
line-height: 24px;
}
ul {
font-size: 24px;
}
ul ul {
font-size:0.85em;
}
</style>
## HackMD Slides
slides: [hackmd.io/@anirudh/tqz](https://hackmd.io/@anirudh/tqz)
---
### What is hackmd?
- Collaborative
- Markdown Render
- Notes
- Slides
- Book Mode
- GitHub Connectivity
- Use reveal: https://github.com/hakimel/reveal.js/
---
<h3 style="padding: 5px"> Other Options? </h3>
- Google Slides, Powerpoint, Keynote
- Not good with code
- markdown
- math etc.
- Pandoc
- Similar to hackmd but only slides
- Local and link sharing is not direct.
- LaTeX and Beamer
- Extreme customization possible
- But I don't want to invest a lot of time writing verbose LaTeX.
- Custom Builds
- Extreme customization possible
- Based on remark and reveal
---
### Basics
Syntax to divide slides: `---` and rest is usual markdown
---
### Code
<pre class="brush: python">
<code>
# This is python
print("Yo! What up?")
</code>
</pre>
You can try different things and syntax highlighting
```python=3.6
# This is python
x = y + 3
```
---
### Math
$softmax(x)_i = \frac{exp(x_i)}{\sum_{j}^{ }exp(x_j))}$
---
### Tables
<pre><code data-line-numbers="3-5|8-10|13-15">
<table>
<tr>
<td>Interns</td>
<td>Project</td>
<td>Joined</td>
</tr>
<tr>
<td>Anirudh</td>
<td>Data-API</td>
<td>June</td>
</tr>
<tr>
<td>Matthew</td>
<td>Hypothesis</td>
<td>July</td>
</tr>
</table>
</code></pre>
---
### Fragments
<!-- .element: class="fragment" data-fragment-index="1" -->
<p class="fragment">Fade in</p>
<p class="fragment fade-out">Fade out</p>
<p class="fragment highlight-red">Make this red</p>
<p class="fragment fade-in-then-out">Fade in, then out</p>
<p class="fragment fade-up">Slide up while fading in</p>
---
### Speaker Notes
- Notes
- Timer
- Next slide preview.
Press the S key to try it out.
Note:
You can keep some notes here.
---
### Pause Slides
Press b key to try it out.
---
## Summary
***Good presentation: keeps things minimal.***
Why should you be interested?
1. Dig Minimalist Clean Vibe. :hearts:
2. Have a lot of code/math on your slides.
4. You are a markdown fan and don’t really have the time for LaTeX and Beamer etc.
5. Keep notes in markdown then it is very easy to convert that to slides.
6. Slide links are super easy to share.
7. Easily connect with github.
8. Great on touch devices (mobile and tablets). Simply swipe through slides.
---
## Thanks!
{"metaMigratedAt":"2023-06-16T04:01:09.021Z","metaMigratedFrom":"YAML","title":"Intro to HackMD Slides","breaks":true,"description":"View the slide with \"Slide Mode\".","slideOptions":"{\"transition\":\"fade\",\"theme\":\"sky\"}","contributors":"[{\"id\":\"c2527c0b-2aca-4972-850f-f12531e5a6fe\",\"add\":5779,\"del\":10481}]"}