---
title: "Quick tip: hosting HTML/CSS/JS demos from source code on GitHub Pages"
url: https://daily.dev/posts/quick-tip-hosting-html-css-js-demos-from-source-code-on-github-pages-h9ycntnrq
source_url: https://christianheilmann.com/2026/02/28/quick-tip-hosting-html-css-js-demos-from-source-code-on-github-pages/
type: article
source: "Christian Heilmann"
published: 2026-02-28T11:39:04.264Z
updated: 2026-02-28T11:39:20.974Z
tags: ["webdev", "javascript", "html", "github-pages"]
reading_time: 2
upvotes: 0
comments: 0
language: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Quick tip: hosting HTML/CSS/JS demos from source code on GitHub Pages

**[Christian Heilmann](https://daily.dev/sources/christianheilmann)** · 2 min read · 0 upvotes · 0 comments

## Summary

A quick guide showing how to host live HTML/CSS/JS demos alongside their source code using GitHub Pages. By using Jekyll's `include_relative` tag inside a Markdown file, you can embed and display both the running demo and syntax-highlighted source code in one page. The post walks through forking an example repo, enabling GitHub Pages via repository settings, deploying from the main branch, and monitoring the build via the Actions tab.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://christianheilmann.com/2026/02/28/quick-tip-hosting-html-css-js-demos-from-source-code-on-github-pages/>

## Similar posts on daily.dev

- [GitHub for Beginners: Getting started with GitHub Pages](https://daily.dev/posts/github-for-beginners-getting-started-with-github-pages-jmwkcmpj0) · GitHub Blog · 0 upvotes · 0 comments
- [Serving Markdown for AI Agents](https://daily.dev/posts/serving-markdown-for-ai-agents-dkkggwqnh) · Josh Hornby · 0 upvotes · 0 comments

---

Tags: [#webdev](https://daily.dev/tags/webdev), [#javascript](https://daily.dev/tags/javascript), [#html](https://daily.dev/tags/html), [#github-pages](https://daily.dev/tags/github-pages)

[View this post on daily.dev](https://daily.dev/posts/quick-tip-hosting-html-css-js-demos-from-source-code-on-github-pages-h9ycntnrq)