theme | layout | background |
---|---|---|
./ |
center |
/background.jpg |
Presentation slides for developers
Press Space for next page
- Erstens Blablablabla blablablabla
- Zweitens Blablablabla blablablabla blablablabla blablablabla
- Drittens Blablablabla blablablabla blablablabla
- Viertens Blablablabla blablablabla
Slidev is a slides maker and presenter designed for developers, consist of the following features
- 📝 Text-based - focus on the content with Markdown, and then style them later
- 🎨 Themable - theme can be shared and used with npm packages
- 🧑💻 Developer Friendly - code highlighting, live coding with autocompletion
- 🤹 Interactive - embedding Vue components to enhance your expressions
- 🎥 Recording - built-in recording and camera view
- 📤 Portable - export into PDF, PNGs, or even a hostable SPA
- 🛠 Hackable - anything possible on a webpage
Read more about Why Slidev?
layout: task name: Task Layout time: 30min method: Work in Groups result: Programm als .zip-Datei abgegeben
Describe the most important steps of the task here:
- First go there
- One
- Two
- Then do this
- Finally..
::left::
- Left
- Awesome
::right::
console.log("With some code");
Bliblablub
Hover on the bottom-left corner to see the navigation's controls panel
space / tab / right | next animation or slide |
left / shiftspace | previous animation or slide |
up | previous slide |
down | next slide |
- This
- are
- bullet points.
- This
- is
- an enumerated list.
layout: image-right image: 'https://source.unsplash.com/collection/94734566/1920x1080'
Use code snippets and get the highlighting directly!
interface User {
id: number
firstName: string
lastName: string
role: string
}
function updateUser(id: number, update: Partial<User>) {
const user = getUser(id)
const newUser = { ...user, ...update }
saveUser(id, newUser)
}
<QRCode value="https://openscript.ch" style="width: 200px" />