In this lesson we'll use mdx-deck to create a slide deck using Markdown and React. We'll look at adding multiple slides, code snippets, and importing React components. We'll also leverage the mdx-deck CLI for our development environment and building for production.
Additional Resources:
https://egghead.io/lessons/react-create-and-import-react-components-with-markdown-using-mdxc
https://github.com/jxnblk/mdx-deck
https://twitter.com/jxnblk/status/1023667155324346373
Install:
yarn add mdx-deck
deck.mdx:
export {book as theme} from 'mdx-deck/themes' # Hello! this is my first slide! --- # We will see how mdx-deck works ```notes These are only visible in presenter mode ``` --- ```jsx <Button /> ``` --- import Counter from 'components/Counter' <Counter />
package.json:
"scripts": { "start": "mdx-deck deck.mdx", "build": "mdx-deck build deck.mdx" },