jamiebuilds/spectacle-code-slide


metal Present code with style

http://jamiebuilds.github.io/spectacle-code-slide/

License: MIT

Language: JavaScript


spectacle-code-slide

Present code with style using spectacle.

Dude, you just changed the code presentation game@kenwheeler

Install

$ npm install --save spectacle
$ npm install --save spectacle-code-slide

Usage

import React from 'react';
import { Spectacle, Deck } from 'spectacle';
import CodeSlide from 'spectacle-code-slide';
import shiaLabeoufMagicGif from "./shiaLabeoufMagic.gif"
import preloader from "spectacle/lib/utils/preloader";

preloader({
  shiaLabeoufMagicGif
});

export default class Presentation extends React.Component {
  render() {
    return (
      <Spectacle theme={theme}>
        <Deck transition={[]} transitionDuration={0} progress="bar">
          // ...
          <CodeSlide
            transition={[]}
            lang="js"
            code={require("raw-loader!../assets/code.example")}
            ranges={[
              { loc: [0, 270], title: "Walking through some code" },
              { loc: [0, 1], title: "The Beginning" },
              { loc: [1, 2] },
              { loc: [1, 2], note: "Heres a note!" },
              { loc: [2, 3] },
              { loc: [4, 7], image: shiaLabeoufMagicGif },
              { loc: [8, 10] },
              // ...
            ]}/>
          // ...
        </Deck>
      </Spectacle>
    );
  }
}

Syntax Highlighting

Provided by PrismJS. See http://prismjs.com/ for docs.

Project Statistics

Sourcerank 10
Repository Size 8.06 MB
Stars 4,039
Forks 195
Watchers 52
Open issues disabled
Dependencies 402
Contributors 12
Tags 16
Created
Last updated
Last pushed

Top Contributors See all

Jamie Kyle Ken Wheeler Mike Kusold Adam Tuttle Bradley Spaulding Gustavo Machado Freddy Harris Valery Bugakov Ryan Nixon Salim Gary Rennie Jiayi Hu Charles King

Packages Referencing this Repo

spectacle-code-slide
Present code with style.
Latest release 0.5.2 - Updated - 4.04K stars
@stevekinney/spectacle-code-slide
Present code with style. (A fork that works with React 16)
Latest release 0.4.0 - Published - 4.04K stars
@bam.tech/spectacle-code-slide
Present code with style.
Latest release 0.7.0 - Updated - 4.04K stars
@loklaan/spectacle-code-slide
Present code with style.
Latest release 0.3.2-5 - Updated - 4.04K stars
@dschau/spectacle-code-slide
Present code with style.
Latest release 0.4.0 - Published - 4.04K stars
spectacle-code-slide-forked
Present code with style.
Latest release 0.4.0 - Published - 4.04K stars
spectacle-code-slide-fork-react16
Present code with style.
Latest release 0.11.0 - Updated - 4.04K stars

Recent Tags See all

v0.5.2 January 09, 2018
v0.3.1 August 25, 2016
v0.3.0 August 25, 2016
v0.2.0 August 19, 2016
v0.1.11 August 19, 2016
v0.1.10 March 30, 2016
v0.1.9 March 27, 2016
v0.1.8 March 27, 2016
v0.1.7 March 27, 2016
v0.1.6 March 27, 2016
v0.1.5 March 27, 2016
v0.1.4 March 27, 2016
v0.1.3 March 27, 2016
v0.1.2 March 26, 2016
v0.1.1 March 26, 2016

Something wrong with this page? Make a suggestion

Last synced: 2019-08-07 15:02:29 UTC

Login to resync this repository