Github 토론을 블로그 엔진으로 사용

내가 처음으로 개인 블로그를 가지고 싶다고 생각했을 때, 나는 내가 자신의 창작 체험이 어떤 것인지 알고 싶었다. 비록 매우 좋은 도구가 많지만, 나는 여전히 똑똑하고 창의적인 것을 찾고 싶었다.
나는 GitHub 토론이 매우 강력하다는 것을 발견했다. 그들의 API는 우리에게 완전한 블로그 엔진을 만드는 모든 정확한 도구를 제공했다.
사실, 내 블로그 https://reego.dev/은 완전히 GitHub에서 토론하고 지지합니다!

🔍 초보적 연구

일부 블로그 솔루션을 평가한 후, 나는 "GitHub만 사용하고, 나의 게시물 버전을 가격 인하 파일로 사용할 것"이라고 생각했다.
창작 체험은 매우 간단하다. 저장소에 가격 인하 파일을 만들어서 전송한다.GitHub UI에서 직접 파일을 만들 수도 있고 가격 인하 미리보기도 좋습니다.
비록 이 방법은 효과가 있지만, 나는 그래도 더 좋은 것을 원한다.
저장소에서 가격 인하 파일에 대한 버전 제어는 나에게 결코 멋지지 않지만, GitHub은 여전히 나를 흥미롭게 하는 대체 방안이 있다.
처음에 나는 문제를 블로그 게시물로 사용하려고 했다. 제목, 가격 인하 편집기, 라벨 (모든 면에서 라벨), 평론, 반응, 좋은 검색 API가 있다.
불행하게도, 문제는 블로그 엔진의 관건 중 하나를 소홀히 했다. 모든 사람이 공공 환매 협의에 문제를 만들 수 있다는 것이다.😱
몇몇 연구를 통해 나는 복잡한 조작과 연결에 관여하지 않는 방법을 찾아 이 문제를 해결할 수 없었다. 그래서 나는 비슷한 대체 방법인 토론을 연구했다.

✅ 잘못된 작업에 적합한 올바른 도구

GitHub은 이 문제들이 가져온 모든 멋진 것들, 그리고 다른 것들을 토론했다.한 번 더 살펴보겠습니다.

A 제목

미리 보기 기능이 있는 가격 인하 편집기

레이블(레이블)

리뷰

반응

강력한 검색

쓰기 권한

범주

추가 투표

못 박다

가입 업데이트

GitHub 모바일 어플리케이션

을 통한 모바일 제작 환경 향상

조작을 통한 무한 포인트

몇 가지 수정 작업을 통해 간단한 블로그 엔진을 만들 수 있습니다.

1️⃣ 토론 범주 편집

토론 카테고리는 우리의 목표에 매우 중요하다.

은 강제적이기 때문에 최소한 하나가 필요합니다. 설령 당신의 블로그에서 분류를 사용하지 않더라도.

각 범주의 토론 형식을 편집한 다음 공지를 선택해야 합니다.

범주를 공지로 설정하면 저장소 관리자만 해당 범주에서 토론을 작성할 수 있으며, 모든 범주가 공지로 설정되면 관리자를 제외한 모든 사용자의 "새 토론"단추가 사라집니다.

2️⃣ 첫 번째 댓글 만들기

게시물을 조회하기 위해서, 기본 GitHub UI에서는 볼 수 없으며, 유쾌하지 않은 URL 형식인 /blog/D_kwDOGN2Rdc4AN6ar을 사용해야 합니다.
예쁜 URL을 사용하려면 창의력이 있어야 한다. 내가 선택한 방법은 내 게시물의 본문에 frontmatter 부분을 추가하는 것이다.GitHub Markdown preview는 이에 대해 불평하지 않기 때문에 게시물에 메타데이터를 추가할 수 있는 효과적인 방법입니다.
frontmatter 부분을 사용하면 slug 속성을 추가하여 저희 게시물을 검색할 수 있습니다.(댓글에 대한 간단한 설명으로 또 다른frontmatter 속성을 추가했습니다.)

Note that the uniqueness of the slug is entirely up to us. As long as our blog does not have hundreds of posts it won't be a problem.

Markdown의 첫 번째 게시물입니다.

---
slug: our-first-blog-post
description: "Writing our first blog post as a GitHub discussion"
---

## This is a post
How cool is that?

셋️⃣ GitHub API를 사용하여 게시물 조회

간단한 Graphql 조회를 통해 Google 댓글을 조회할 수 있습니다. (RESTAPI는 토론 등 GitHub의 새로운 기능에 적용되지 않습니다.)

query ($query: String!) {
    search(query: $query, type: DISCUSSION, first: 1) {
      edges {
        node {
          ... on Discussion {
            title
            body
            createdAt
            updatedAt

            category {
              id
              name
            }

            labels(first: 10) {
              edges {
                node {
                  id
                  name
                  color
                }
              }
            }
          }
        }
      }
    }
 }

질의 변수에는 다음 문자열이 포함됩니다.

const repo = 'reegodev/reego.dev'
const slug = 'our-first-blog-post'
const variables = {
  query: `"slug: ${slug}" in:body repo:${repo}`
}

이 검색은 기본적으로 본문에 저희 게시물을 포함하는 첫 번째 토론이며, 특정한 리포에 포함됩니다.
이 검색을 실행한 후에, 우리는 우리의 댓글을 검색하고, 우리가 가장 좋아하는 태그 해상도를 사용하여 그것을 보여 주어야 한다.

Don't forget to create a personal access token with all the "repo" permissions to send along as a bearer token

4️⃣ 토론 의견 포함(옵션)

토론 평론을 우리의 문장에 직접 삽입하기 위해서 나는 놀라운 항목을 발견했다. 그것이 바로 Giscus이다.
GitHub API를 사용하여 의견을 얻고 방문자들이 GitHub 계정을 사용하여 사이트에서 직접 글을 올릴 수 있도록 합니다.
Giscus 구성은 다음 질문에 대한 답변을 통해 작성할 수 있습니다.

<script src="https://giscus.app/client.js"
      data-repo="reegodev/reego.dev"
      data-repo-id="R_kgDOGTk7pw"
      data-mapping="number"
      data-term="{ post.number }"
      data-reactions-enabled="1"
      data-emit-metadata="0"
      data-theme="dark_dimmed"
      data-lang="en"
      crossorigin="anonymous"
      async>
</script>

이 작은 부분을 끼워 넣으면 평론이 나올 것이다. 정말 너무 간단하다!

🚀 잠재력이 크다고?

한 편의 글을 얻는 것은 우리가 토론을 블로그 엔진으로 사용할 수 있는 표면에만 영향을 미친다.
GitHub API로 많은 작업을 수행할 수 있지만 이 문서에는 다음이 설명되어 있지 않습니다.

창설 날짜에 따라 정렬된 게시물 목록을 받아서 저희 블로그 인덱스

을 채웁니다

블로그 인덱스 또는 홈 페이지

의 상단에 고정된 게시물 보기

태그로 게시물을 받아서 태그 파일

제공
만약 당신이 다른 기능에 대해 깊이 이해하고 싶다면, 나의 블로그 here의 원본 코드를 조회할 수 있다
나는 이 문장이 읽기에 매우 재미있기를 바란다.
건배!