go-slides
slides v0.13.0
slides 명령과 그 라이브러리: Marp의 Markdown을 Go로 파싱하고 렌더링하며, 그 위에 Go 템플릿과 슬라이드 종류를 더했습니다. v0.13.0으로 릴리스됨: go install github.com/go-slides/slides/cmd/slides@latest.
slides는 Marp가 읽는 Markdown을 그대로 읽습니다 — 디렉티브, 슬라이드 사이의 ---, ![bg] 배경, 발표자 노트, 내장 테마까지. 여기에 Marp에 없는 두 가지를 더합니다. 덱 안의 Go 템플릿, 그리고 슬라이드가 어떻게 보이는지를 반복하는 대신 무엇인지를 말하게 해 주는 슬라이드 종류입니다.
--- marp: true paginate: true footer: {{ .talk }} data: talk: Pure Go slides topics: [Why, How, Next] --- <!-- _kind: title --> # {{ .talk }} {{ range .topics }} --- # {{ . }} {{ end }}
문법은 Marpit과 Marp Core의 것이며, 별도의 방언이 아닙니다. Marp용으로 작성한 덱을 여기서도 똑같이 읽고, slides expand는 평범한 Marp Markdown으로 되돌려 주므로 아래 두 가지 추가 기능으로 작성한 내용에 갇힐 일이 없습니다.
---로 슬라이드를 나눕니다. 프런트 매터나 HTML 주석 안의 전역, 로컬, 스폿(_class) 디렉티브를 지원하며, 슬라이드 간 상속도 Marp와 같습니다.
![bg]와 그 크기 및 필터, 분할 배경, 그리고 Marp가 이해하는 이미지 키워드를 지원합니다.
헤더, 푸터, 페이지 번호; 주석에서 가져오는 발표자 노트; 단계별로 나타나는 목록; 슬라이드 하나만의 CSS를 위한 <style scoped>.
default, gaia, uncover를 Marp처럼 theme:로 선택합니다.
덱은 text/template이며 Markdown을 파싱하기 전에 평가됩니다. 그래서 템플릿으로 슬라이드를 생성할 수 있고, 덱을 데이터와 레이아웃의 조합으로 만들 수 있습니다.
{{ .title }}는 프런트 매터를 읽고, 그 data: 매핑에는 덱에 필요한 그 밖의 무엇이든 담을 수 있습니다.
---를 출력하는 {{ range }}는 슬라이드 생성기입니다. 항목마다, 발표자마다, 릴리스마다 슬라이드가 하나씩 만들어집니다.
{{ page }}와 {{ total }}는 덱이 나뉜 뒤에야 알 수 있으므로 그때 채워집니다.
펜스 블록과 인라인 코드는 기본적으로 평가하지 않으므로, Go 템플릿을 설명하는 슬라이드에 템플릿을 그대로 보여 줄 수 있습니다. include로 다른 파일을 불러옵니다.
kind: section은 헤더, 푸터, 페이지 번호, 클래스, 배경 같은 로컬 디렉티브 묶음에 이름을 붙입니다. kind:는 해당 슬라이드와 그 뒤 슬라이드에, _kind:는 한 슬라이드에만 적용됩니다. 슬라이드에 직접 쓴 디렉티브가 항상 우선합니다.
title, section, content, blank가 있으며, 모두 다시 정의할 수 있습니다.
프런트 매터의 kinds:에, 또는 팀의 모든 덱이 가리키는 종류 YAML 파일에 정의합니다.
종류를 바꾸면 이전 종류가 설정한 값이 지워지므로, 클래스나 푸터가 다음 섹션까지 따라오지 않습니다.
플레이그라운드는 WebAssembly로 컴파일된 go-slides 그 자체입니다. 왼쪽에 쓰면 오른쪽에 슬라이드가 따라옵니다. 아무것도 설치하지 않고, 아무것도 서버로 보내지 않습니다. 플레이그라운드 자체의 인터페이스는 영어로 되어 있습니다.
입력하는 동안 워커에서 슬라이드가 렌더링되고, 미리 보기는 편집기와 함께 스크롤되며, 미니맵과 슬라이드 썸네일 열이 그 뒤를 따릅니다. 슬라이드쇼는 전환 효과와 함께 발표됩니다. Present를 누르면 노트와 타이머가 있는 발표자 보기가 두 번째 창에 열립니다.
디렉티브, 종류, 템플릿 함수의 자동 완성과 설명; 해당 줄에 표시되는 문제; 수식, 이미지, 배경 등을 담은 예제 덱(이미지 파일을 편집기에 끌어다 놓으세요); 문서로 가는 링크. 파일 패널은 프로젝트를 담습니다. 테마, 종류, 데이터 파일, 끌어다 놓은 미디어가 slides 명령이 만드는 구조 그대로 들어갑니다. Format 탭은 Undo와 함께 Markdown을 대신 써 줍니다: 굵게, 기울임, 밑줄, 목록, 격자로 만드는 표, 슬라이드 텍스트 정렬, 링크. 모든 창은 크기를 조절할 수 있습니다.
링크에는 덱 자체가 # 안에 압축되어 담깁니다. HTML, 벡터 PDF, 편집 가능한 PowerPoint 또는 OpenDocument 덱으로 저장할 수 있으며 모두 브라우저에서 만들어집니다. 프로젝트 전체를 .zip으로 내려받을 수도 있습니다. 작성 중인 초안은 새로 고침 후에도 남으며, 오직 브라우저에만 저장됩니다.
marp-cli는 headless Chrome을 구동해 이미지와 PDF를 렌더링합니다. 여기서는 플릿 자체의 Go 라이브러리가 그 일을 대신합니다. 이미지와 PDF는 v0.1.0, PPTX와 수식, 하이라이트는 v0.2.0, ODP와 폭에 맞춘 제목, HCL은 v0.3.0, 텍스트를 선택할 수 있는 벡터 PDF와 이모지는 v0.4.0에 추가되었습니다. v0.5.0에서는 PPTX와 ODP를 편집할 수 있게 되었는데, marp-cli의 PPTX는 그림일 뿐입니다. v0.6.0은 watch, serve, 전환 효과와 marp-cli의 옵션을, v0.7.0은 발표자 보기를 더했습니다 — 문서를 참고하세요.
덱마다 한 페이지를 Marp와 같은 방식으로 렌더링합니다. 각 슬라이드는 창 크기에 맞춰 늘어나는 SVG 프레임 안의 <section>이며, 테마 CSS와 키보드 뷰어가 함께 들어갑니다.
템플릿을 평가하고 종류를 스폿 디렉티브로 바꾼 덱을 평범한 Marp Markdown으로 다시 써 줍니다. 그다음은 어떤 Marp 도구로든 이어 갈 수 있습니다.
slides notes는 발표자 노트를 출력하고, slides kinds와 slides themes는 덱이 지정할 수 있는 항목을 나열합니다.
덱 폴더를 위한 설정 파일: 공유 종류, 테마, 템플릿 데이터, HTML 옵션, 언어.
--images png|jpeg는 슬라이드마다 이미지를 하나씩(deck.001.png, …), --image는 첫 슬라이드를 씁니다. headless Chrome이 아니라 Go로 만든 브라우저 엔진 go-webengine이 렌더링합니다. --image-scale 2는 두 배 밀도로 렌더링합니다.
--pdf 또는 -o deck.pdf: 슬라이드 크기 그대로 슬라이드마다 한 페이지, 슬라이드와 제목의 개요까지 go-pdfkit이 씁니다. 글꼴은 임베드되며 네트워크는 전혀 쓰지 않습니다. v0.4.0부터 페이지는 벡터입니다: 선택 가능한 텍스트, 선명한 도형, 슬라이드 100장에 758 KiB로 marp-cli의 837 KiB보다 작습니다(--pdf-raster는 페이지마다 이미지 하나를 유지).
--pptx 또는 -o deck.pptx: 발표자 노트와 덱 메타데이터를 포함해 go-ooxml이 씁니다. v0.5.0부터 슬라이드를 편집할 수 있습니다 — 덱 자체 글꼴(임베드)로 된 텍스트 상자, 도형, 그라디언트, 한 번만 저장되는 그림. marp-cli의 슬라이드는 그림일 뿐입니다(--pptx-raster로 유지). 슬라이드 100장: 348 ms와 760 KiB, marp-cli는 7.8 s와 7.2 MiB.
--odp 또는 -o deck.odp: 발표자 노트가 포함된 OpenDocument 프레젠테이션입니다. PPTX처럼 v0.5.0부터 편집할 수 있습니다(슬라이드마다 그림 하나를 원하면 --odp-raster).
# <!-- fit --> Title은 페이지와 모든 내보내기에서 한 줄로 슬라이드 폭을 가득 채웁니다.
:smile: 숏코드와 유니코드 이모지(😄 👩💻 🇫🇷)는 Marp Core와 똑같이 Twemoji 이미지가 됩니다. 다만 CDN에서 불러오지 않고 go-icons/twemoji에서 임베드하므로, 네트워크 없이 페이지, 이미지, PDF, PPTX, ODP에 그려집니다. 이모지 →
덱이 YAML을 받는 곳이면 어디서나 HCL2를 쓸 수 있습니다 — ---hcl 프런트 매터, slides.hcl, 종류와 데이터 파일 — 표현식과 함수까지: footer = "${upper(data.company)} · ${page()}/${total()}". slides expand는 프런트 매터를 YAML로 다시 씁니다. HCL →
--watch는 바뀐 것을 다시 빌드하고 열린 페이지를 새로 고칩니다. --server dir는 덱 폴더를 서비스합니다 — deck.md는 페이지로, deck.md?pdf, ?pptx, ?png, ?notes는 요청 시 변환 — 127.0.0.1에서, Host와 Origin을 확인하며 폴더 밖으로는 절대 나가지 않습니다. --preview는 브라우저를 엽니다. marp-cli의 경로와 라이브 리로드를, 열린 포트 없이. 명령줄 →
slides -I decks/ -o site/는 폴더 아래의 모든 덱을 변환하고 디렉터리 구조를 그대로 옮깁니다. 여러 파일, 폴더, 패턴을 한 번에, -P개씩 동시에 처리합니다.
marp-cli의 <!-- transition: fade 1s -->와 33가지 내장 전환을 브라우저의 View Transition API로 재생합니다. 화면 위 컨트롤러와 --template bare도 지원합니다.
--notes는 발표자 노트를 텍스트로 쓰고, --pdf-notes는 PDF 페이지에 넣으며, --pdf-outlines는 책갈피를 만듭니다. --title, --author, --keywords, --url, --og-image, --theme; marp-cli의 .marprc와 --config-file(JSON, YAML)도 읽습니다.
o를 누르면 모든 슬라이드가 격자로 표시되고, 화살표로 고른 뒤 Enter나 클릭으로 이동합니다 — 페이지 위에서도 발표자 보기 위에서도, marp-cli의 URL과 동기화 방식 그대로, 네트워크 없이. 슬라이드에는 레이블이 있고 포커스를 받을 수 있으며, 닫힌 개요는 비활성(inert) 상태입니다. 명령줄 →
페이지에서 p를 누르면 현재 슬라이드, 다음 단계, 발표자 노트(이스케이프되며 청중의 스크린 리더에는 절대 읽히지 않음), 시계와 타이머가 두 번째 창에 열립니다. 두 창은 서로를 따라갑니다 — marp-cli의 URL과 동기화 방식으로, localStorage를 통해, 서버도 네트워크도 없이. 페이지당 약 10 KB. 명령줄 →
```go {lineNumbers}는 코드 블록의 줄에 번호를 붙입니다({lineNumbers=10}은 10부터 시작). 줄 끝 주석의 마커(// <1>) 뒤에 번호 목록을 두면 그 줄과 해당 설명에 번호 원이 표시됩니다 — 페이지, 이미지, PDF, PPTX, ODP 모두에서. 번호와 원은 코드와 함께 복사되지 않습니다. 수식과 코드 →
slides 명령과 그 라이브러리: Marp의 Markdown을 Go로 파싱하고 렌더링하며, 그 위에 Go 템플릿과 슬라이드 종류를 더했습니다. v0.13.0으로 릴리스됨: go install github.com/go-slides/slides/cmd/slides@latest.
v0.13.0을 설명하는 문서(Hugo + Hextra): 시작하기, Marp 호환성, 템플릿, 종류, 명령줄. 소스 →
Marp for VS Code가 Marp에 해 주는 역할을 하는 VS Code 확장입니다. WebAssembly로 컴파일된 go-slides가 VS Code의 Markdown 미리 보기에 덱을 표시하며(바이너리 불필요, vscode.dev에서도 동작), 템플릿을 거쳐도 편집기와 스크롤이 맞춰지고, 오류는 Problems 패널에, 디렉티브·종류·템플릿 함수 자동 완성, 편집기 옆의 개요 보기와 발표자 보기, slides를 통한 내보내기를 제공합니다. GitHub 릴리스에 첨부된 .vsix를 설치하세요. Marketplace와 Open VSX 게시는 준비되어 있지만 아직 올라가지 않았습니다. VS Code →
문서 패밀리의 인디고 색으로 그린, 받침대 위의 슬라이드 마크와 그 모든 형식: SVG, PNG, JPG, ICO, ICNS, 아바타, 소셜 이미지.
go-richdoc, go-ooxml, go-tex, go-docutils와 함께: 문서를 Go로 읽고, 조판하고, 작성합니다. 어디에도 C는 없습니다.
GitHub의 조직 페이지 →