react-basics/example-lecture.md

marp	paginate	math	theme	title
true	true	mathjax	buutti	N. Example Lecture

Example Lecture

Section

• This line appears instantly

• This line appears by pressing spacebar (preferred)
• This line has an inline code variable

1. This line appears instantly

2. This line appears by pressing spacebar

Code and maths

• code code code:

  console.log("Here's a syntax-highlighted JavaScript code block");
  console.log("Remember indentation so it's revealed after the bullet point.");
  

• This line has an inline LaTeX maths equation c = \frac{a^2}{\sqrt{b}}
• Here's a maths block:

F(x) = \int_a^b f(x) dx

Columns

• Basic image example

• Wider image

• This line is outside the columns and goes from left all the way to the right

Columns 2

• Another column example with a wider left panel

• Change class name to change proportions
• If suitable proportions not available, add to buutti.css

Setup

• In VS Code, install the extensions
  • Marp for VS code
    • So you can see the slideshow preview when editing.
  • Markdown all in one
  • Markdown table formatter
    • Right click > Format document makes tables pretty
  • Save and run
    • An HTML version of the lecture is created on save
    • See settings.json
    • Add filenames to notMatch if a HTML on save is not needed