Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/slidevjs/slidev

Presentation Slides for Developers
https://github.com/slidevjs/slidev

markdown presentation slides vite vue vueuse

Last synced: 3 days ago
JSON representation

Presentation Slides for Developers

Host: GitHub
URL: https://github.com/slidevjs/slidev
Owner: slidevjs
License: mit
Created: 2021-04-24T01:25:23.000Z (over 3 years ago)
Default Branch: main
Last Pushed: 2024-10-28T06:18:10.000Z (about 2 months ago)
Last Synced: 2024-10-29T15:18:22.257Z (about 1 month ago)
Topics: markdown, presentation, slides, vite, vue, vueuse
Language: TypeScript
Homepage: https://sli.dev
Size: 74.5 MB
Stars: 33,184
Watchers: 135
Forks: 1,345
Open Issues: 89
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

stars - slidevjs/slidev
awesome - slidevjs/slidev - Presentation Slides for Developers (TypeScript)
awesomeLibrary - slidev
Awesome - Presentation Slides for Developers
awesome - slidevjs/slidev - Presentation Slides for Developers (TypeScript)
fucking-awesome-vite - Slidev - Presentation Slides for Developers. (Projects Using Vite.js / Open Source)
awesome-luooooob - slidevjs/slidev - Presentation Slides for Developers (TypeScript)
stars - slidevjs/slidev - Presentation Slides for Developers (TypeScript)
awesome-list - slidev
StarryDivineSky - slidevjs/slidev
awesome-vite - Slidev - Presentation Slides for Developers. (Projects Using Vite.js / Open Source)
awesome-econ - slidev
awesome-fe-resources - slidevjs
awesome - slidevjs/slidev - Presentation Slides for Developers (TypeScript)
awesome-documentation - Slidev - Presentation slides for developers. (General Tools / Multimedia)
awesome - slidevjs/slidev - Presentation Slides for Developers (TypeScript)
awesome - slidevjs/slidev - Presentation Slides for Developers (TypeScript)

README

        














Presentation slides for developers 🧑‍💻👩‍💻👨‍💻






















  Video Preview | Documentation








_{Made possible by my Sponsor Program 💖}






## Features

- 📝 [**Markdown-based**](https://sli.dev/guide/syntax) - foucus on content and use your favorite editor

- 🧑‍💻 [**Developer Friendly**](https://sli.dev/guide/syntax#code-blocks) - built-in code highlighting, live coding, etc.

- 🎨 [**Themable**](https://sli.dev/resources/theme-gallery) - theme can be shared and used with npm packages

- 🌈 [**Stylish**](https://sli.dev/guide/syntax#embedded-styles) - on-demand utilities via [UnoCSS](https://github.com/unocss/unocss).

- 🤹 [**Interactive**](https://sli.dev/custom/directory-structure#components) - embedding Vue components seamlessly

- 🎙 [**Presenter Mode**](https://sli.dev/guide/ui#presenter-mode) - use another window, or even your phone to control your slides

- 🎨 [**Drawing**](https://sli.dev/features/drawing) - draw and annotate on your slides

- 🧮 [**LaTeX**](https://sli.dev/features/latex) - built-in LaTeX math equations support

- 📰 [**Diagrams**](https://sli.dev/guide/syntax#diagrams) - creates diagrams using textual descriptions with [Mermaid.js](https://mermaid.js.org/)

- 🌟 [**Icons**](https://sli.dev/features/icons) - access to icons from any icon set directly

- 💻 [**Editor**](https://sli.dev/guide/index#editor) - integrated editor, or the [VSCode extension](https://sli.dev/features/vscode-extension)

- 🎥 [**Recording**](https://sli.dev/features/recording) - built-in recording and camera view

- 📤 [**Portable**](https://sli.dev/guide/exporting) - export into PDF, PNGs, or PPTX

- ⚡️ [**Fast**](https://vitejs.dev) - instant reloading powered by [Vite](https://vitejs.dev)

- 🛠 [**Hackable**](https://sli.dev/custom/) - using Vite plugins, Vue components, or any npm packages

## Getting Started

### Try it Online ⚡️

[sli.dev/new](https://sli.dev/new)

[![](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://sli.dev/new)

### Init Project Locally

Install [Node.js >=18](https://nodejs.org/) and run the following command:

```bash

npm init slidev

```

Documentation:

**[English](https://sli.dev)** | [中文文档](https://cn.sli.dev) | [Français](https://fr.sli.dev) | [Español](https://es.sli.dev) | [Русский](https://ru.sli.dev) | [Português-BR](https://br.sli.dev)

Discord: [chat.sli.dev](https://chat.sli.dev)

For a full example, you can check the [demo](https://github.com/slidevjs/slidev/blob/main/demo) folder, which is also the source file for [my previous talk](https://antfu.me/posts/composable-vue-vueday-2021).

## Tech Stack

- [Vite](https://vitejs.dev) - An extremely fast frontend tooling

- [Vue 3](https://v3.vuejs.org/) powered [Markdown](https://daringfireball.net/projects/markdown/syntax) - Focus on the content while having the power of HTML and Vue components whenever needed

- [UnoCSS](https://github.com/unocss/unocss) - On-demand utility-first CSS engine, style your slides at ease

- [Shiki](https://github.com/shikijs/shiki), [Monaco Editor](https://github.com/Microsoft/monaco-editor) - First-class code snippets support with live coding capability

- [RecordRTC](https://recordrtc.org) - Built-in recording and camera view

- [VueUse](https://vueuse.org) family - [`@vueuse/core`](https://github.com/vueuse/vueuse), [`@vueuse/motion`](https://github.com/vueuse/motion), etc.

- [Iconify](https://iconify.design/) - Icon sets collection.

- [Drauu](https://github.com/antfu/drauu) - Drawing and annotations support

- [KaTeX](https://katex.org/) - LaTeX math rendering.

- [Mermaid](https://mermaid-js.github.io/mermaid) - Textual Diagrams.

## Sponsors

This project is made possible by all the sponsors supporting my work:



  

    

  



## License

MIT License © 2021 [Anthony Fu](https://github.com/antfu)