Skip to content
Get packs

Spectacle

A React library for building slide presentations by writing JSX, including live code demos.

GitHub Download spectacle@10.2.4
Stars
10.2k
Forks
702
Licence
MIT
Language
TypeScript
Last update
9 days ago
Type
Library

What it is

Spectacle is a JavaScript library built on React that lets you create presentation slides by writing components in JSX, the syntax React uses. Because slides are ordinary React code, you can embed live, running code examples inside a talk. The README describes it as a ReactJS based presentation library and points to a docs site for details.

  • Build a slide deck as a React project and publish it as a web page
  • Embed a running code example directly in a presentation slide
  • Reuse React components across several talks

Great for

  • React developers who want to build slides as code
  • Engineers giving technical talks that include live demos
  • Teams that keep presentations in version control

Not ideal for

  • People who want a drag-and-drop slide editor, since the README describes a code-based library and does not mention a visual editor
  • Non-programmers, because creating slides requires writing React components
Step-by-step guide: how to use SpectacleInstall, first run, examples, tips and FAQs
Spectacle alternativesimpress.js vs Spectaclemdx-deck vs Spectaclereveal.js vs SpectacleSlidev vs Spectacle

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js · npm

    Install the spectacle package from npm

    npm install spectacle
  2. 2

    Run it

    • Read the docs site at https://commerce.nearform.com/open-source/spectacle/docs/
    • Create or use a React project and install the spectacle package
    • Build your first slide components in JSX
    • Run your React app locally to view the deck
  3. 3

    Get the most out of it

    • Use the docs site for the full API and examples, since the README points there
    • Look in the docs folder of the repository for documentation source
    • Check the examples included in the monorepo for working starting points
    • Open issues using the question template if you get stuck

Downloads

Source code (.zip)main branch · straight from GitHubRelease spectacle@10.2.4Release notes and sourceOfficial website & docscommerce.nearform.com/open-source/spectacle/

Strengths

  • Slides are written as JSX, so they fit into an existing React workflow
  • Supports live demos of code within a presentation, according to the description
  • Published under the MIT license and actively maintained per the README

Trade-offs

  • Requires knowledge of React and JavaScript to use
  • The README is short and defers most detail to the docs site and package README
  • Not a visual editor, so layout changes are made in code

How it compares

ProjectStarsTypeLevelUpdatedBest for
spectacle (this)10.2kLibraryintermediate9 days agoReact developers who want to build slides as code
reveal.js72.5kLibraryintermediate1 months agoDevelopers who already write HTML, CSS, or JavaScript and want full control over slide design
slidev49.3kDev toolbeginner14 days agoDevelopers who want to present code, technical talks, or architecture diagrams
mdx-deck11.5kDev toolintermediate3.8 years agoDevelopers who already write React and want to present technical material
nodeppt10.3kDev toolintermediate5.8 years agoDevelopers who prefer writing slides in Markdown over a visual editor
frontend-slides31.7kAI model / agentbeginner5 months agoNon-designers who want good-looking web presentations without writing CSS or JavaScript

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.