ar.falsy.cat/notes/docker/index.html

59 lines
16 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html><html lang=en><head><meta charset=utf-8><meta name=description content="If you want to host Quartz on a machine without using a webpage hosting service, it may be easier to install Docker Compose and follow the instructions below than to install Quartz&rsquo;s dependencies manually."><meta property="og:title" content="Hosting with Docker"><meta property="og:description" content="If you want to host Quartz on a machine without using a webpage hosting service, it may be easier to install Docker Compose and follow the instructions below than to install Quartz&rsquo;s dependencies manually."><meta property="og:type" content="website"><meta property="og:image" content="https://falsy.cat/icon.png"><meta property="og:url" content="https://falsy.cat/notes/docker/"><meta property="og:width" content="200"><meta property="og:height" content="200"><meta name=twitter:card content="summary"><meta name=twitter:title content="Hosting with Docker"><meta name=twitter:description content="If you want to host Quartz on a machine without using a webpage hosting service, it may be easier to install Docker Compose and follow the instructions below than to install Quartz&rsquo;s dependencies manually."><meta name=twitter:image content="https://falsy.cat/icon.png"><meta name=twitter:site content="_jzhao"><title>Hosting with Docker</title><meta name=viewport content="width=device-width,initial-scale=1"><link rel="shortcut icon" type=image/png href=https://falsy.cat//icon.png><link href=https://falsy.cat/styles.b369a84b3c6e6bfd686ad1f9da65641c.min.css rel=stylesheet><link href=https://falsy.cat/styles/_light_syntax.86a48a52faebeaaf42158b72922b1c90.min.css rel=stylesheet id=theme-link><script src=https://falsy.cat/js/darkmode.99648ef714ed1ed9c3633d3858f3741d.min.js></script>
<script src=https://falsy.cat/js/util.a0ccf91e1937fe761a74da4946452710.min.js></script>
<link rel=preload href=https://cdn.jsdelivr.net/npm/katex@0.15.1/dist/katex.min.css as=style onload='this.onload=null,this.rel="stylesheet"' integrity=sha384-R4558gYOUz8mP9YWpZJjofhk+zx0AS11p36HnD2ZKj/6JR5z27gSSULCNHIRReVs crossorigin=anonymous><script defer src=https://cdn.jsdelivr.net/npm/katex@0.15.1/dist/katex.min.js integrity=sha384-z1fJDqw8ZApjGO3/unPWUPsIymfsJmyrDVWC8Tv/a1HeOtGmkwNd/7xUS0Xcnvsx crossorigin=anonymous></script>
<script defer src=https://cdn.jsdelivr.net/npm/katex@0.15.1/dist/contrib/auto-render.min.js integrity=sha384-+XBljXPPiv+OzfbB3cVmLHf4hdUFHlWNZN5spNQ7rmHTXpd7WvJum6fIACpNNfIR crossorigin=anonymous></script>
<script defer src=https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/contrib/copy-tex.min.js integrity=sha384-ww/583aHhxWkz5DEVn6OKtNiIaLi2iBRNZXfJRiY1Ai7tnJ9UXpEsyvOITVpTl4A crossorigin=anonymous></script>
<script async src=https://unpkg.com/@floating-ui/core@0.7.3></script>
<script async src=https://unpkg.com/@floating-ui/dom@0.5.4></script>
<script async src=https://falsy.cat/js/popover.aa9bc99c7c38d3ae9538f218f1416adb.min.js></script>
<script defer src=https://falsy.cat/js/code-title.ce4a43f09239a9efb48fee342e8ef2df.min.js></script>
<script defer src=https://falsy.cat/js/clipboard.2913da76d3cb21c5deaa4bae7da38c9f.min.js></script>
<script defer src=https://falsy.cat/js/callouts.7723cac461d613d118ee8bb8216b9838.min.js></script>
<script>const SEARCH_ENABLED=!1,LATEX_ENABLED=!0,PRODUCTION=!0,BASE_URL="https://falsy.cat/",fetchData=Promise.all([fetch("https://falsy.cat/indices/linkIndex.5527d50d14f23ac29fce778fdc24df51.min.json").then(e=>e.json()).then(e=>({index:e.index,links:e.links})),fetch("https://falsy.cat/indices/contentIndex.b513420465655eb42e25a33ac7594ea5.min.json").then(e=>e.json())]).then(([{index:e,links:t},n])=>({index:e,links:t,content:n})),render=()=>{const e=new URL(BASE_URL),t=e.pathname,n=window.location.pathname,s=t==n;addCopyButtons(),addTitleToCodeBlocks(),addCollapsibleCallouts(),initPopover("https://falsy.cat",!0);const o=document.getElementById("footer");if(o){const e=document.getElementById("graph-container");if(!e)return requestAnimationFrame(render);e.textContent="";const t=s&&!1;drawGraph("https://falsy.cat",t,[{"/moc":"#4388cc"}],t?{centerForce:1,depth:-1,enableDrag:!0,enableLegend:!1,enableZoom:!0,fontSize:.5,linkDistance:1,opacityScale:3,repelForce:1,scale:1.4}:{centerForce:1,depth:1,enableDrag:!0,enableLegend:!1,enableZoom:!0,fontSize:.6,linkDistance:1,opacityScale:3,repelForce:2,scale:1.2})}var i=document.getElementsByClassName("mermaid");i.length>0&&import("https://unpkg.com/mermaid@9/dist/mermaid.esm.min.mjs").then(e=>{e.default.init()});function a(n){const e=n.target,t=e.className.split(" "),s=t.includes("broken"),o=t.includes("internal-link");plausible("Link Click",{props:{href:e.href,broken:s,internal:o,graph:!1}})}const r=document.querySelectorAll("a");for(link of r)link.className.includes("root-title")&&link.addEventListener("click",a,{once:!0})},init=(e=document)=>{addCopyButtons(),addTitleToCodeBlocks(),renderMathInElement(e.body,{delimiters:[{left:"$$",right:"$$",display:!0},{left:"$",right:"$",display:!1}],macros:{'':"'"},throwOnError:!1})}</script><script type=module>
import { attachSPARouting } from "https:\/\/falsy.cat\/js\/router.d6fe6bd821db9ea97f9aeefae814d8e7.min.js"
attachSPARouting(init, render)
</script><script defer data-domain=falsy.cat src=https://plausible.io/js/script.js></script>
<script>window.plausible=window.plausible||function(){(window.plausible.q=window.plausible.q||[]).push(arguments)}</script></head><body><div id=search-container><div id=search-space><input autocomplete=off id=search-bar name=search type=text aria-label=Search placeholder="Search for something..."><div id=results-container></div></div></div><script src=https://cdn.jsdelivr.net/npm/flexsearch@0.7.21/dist/flexsearch.bundle.js integrity="sha256-i3A0NZGkhsKjVMzFxv3ksk0DZh3aXqu0l49Bbh0MdjE=" crossorigin=anonymous defer></script>
<script defer src=https://falsy.cat/js/full-text-search.e6e2e0c213187ca0c703d6e2c7a77fcd.min.js></script><div class=singlePage><header><h1 id=page-title><a class=root-title href=https://falsy.cat/>🪴 Quartz 3.3</a></h1><div class=spacer></div><div id=search-icon><p>Search</p><svg tabindex="0" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg></div><div class=darkmode><input class=toggle id=darkmode-toggle type=checkbox tabindex=-1>
<label id=toggle-label-light for=darkmode-toggle tabindex=-1><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="dayIcon" viewBox="0 0 35 35" style="enable-background:new 0 0 35 35"><title>Light Mode</title><path d="M6 17.5C6 16.672 5.328 16 4.5 16h-3C.672 16 0 16.672.0 17.5S.672 19 1.5 19h3C5.328 19 6 18.328 6 17.5zM7.5 26c-.414.0-.789.168-1.061.439l-2 2C4.168 28.711 4 29.086 4 29.5 4 30.328 4.671 31 5.5 31c.414.0.789-.168 1.06-.44l2-2C8.832 28.289 9 27.914 9 27.5 9 26.672 8.329 26 7.5 26zm10-20C18.329 6 19 5.328 19 4.5v-3C19 .672 18.329.0 17.5.0S16 .672 16 1.5v3C16 5.328 16.671 6 17.5 6zm10 3c.414.0.789-.168 1.06-.439l2-2C30.832 6.289 31 5.914 31 5.5 31 4.672 30.329 4 29.5 4c-.414.0-.789.168-1.061.44l-2 2C26.168 6.711 26 7.086 26 7.5 26 8.328 26.671 9 27.5 9zM6.439 8.561C6.711 8.832 7.086 9 7.5 9 8.328 9 9 8.328 9 7.5c0-.414-.168-.789-.439-1.061l-2-2C6.289 4.168 5.914 4 5.5 4 4.672 4 4 4.672 4 5.5c0 .414.168.789.439 1.06l2 2.001zM33.5 16h-3c-.828.0-1.5.672-1.5 1.5s.672 1.5 1.5 1.5h3c.828.0 1.5-.672 1.5-1.5S34.328 16 33.5 16zM28.561 26.439C28.289 26.168 27.914 26 27.5 26c-.828.0-1.5.672-1.5 1.5.0.414.168.789.439 1.06l2 2C28.711 30.832 29.086 31 29.5 31c.828.0 1.5-.672 1.5-1.5.0-.414-.168-.789-.439-1.061l-2-2zM17.5 29c-.829.0-1.5.672-1.5 1.5v3c0 .828.671 1.5 1.5 1.5s1.5-.672 1.5-1.5v-3C19 29.672 18.329 29 17.5 29zm0-22C11.71 7 7 11.71 7 17.5S11.71 28 17.5 28 28 23.29 28 17.5 23.29 7 17.5 7zm0 18c-4.136.0-7.5-3.364-7.5-7.5s3.364-7.5 7.5-7.5 7.5 3.364 7.5 7.5S21.636 25 17.5 25z"/></svg></label><label id=toggle-label-dark for=darkmode-toggle tabindex=-1><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="nightIcon" viewBox="0 0 100 100" style="enable-background='new 0 0 100 100'"><title>Dark Mode</title><path d="M96.76 66.458c-.853-.852-2.15-1.064-3.23-.534-6.063 2.991-12.858 4.571-19.655 4.571C62.022 70.495 50.88 65.88 42.5 57.5 29.043 44.043 25.658 23.536 34.076 6.47c.532-1.08.318-2.379-.534-3.23-.851-.852-2.15-1.064-3.23-.534-4.918 2.427-9.375 5.619-13.246 9.491-9.447 9.447-14.65 22.008-14.65 35.369.0 13.36 5.203 25.921 14.65 35.368s22.008 14.65 35.368 14.65c13.361.0 25.921-5.203 35.369-14.65 3.872-3.871 7.064-8.328 9.491-13.246C97.826 68.608 97.611 67.309 96.76 66.458z"/></svg></label></div></header><article><h1>Hosting with Docker</h1><p class=meta>Last updated
Jan 18, 2023
<a href=https://github.com/jackyzha0/quartz/tree/hugo/content/notes/docker.md rel=noopener>Edit Source</a></p><ul class=tags><li><a href=https://falsy.cat/tags/setup/>Setup</a></li></ul><aside class=mainTOC><details><summary>Table of Contents</summary><nav id=TableOfContents><ol><li><a href=#hosting-quartz-locally>Hosting Quartz Locally</a></li><li><a href=#exposing-your-container-to-the-internet>Exposing Your Container to the Internet</a><ol><li><a href=#to-your-public-ip-address-with-port-forwarding-insecure>To Your Public IP Address with Port Forwarding (insecure)</a></li><li><a href=#to-a-domain-using-cloudflare-proxy>To a Domain using Cloudflare Proxy</a></li><li><a href=#to-a-domain-using-a-reverse-proxy>To a Domain using a Reverse Proxy</a></li></ol></li></ol></nav></details></aside><p>If you want to host Quartz on a machine without using a webpage hosting service, it may be easier to
<a href=https://docs.docker.com/compose/install/ rel=noopener>install Docker Compose</a> and follow the instructions below than to
<a href=/notes/preview-changes/ rel=noopener class=internal-link data-src=/notes/preview-changes/>install Quartz&rsquo;s dependencies manually</a>.</p><a href=#hosting-quartz-locally><h2 id=hosting-quartz-locally><span class=hanchor arialabel=Anchor># </span>Hosting Quartz Locally</h2></a><p>You can serve Quartz locally at <code>http://localhost:1313</code> with the following script, replacing <code>/path/to/quartz</code> with the
actual path to your Quartz folder.</p><p>docker-compose.yml</p><div class=highlight><div class=chroma><table class=lntable><tr><td class=lntd><pre tabindex=0 class=chroma><code><span class=lnt> 1
</span><span class=lnt> 2
</span><span class=lnt> 3
</span><span class=lnt> 4
</span><span class=lnt> 5
</span><span class=lnt> 6
</span><span class=lnt> 7
</span><span class=lnt> 8
</span><span class=lnt> 9
</span><span class=lnt>10
</span><span class=lnt>11
</span><span class=lnt>12
</span><span class=lnt>13
</span><span class=lnt>14
</span><span class=lnt>15
</span><span class=lnt>16
</span></code></pre></td><td class=lntd><pre tabindex=0 class=chroma><code class=language-fallback data-lang=fallback><span class=line><span class=cl>services:
</span></span><span class=line><span class=cl> quartz-hugo:
</span></span><span class=line><span class=cl> image: ghcr.io/jackyzha0/quartz:hugo
</span></span><span class=line><span class=cl> container_name: quartz-hugo
</span></span><span class=line><span class=cl> volumes:
</span></span><span class=line><span class=cl> - /path/to/quartz:/quartz
</span></span><span class=line><span class=cl> ports:
</span></span><span class=line><span class=cl> - 1313:1313
</span></span><span class=line><span class=cl>
</span></span><span class=line><span class=cl> # optional
</span></span><span class=line><span class=cl> environment:
</span></span><span class=line><span class=cl> - HUGO_BIND=0.0.0.0
</span></span><span class=line><span class=cl> - HUGO_BASEURL=http://localhost
</span></span><span class=line><span class=cl> - HUGO_PORT=1313
</span></span><span class=line><span class=cl> - HUGO_APPENDPORT=true
</span></span><span class=line><span class=cl> - HUGO_LIVERELOADPORT=-1
</span></span></code></pre></td></tr></table></div></div><p>Then run with: <code>docker-compose up -d</code> in the same directory as your <code>docker-compose.yml</code> file.</p><p>While the container is running, you can update the <code>quartz</code> fork with: <code>docker exec -it quartz-hugo make update</code>.</p><a href=#exposing-your-container-to-the-internet><h2 id=exposing-your-container-to-the-internet><span class=hanchor arialabel=Anchor># </span>Exposing Your Container to the Internet</h2></a><a href=#to-your-public-ip-address-with-port-forwarding-insecure><h3 id=to-your-public-ip-address-with-port-forwarding-insecure><span class=hanchor arialabel=Anchor># </span>To Your Public IP Address with Port Forwarding (insecure)</h3></a><p>Assuming you are already familiar with
<a href=https://en.wikipedia.org/wiki/Port_forwarding rel=noopener>port forwarding</a> and
<a href=https://portforward.com rel=noopener>setting it up with your router model</a>:</p><ol><li>You should set the environment variable <code>HUGO_BASEURL=http://your-public-ip</code> and then start your container.</li><li>Set up port forwarding on your router from port <code>p</code> to <code>your-local-ip:1313</code>.</li><li>You should now be able to access Quartz from outside your local network at <code>http://your-public-ip:p</code>.</li></ol><p>However, your HTTP connection will be unencrypted and <strong>this method is not secure</strong>.</p><a href=#to-a-domain-using-cloudflare-proxy><h3 id=to-a-domain-using-cloudflare-proxy><span class=hanchor arialabel=Anchor># </span>To a Domain using Cloudflare Proxy</h3></a><ol><li>Port forward 443 (HTTPS) from your machine.</li><li>Buy a custom domain (say, <code>your-domain.com</code>) from
<a href=https://www.cloudflare.com/products/registrar/ rel=noopener>Cloudflare</a>. Point a DNS A record from <code>your-domain.com</code> to your public IP address and enable the proxy.</li><li>Set the environment variables <code>HUGO_BASEURL=https://your-domain.com</code>, <code>HUGO_PORT=443</code>, and <code>HUGO_APPENDPORT=false</code>. Change <code>1313:1313</code> to <code>443:443</code> for the <code>ports</code> in <code>docker-compose.yml</code>.</li><li>Spin up your Quartz container and enjoy it at <code>https://your-domain.com</code>!</li></ol><a href=#to-a-domain-using-a-reverse-proxy><h3 id=to-a-domain-using-a-reverse-proxy><span class=hanchor arialabel=Anchor># </span>To a Domain using a Reverse Proxy</h3></a><p>If you want to serve more than just Quartz to the internet on this machine (or don&rsquo;t want to use the Cloudflare registrar and proxy), you should follow the steps in the section above (as appropriate) and also set up a reverse proxy, like
<a href=https://doc.traefik.io/traefik rel=noopener>Traefik</a>. Be sure to configure your TLS certificates too!</p></article><hr><div class=page-end id=footer><div class=backlinks-container><h3>Backlinks</h3><ul class=backlinks><li><a href=/notes/hosting/ data-ctx=Docker data-src=/notes/hosting class=internal-link>Deploying Quartz to the Web</a></li></ul></div><div><script async src=https://cdn.jsdelivr.net/npm/d3@6.7.0/dist/d3.min.js integrity="sha256-+7jaYCp29O1JusNWHaYtgUn6EhuP0VaFuswhNV06MyI=" crossorigin=anonymous></script><h3>Interactive Graph</h3><div id=graph-container></div><style>:root{--g-node:var(--secondary);--g-node-active:var(--primary);--g-node-inactive:var(--visited);--g-link:var(--outlinegray);--g-link-active:#5a7282}</style><script src=https://falsy.cat/js/graph.6579af7b10c818dbd2ca038702db0224.js></script></div></div><div id=contact_buttons><footer><p>Made by Jacky Zhao using <a href=https://github.com/jackyzha0/quartz>Quartz</a>, © 2023</p><ul><li><a href=https://falsy.cat/>Home</a></li><li><a href=https://twitter.com/_jzhao>Twitter</a></li><li><a href=https://github.com/jackyzha0>GitHub</a></li></ul></footer></div></div></body></html>