본문 바로가기

프리젠테이션 자바스크립트 프레임워크 「reveal.js」

by Recstasy 2020. 5. 25.

reveal.js

reveal.js는 ppt와 같은 프리젠테이션 소프트웨어를 웹에서 구현할 때 사용할 수 있는 자바스크립트 프레임워크다. 

 

reveal.js는 오픈소스 프레임워크이며, 프리젠테이션 제작 웹앱에 관련된 API를 제공한다. 사용법은 상당히 간단한 편에 속하고, "<iframe>태그" 혹은 "Javascript API 자체개발" 두가지 방식으로 서비스를 제공할 수 있다. reveal.js로 제작할 수 있는 대표적인 기능들은 아래와 같다.


1] 슬라이드 기능

2] 자동 애니메이션

3] PDF 내보내기

4] 음성 노트기능

5] 폰트관련 기능

6] 마크다운 관련


reveal.js는 CDN을 제공하지 않는다. git을 통해 직접 api를 다운받는 방식으로 사용할 수 있으며, npm방식을 지원한다. 라이브러리가 아닌 프레임워크인 만큼 npm을 통해 간단한 명령어 단 2줄이면 설치가 끝난다. (reveal.js 사이트 참고)

 

https://revealjs.com/#/

 

The HTML presentation framework | reveal.js

Documentation and demos for the open source reveal.js HTML presentation framework.

revealjs.com

reveal.js은 제이쿼리와 비슷하며, 제이쿼리로 프로젝트를 진행한 경험이 있다면 누구나 만족할 만한 아웃풋을 낼 수 있다. 아래와 같이 class명을 reveal.js의 규칙에 따라 작성하는 것만으로도 멋진 슬라이드를 만들 수 있다.

 

제이쿼리 방식
슬라이드 구현

 

자바스크립트와 html5의 폼을 응용한다면 웹에서 간단한 프리젠테이션 자료를 만들 수 있는 웹앱을 개발할 수 있다. 만일 css디자인에 익숙하다면 커스터마이징을 통한 pt제작 서비스까지 가능하다. 또, 애니메이팅 기능을 활용한다면, api를 수정해서 비주얼노벨같은 장르도 제작할 수 있을 듯하다.

 

 

댓글

최신글 전체

이미지
제목
글쓴이
등록일