.md file, Marp Engine -> pdf, html, other format
midjourney -> 슬라이드에 필요한 일러스트레이션
11labs 목소리 -> 발표자료 영상으로 만들기
markdown으로 프레젠테이션을 만드는 도구
VS code 확장프로그램으로 사용 가능
장점
1. 간결, 가독성
2. 코드 하이라이팅 지원
3. 테마 커스텀
4. pdf, pptx 등 다양한 형식으로 내보내기 가능
5. 버전 관리 시스템과의 뛰어난 호환성
인라인 html도 가능하게 해줌
기본 문법
'---' 로 슬라이드 구분
'#' 으로 제목 수준 지정
'-' 나 ' 1.' 로 목록 생성
```로 코드 블록 생성
추가 기능
이미지 삽입 및 크기 조절
배경 이미지 설정
CSS를 통한 스타일 커스터마이징
수식 입력 지원 (KoTeX)
Marp 디렉티브
전역 디렉티브 : 문서 상단에 작성
로컬 디렉티브 : 문서 개별에 작성
---
Mermaid란
텍스트 기반의 다이어그램 생성 도구
Markdown과 유사한 문법 사용
서비스 코드 넣고 Mermaid로 시퀀스 다이어그램을 그려줘 ( 이렇게 넣기)
마크다운 파일 최하단에 Mermiad script 코드 부분 넣기.
Mermaid Extension은 권장 X
만약 Mermaid 안나오면
change preview settings에서 javascript 실행 가능하게 permit all 해주기
주의점
Mermaid 공식 문서에 나와있듯,
Mermaid가 생성되면 div class="mermaid"로 주고 감싸줘야 Marp에서 작동함
SVG를 통한 이미지 생성
도형, 다이어그램, 등등에 쓰임
디자인 수정 가능
선택 기준
로고, 아이콘 : SVG 선호
사진, 복잡한 이미지
대신 SVG는 좀 멍청함
프롬프트 잘 넣기
생성 ai 기반으로 svg 생성하고 활용하기
효과적인 활용 방법
1. 초기 아이디어 구상 단계에서 사용
2. 기본 템플릿으로 사용 후 수동으로 세부 조정
3. SVG 구조 학습 및 이해를 위한 도구로 활용
4. 간단한 아이콘이나 로고의 빠른 프로토타이핑
5. PPTX에 가져가서 편집도 가능
6. Adobe Illustrator에서도 편집 가능
전체 슬라이드 스타일 변경(CSS 형식)
section : '---' 로 나뉜 Marp의 각 슬라이드를 나타내는 선택자
배경색, 글꼴, 텍스트 색상 등을 일괄 변경 가능
pre : 코드 블록 스타일링
로컬 디렉티브 -> 특정 section만 특정 스타일 주고 싶을 때
페이지 번호 스타일링
section::after
CSS 사용 방법
외부 CSS 파일 연결
---
marp : true
theme : default
style : css.css
---
해커톤에서 항상 나오는 슬라이드가 뭐임
ㅋㅋ
팀원소개도 간응