@abhisheknairofficial/use-markdown

A simple React Hook which lets you use MD files in a React application

Usage no npm install needed!

<script type="module">
  import abhisheknairofficialUseMarkdown from 'https://cdn.skypack.dev/@abhisheknairofficial/use-markdown';
</script>

README

useMarkDown

useMarkDown is a simple React Hook that lets you show your MD file contents as a React component. This is built using React Markdown, and I have just made a separate one for convenience.

Installation

Installation is straight-forward. Use either npm or yarn.

npm i @abhisheknairofficial/use-markdown

or

yarn add @abhisheknairofficial/use-markdown

Usage

  1. Import into your file as follows:
import useMarkDown from '@abhisheknairofficial/use-markdown'
  1. Import your MD file similarly
import MARKDOWN_FILE from '../foo/bar/index.md'
  1. Use it in your component in either of the following ways:
const MyReactComponent = (props) => {
    const myMarkdownData = useMarkDown(MARKDOWN_FILE)

    return <>{myMarkdownData}</>
}

or

const MyReactComponent = (props) => {
    return <>{useMarkDown(MARKDOWN_FILE)}</>
}