GitHub - MaxGripe/skunk-html

GitHub – MaxGripe/skunk-html

Automatically generate a website on GitHub Pages using Markdown files as the source!

Markdown in, GitHub Pages out!

Your own Markdown blog on GitHub in under 60 seconds:

  1. Fork SkunkHTML repository on GitHub.
  2. Enable GitHub Pages in the repository settings (choose GitHub Actions as the source).
  3. Done! Your blog is online! Example: https://max.gripe/skunk-html/

Upload Markdown (.md) files to publish new posts.

When a Markdown (.md) file is created and placed in the /markdown-blog/ folder, the rest happens automagically. GitHub Actions detects changes pushed to the repository, triggers the build process, and deploys the updated site.

  • Blog articles and other content are written in Markdown, allowing for easy content creation and management. These Markdown files are automatically converted to HTML during the build process using F# and the FSharp.Formatting library.

  • The deployment process is fully automated using GitHub Actions. Any changes to this repository are immediately reflected on the live site.

  • Giscus comment system is supported.

  • The repository is 100% ready to work directly on GitHub without the need to download it locally. Simply fork it to create your own website. Don’t forget to enable GitHub Pages in repo! (Settings ➔ Pages ➔ Build and deployment: “GitHub Actions”).

  • /: Root directory of the project.

    • .github/workflows/: GitHub Actions workflow file. Responsible for automatically generating final website on GitHub Pages
    • assets/: Files used across the entire site, such as the avatar, favicon, and other shared resources.
    • css/: CSS files for the site.
    • fonts/: Custom fonts go here.
    • html/: HTML fragments used throughout the site, such as the title and footer.
    • markdown-blog/: Directory containing the Markdown files for articles and other content. Blog articles are identified by file names that start with a digit.
      • images/: Images used in the articles.
    • scripts/: Syntax highlighting script and optionally other custom scripts..
    • skunk-html-output/: Directory that will be created during the build process, with the generated HTML files.
  • LICENSE: License file for the project.

  • Program.fs: F# program that handles the generation of HTML from Markdown

  • README.md: This file.

  • skunk-html.fsproj: Project file

Detailed examples can be found at: https://max.gripe/skunk-html

Feel free to post in the discussions section for suggestions, open an issue to report problems, or submit a pull request if you’d like to contribute improvements to the site. Your input is always welcome!

This project is licensed under the terms of the Unlicense.

It also uses some external stuff, each with its own license:

Optional self-hosting and custom build

Although GitHub builds and hosts this site excellently, if you really want to, you can build your blog locally, for example to host it yourself. To do this:

  1. Download and install .NET on Linux / macOS / Windows
  2. Run the following commands
git clone https://github.com/MaxGripe/skunk-html.git
cd skunk-html
dotnet restore
dotnet run
  1. Done. Your site is in the skunk-html-output folder.

Leave a Comment

Your email address will not be published. Required fields are marked *