Demo Time: Kjør presentasjoner rett fra VS Code
Å nei, du har blitt bedt om å holde en presentasjon! Ta det med ro – med Demo Time kan du droppe PowerPoint og heller kjøre presentasjoner direkte fra VS Code.
Er du en dyktig utvikler, er sjansen stor for at du på ett eller annet tidspunkt vil bli spurt om å holde en presentasjon for å vise frem hva du kan.
Om du ikke er veldig dreven og ofte koder live foran et publikum, kan det være stressende å tenke på alt som kan gå galt. Hva om du ikke husker syntaksen, eller noe annet går galt foran publikum?
Med verktøyet Demo Time skal live-kodingen gå som en lek, skal vi tro utvikleren bak prosjektet, Elio Struyf.
Skriptede kodedemoer
Ifølge utvikleren hjelper Demo Time deg med å strømlinjeforme livekoding-presentasjonene dine ved å blant annet la deg automatisere oppgaver og skripte de ulike trinnene i kodedemoene dine på forhånd.
Og du kan droppe PowerPoint og andre presentasjonsprogrammer helt, og heller kjøre alt fra ett sted: VS Code – eller VS Code-baserte editorer som Cursor.
Kort fortalt får du et grafisk brukergrensesnitt i VS Code der du kan opprette en ny presentasjon, eller demo som Demo Time kaller det.
Hver demo kan inneholde mange trinn , der hvert trinn for eksempel kan:
- Åpne lysbilder/slides og vise dem på skjermen med fine overganger.
- Kjøre en eller flere actions, som kan være å for eksempel åpne en fil, utheve kode i en fil eller oppdatere innholdet i en fil.
Med actions kan du for eksempel skripte at du først viser en kodesnutt på skjermen, og deretter skriver inn ny kode. Aldri mer skrivefeil! Du kan selvfølgelig ta over kontrollen selv, hvis du vil.
Visuell editor eller kode
For å komme igang med Demo Time, installerer du først et VS Code-tillegg. Den gir deg et eget Demo Time-valg på venstre side i editoren når du har Explorer-panelet i VS Code oppe.
Etter at du har åpnet prosjektet du vil lage en demo av (altså presentere), klikker du en "Initialize"-knapp, så opprettes det automatisk en .demo-mappe med en demo.json-fil i.
Du kan kalle demo.json-filen hva som helst, for eksempel hvis du vil ha flere demoer/presentasjoner i ett og samme kodeprosjekt.
Klikker du på demo.json-filen får du opp en visuell editor der du kan opprette de ulike trinnene demo skal bestå av:
Hvis du foretrekker å heller redigere demoene dine som kode, trykker du View Source for å vise den bakenforliggende JSON-konfigurasjonsfilen:
Actions
Demo Time har som nevnt en masse forskjellige actions som du kan velge fra den visuelle editoren, eller konfigurere i JSON-filen for demoen din:
- File actions. Blant annet åpne, lukke eller opprett filer.
- Text actions. Her kan du automatisere/skripte at du skriver inn tekst, erstatter tekst, uthever tekst, og så videre. Du kan justere skrivehastighet, slik at du kan få det til å se ut som at du taster inn tekst litt og litt, i stedet for at teksten kommer automatisk.
- Terminal actions. Skripting av at du kjører kommandoer fra terminalen.
Det er massevis av andre actions også, du finner oversikt over alle her.
Lysbilder i Markdown-format
I tillegg til skripting av selve livekodingen, kan du lage lysbilder (slides) i Markdown-format.
Et veldig enkelt lysbilde kan se slik ut:
---
theme: default
layout: intro
---
# Title
Hello, **Demo Time**!Du kan ha flere lysbilder i samme Markdown-fil, og du kan definere layout, tema, overganger, hastigheter, bilder og mye annet i "front matter"-seksjonen øverst i Markdown-filen, for eksempel slik:
Hvis du ikke liker noen av de ferdige lysbildemalene, kan du kode dine egne maler med HandleBars-syntaks.
Det er også støtte for en masse annet, som animasjoner, visuelle komponenter som for eksempel piler og ulike figurer, og så videre. Er du spesielt ivrig kan du til og med lage dine egne visuelle komponenter basert på Web Components.
Klar... ferdig... presenter!
Når presentasjonen er klar kan du vise én og én av kodedemoene som presentasjonen består av manuelt. Eller du kan bytte til presentasjonsmodus for å kunne navigere mellom lysbilder og kodeeksempler ved hjelp av hurtigtaster.
Du kan ha et eget presentatørvindu oppe på din egen skjerm, med oversikt over neste og forrige lysbilde, notater til hvert enkelt lysbilde, samt en tidtaker. Litt som i tradisjonelle presentasjonsprogrammer som PowerPoint eller KeyNote.
Jeg har ikke testet Demo Time inngående – men det virker umiddelbart som et veldig nyttig verktøy. Presentasjonene ser helt supre ut, og muligheten til å skripte en del av livekodingen er utvilsomt nyttig.
Det beste av alt er imidlertid at du slipper å bytte mellom presentasjonsprogram og kodeeditor, og når som helst kan steppe inn og overta kontrollen manuelt.
Her kan du se utviklerens egen demo av Demo Time: