Coder Social home page Coder Social logo

divinebovine / vscode-slides Goto Github PK

View Code? Open in Web Editor NEW

This project forked from nicoespeon/vscode-slides

0.0 0.0 0.0 1.33 MB

πŸ‘©β€πŸ« VS Code as a presentation tool

Home Page: https://marketplace.visualstudio.com/items?itemName=nicoespeon.slides

License: MIT License

JavaScript 7.18% TypeScript 92.82%

vscode-slides's Introduction

πŸ‘©β€πŸ« VS Code Slides

Slides is a Visual Studio Code extension that helps you use your editor as a presentation tool.

Demo of Slides features

This is inspired from AndrΓ© Staltz's post where he explained how you can use VS Code only to give a pleasant, "live coding"-like presentation.

> Give a feedback

Features

  • ⚑ Toggle Slides mode with a shortcut
  • 🎨 Apply optimized settings for presentation
  • πŸ‘ Handy shortcuts to navigate between slides

Toggle Slides mode

Use Ctrl Alt p (⌘ βŒ₯ p on Mac) to toggle Slides mode.

When you activate Slides, a few things happen:

  • Your settings got stored, so they can be reset
  • Settings get replaced with others that are optimized for presentation
  • All files are open in the alphabetical order, as tabs
  • You can navigate between each tab with convenient shortcuts (see below)

When you deactivate Slides, your original settings get restored.

Navigate between tabs (when Slides is active)

Shortcut Shortcut on Mac Operation
Ctrl β†’ ⌘ β†’ Go to next slide
Ctrl ← ⌘ ← Go to previous slide
Ctrl Esc ⌘ Esc Deactivate Slides

You can also re-use Toggle Slides mode to deactivate Slides.

Pre-requisite

Slides is opinionated. By default, you'll need to install:

  1. The "GitHub Clean White" theme on VS Code
  2. The "SF Mono" font on your machine

If you don't want to use these, you can configure Slides theme and font family. Open VS Code settings and search for "slides".

Installation

  1. Click on the Extensions icon (usually on the left-hand side of your editor).
  2. Search for "Slides".
  3. Find the extension in the list and click the install button.

How to use best

  1. Create one file per "slide"
  2. Name them by number: 01.md, 02.js, 03.01.md, 03.02.png, etc.
  3. Toggle Slides before you start your talk 🎀

Tips

  • Prefer to keep coding files empty, or with easy content supposed to be known.

Release Notes

Have a look at our CHANGELOG to get the details of all changes between versions.

Versioning

We follow SemVer convention for versionning.

That means our releases use the following format:

<major>.<minor>.<patch>
  • Breaking changes bump <major> (and reset <minor> & <patch>)
  • Backward compatible changes bump <minor> (and reset <patch>)
  • Bug fixes bump <patch>

Contributing

Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to Abracadabra.

To help you get your feet wet and become familiar with our contribution process, we have a list of good first issues that contains things with a relatively limited scope. This is a great place to get started!

Contributors ✨

Thanks goes to these wonderful people (emoji key):

Nicolas Carlo
Nicolas Carlo

πŸ’¬ πŸ’» πŸ“–
πŸ‘€ πŸ€”

This project follows the all-contributors specification.

Contributions of any kind are welcome!

License

πŸ’ MIT

vscode-slides's People

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.