Render markdown from .md files within a separate GitHub repo

support
5

I ended up getting it to work with this, so now I just need to figure out how to store my secret and pull that in :slight_smile:

renderMarkdownFromGoAlert.html:

 <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<div id="markdown" style="height: 100%;"></div>
<script type="module">
  import { Octokit } from "https://cdn.pika.dev/@octokit/rest";

  const octokit = new Octokit({
    auth: "MY_SECRET",
    userAgent: "goalert",
    baseUrl: "https://api.github.com",
  });

  octokit.repos
    .getContent({
      owner: "target",
      repo: "goalert",
      path: "{{ .Get 0 }}",
    })
    .then((result) => {
      // content will be base64 encoded
      var content = atob(result.data.content).toString();
      // replace rel links from github markdown with abs links
      var toUrl = "https://github.com/target/goalert/blob/master";
      content = content.replace(/\]\(\./g, "](" + toUrl);
      // render within div
      document.getElementById("markdown").innerHTML = marked(content);
    });
</script>

and then in my _index.md I have {{< renderMarkdownFromGoAlert "CONTRIBUTING.md" >}} where that parameter is the path to the file in our repo. Working great so far!

1 Like