[React] Build a slide deck with mdx-deck using Markdown + React

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"

  },

巴特西

[React] Build a slide deck with mdx-deck using Markdown + React

最新文章

热门文章