Skip to content

Instantly share code, notes, and snippets.

@BadMagic100
Created November 25, 2022 23:00
Show Gist options
  • Save BadMagic100/6b64bc5dbba7b8197dc1d6dc05aab3a4 to your computer and use it in GitHub Desktop.
Save BadMagic100/6b64bc5dbba7b8197dc1d6dc05aab3a4 to your computer and use it in GitHub Desktop.
Setting up DocFX and GitHub Pages for a library mod

Intro

These instructions describe how to set up DocFX and publish documentation as a static website to your repository's GitHub Pages. They are targeted at Hollow Knight modders and use some conventions that have been generally adopted in the Hollow Knight modding community, but should be generally applicable to other types of projects as well.

As a note before we begin, much of this content has room for preferential variation. In general, this documentation assumes the following:

  1. You have an existing C# project that you want to add docs to (i.e. you are not starting from scratch) and that your project is in the the default C# project layout (solution in its own folder, csproj's nested one level deeper alongside their contents).
  2. You want your documentation in a folder named docs inside the top-level solution directory, and will document only one project in your solution.
  3. You want your documentation to be hosted on a separate git branch, named docs-source.

If you want to deviate from this pattern, that is certainly acceptable, but the copy-paste-ability of some of the resources I will share here will be reduced. I will point out some of the places you may want to make changes and the side-effects of those changes when applicable.

Installing DocFX locally

This step is not strictly necessary, but will provide more tools to easily initialize your documentation setup and allow you to preview your changes locally before pushing them.

There are several ways to install and use DocFX. In my experience, DocFX's tooling is generally overly opinionated, and as such I strongly recommend using DocFX as a command-line tool installed through a package manager (Chocolatey on Windows or Homebrew on OSX/Linux). This is simply because the CLI does the least for you, and therefore gives you the most control over how you want to structure your project. DocFX's documentation tells you how to do this with links to the package managers as well if you don't have them installed.

Creating your DocFX project

Before you start, you should stash or commit any current changes you have in development so you won't lose them if anything goes wrong.

  1. Open a terminal in the directory with your solution in it (or wherever else you may want your docs to reside).
  2. Run docfx init. This wizard will present you with several configuration options. In my experience, the defaults are all fine, but review them all in case you want to make changes.
  3. mv docfx_project docs
  4. Open docs/docfx.json in your favorite text editor. We'll want to make some changes.
    1. In the src section of the metadata section, add a src property pointing to .., like so. This allows docfx to start searching for source files up a level rather than from within the docs folder. If you have multiple projects in the solution, you should also change the files section from **/**.csproj to YourProjectName/**.csproj so you don't generate extra documentation.
    2. Optionally, in the build section, link to the .NET xref service so that DocFX can link to documentation for framework types, like so.
    3. Optionally, create a filter config to ignore certain namespaces/types/whatever, like so. The format of the filter config file is well-documented here.
  5. Run docfx docs/docfx.json --serve to make sure your docs will build and preview them in a browser.
  6. Gitignore the docs directory you've created from your main branch; commit that before continuing.
  7. cd docs
  8. Initialize the docfx project as its own git root: git init
  9. Create and checkout a branch for docs: git checkout -b docs-source
  10. Add your git repo as a remote: git remote add origin <your github repo link>.git
  11. Set the upstream branch: git branch -u origin/docs-source
  12. Commit and push your changes to docs.

If you want your docs on your main branch, you can simply skip steps 6-11.

Github Actions and Github Pages

Now that your docs are set up and hosted, you'll want to automate their build and publish process. Still in your docs folder on the docs-source branch, create a folder .github/workflows. In that folder, you'll create a workflow definition. You should more-or-less be able to copy-paste this file. Any changes you've made to branch/folder naming and file placement will need to be reflected here as well. Committing and pushing this will run the workflow, and publish your website to a new branch gh-pages. Then, in your repository settings under "Code and Automation," go to Pages, and select the gh-pages branch to publish, and use the root directory.

Once you've verified your actions are working, you'll need a copy of your workflow on your main branch as well. As-is, your site will only be updated when changes are made to docs-source because Github assumes that nobody uses orphan branches. The benefit of this is that you can also set different triggers on main (e.g. you might want to update your API docs only when a new release is published, but update your articles any time you push changes on docs-source).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment