{"library":"reveal.js","title":"reveal.js: The HTML Presentation Framework","description":"reveal.js is an open-source framework for creating interactive, browser-based presentations using HTML, CSS, and JavaScript. The current stable version is 6.0.1, with frequent minor and patch releases addressing bugs and introducing new features, and major versions typically bringing significant architectural or feature additions (e.g., v5.0 introduced scroll view, v6.0 introduced an official React wrapper). Key differentiators include its extensibility via a rich API and plugins, support for nested slides, Markdown, Auto-Animate, PDF export, speaker notes, LaTeX typesetting, and syntax-highlighted code. It stands out by allowing presentations to be consumed as traditional slides or as a scrollable web page, providing flexibility for different viewing contexts. The recent introduction of an official React wrapper (`@revealjs/react`) offers a component-based approach for building decks, appealing to modern web development workflows.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install reveal.js"],"cli":null},"imports":["import Reveal from 'reveal.js'","import Reveal from 'reveal.js'; Reveal.initialize({...});","import RevealMarkdown from 'reveal.js/plugin/markdown/markdown.esm.js'"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import Reveal from 'reveal.js';\nimport Markdown from 'reveal.js/plugin/markdown/markdown.esm.js';\nimport Highlight from 'reveal.js/plugin/highlight/highlight.esm.js';\n\ndocument.addEventListener('DOMContentLoaded', () => {\n  // Create a basic presentation structure\n  document.body.innerHTML = `\n    <div class=\"reveal\">\n      <div class=\"slides\">\n        <section>\n          <h1>Hello reveal.js!</h1>\n          <p>This is your first slide.</p>\n        </section>\n        <section data-markdown>\n          <textarea data-template>\n            ## Markdown Slide\n            * Item 1\n            * Item 2\n            \n            ```javascript\n            console.log('Hello from code block');\n            ```\n          </textarea>\n        </section>\n        <section>\n          <h2>Features</h2>\n          <ul>\n            <li>HTML & Markdown support</li>\n            <li>Plugins for Math, Code Highlight, Notes</li>\n            <li>Speaker View</li>\n          </ul>\n        </section>\n      </div>\n    </div>\n  `;\n\n  let deck = new Reveal({\n    plugins: [Markdown, Highlight],\n    controls: true,\n    progress: true,\n    hash: true,\n    center: true,\n    transition: 'slide',\n    // Optional: Enables scroll view for presentations.\n    // Note: Scroll view is new in v5.0.0 and above.\n    // scrollMode: 'paged'\n  });\n\n  deck.initialize();\n  console.log('reveal.js initialized!');\n});\n","lang":"typescript","description":"This quickstart initializes a basic reveal.js presentation with two slides, demonstrating HTML and Markdown content, and integrating the Markdown and Highlight plugins. It shows how to set up the HTML structure and configure Reveal.js programmatically using ESM imports.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}