---
title: "#쿼츠: #댓글 #소통 §disqus §giscus §remark42"
url: "https://notes.junghanacs.com/notes/20240908T163541"
author: "Junghan Kim"
date: "2024-09-08T16:35:00+09:00"
lastmod: "2026-02-17T00:00:00+09:00"
tags: ["bib","comment","quartz","reactions"]
description: "Quartz 블로그에서 댓글과 소통 기능을 Disqus, Giscus, Remark42로 비교한 기록."
---

> [!abstract] 이 노트에 대하여
> 
> Quartz 기반 블로그에서 댓글 시스템을 어떻게 붙일지 Disqus, Giscus, Remark42를 비교한다. 단순 기능보다 소유권과 구현 복잡성, 장기 운영 감각이 판단 기준으로 제시된다.

## 히스토리

-   [2026-02-17 Tue 10:26] REMARK42 적용
-   [2025-06-14 Sat 17:47] 좋아보이네 사례를 보니까
-   [2025-01-14 Tue 17:47] giscus 그냥 사용. 기본이니까
-   [2024-09-08 Sun 16:35] 디스쿠스 검토

## 관련메타

-   [#소통 #대화 #문자 #연락](https://notes.junghanacs.com/meta/20241006T081807)
-   [#콰르토](https://notes.junghanacs.com/meta/20241006T075550)

## BIBLIOGRAPHY

- “Add Disqus on Quartz.” n.d. Accessed June 15, 2024. <https://gurumii.com/Quartz/Add-Disqus>.
- “Giscus - 댓글 반응 깃허브.” 2021. May 15, 2021. <https://giscus.app/ko>.
- “Remark42 Comments - Be-Far 쿼츠.” 2024. April 4, 2024. <https://be-far.com/Projects/Obsidian/quartz-comments>.
- “Remark42 – Privacy-Focused Lightweight Commenting Engine.” n.d. Accessed June 15, 2024. <https://remark42.com/>.

## 2026 REMARK42 적용

## 2024 #디스쿠스 Quartz에 Disqus를 추가하는 방법 및 오류 관리.

[2024-09-08 Sun 16:35]

-   "Add Disqus on Quartz"

그리고, 블로그 #디스쿠스 ([“Add Disqus on Quartz” n.d.](https://notes.junghanacs.com/notes/20240908T163541#citeproc_bib_item_1)) 를 참고하여 Disqus 를 넣는다. 이게 편하겠다. 아니면 깃허브 기반으로 하면 된다. 리마크는 복잡하다.

```javascript
diff --git a/quartz/components/renderPage.tsx b/quartz/components/renderPage.tsx
index 251a53f..aa1cf8b 100644
--- a/quartz/components/renderPage.tsx
+++ b/quartz/components/renderPage.tsx
@@ -8,6 +8,7 @@ import { visit } from "unist-util-visit"
 import { Root, Element, ElementContent } from "hast"
 import { GlobalConfiguration } from "../cfg"
 import { i18n } from "../i18n"
+import Disqus, { disqusScript } from "./Disqus" // custom component

 interface RenderComponents {
   head: QuartzComponent
@@ -232,6 +233,7 @@ export function renderPage(
                 </div>
               </div>
               <Content {...componentData} />
+              {componentData.fileData.frontmatter?.disqus && <Disqus slug={slug} />}
             </div>
             {RightComponent}
           </Body>
@@ -241,6 +243,9 @@ export function renderPage(
       {pageResources.js
         .filter((resource) => resource.loadTime === "afterDOMReady")
         .map((res) => JSResourceToScriptElement(res))}
+      {componentData.fileData.frontmatter?.disqus && (
+          <script data-cfasync="false" type="text/javascript" dangerouslySetInnerHTML={{ __html: disqusScript }} />
+          )}
     </html>
   )
```

component/Disqus.tsx

```javascript

import { FunctionComponent } from "preact"
interface DisqusProps {
  slug: string
}
const Disqus: FunctionComponent<DisqusProps> = ({ slug }) => {
  return (
    <div id="disqus_thread" data-slug={slug} style="color-scheme: normal"></div>
  )
}
export const disqusScript = `
  var disqus_config = function () {
    this.page.url = window.location.href;
    this.page.identifier = document.getElementById('disqus_thread').dataset.slug;
  };
  setTimeout(function() {
    var d = document, s = d.createElement('script');
    s.src = 'https://idencosmos.disqus.com/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
  }, 500);  // 0.5초 후에 로드
`

export default Disqus
```

동작 된다.

## 2025 §giscus - 댓글 반응 깃허브

([“Giscus - 댓글 반응 깃허브” 2021](https://notes.junghanacs.com/notes/20240908T163541#citeproc_bib_item_2))

A comments widget built on GitHub Discussions. GitHub Discussions로 작동하는 댓글 시스템입니다. 방문자가 GitHub를 통해 웹사이트에 댓글과 반응을 남기게 해보세요! utterances에서 큰 영감

## §Remark42 – Privacy-focused lightweight commenting engine

[2025-06-14 Sat 17:47] ([“Remark42 – Privacy-Focused Lightweight Commenting Engine” n.d.](https://notes.junghanacs.com/notes/20240908T163541#citeproc_bib_item_4))

### Remark42 Comments - be-far

([“Remark42 Comments - Be-Far 쿼츠” 2024](https://notes.junghanacs.com/notes/20240908T163541#citeproc_bib_item_3))

I recently added Remark42 for comments. It’s still a work in progress, and I plan to update quite a few things about it in future since it was pretty untested when I found the plugin for it.