코드 변경 사항 및 댓글 표시

기여 기능
1

이것은 특정 기능이 존재하는지(플러그인 형태로 포함될 수 있음)에 대한 질문이거나, 그렇지 않은 경우 기능 요청 사항입니다…

제가 찾고 있는 것은 Discourse 포럼 토론 내에서 다음과 같은 것을 표시할 수 있는 기능입니다:

image
image786×179 10 KB

언어별 구문 강조(syntax highlighting)를 사용하여 코드 일부만 보여주는 것(예: ```php로 시작하고 ```로 닫는 방식으로 이미 도입되어 있음)만으로는 부족합니다.

제가 원하는 것은 특정 줄을 강조하고, 주석을 달며, 해당 줄에 대한 수정 내용을 표시할 수 있는 기능입니다. 이러한 기능은 기술적인 내용을 다루는 포럼에서 변경 사항을 적용하도록 조언하거나 문제 영역을 지적할 때 일반적으로 유용합니다.

우리는 프로젝트에 GitHub를 사용하고 있지만, GitHub에서 발생하는 변경 사항을 그대로 표시해 달라는 구체적인 요청은 아닙니다. 대신 Discourse 내에서 독립적으로 입력할 수 있는 것을 원합니다. 위의 이미지는 단순히 그것이 어떻게 보일 수 있는지를 보여주는 예시일 뿐입니다.

2

다음과 같이 diff를 표시할 수 있습니다:

A normal line
- removed line
+ added line


```diff
A normal line
- removed line
+ added line
```
6개의 좋아요
3

음… 그거 :cool: 보이네요.

언어별 구문 강조(Syntax Highlighting)와 이걸 조합하는 방법이 있을까요?

구문 강조가 없으면 코드가 너무 평범해 보이지만, 있으면 정말 멋져 보이거든요.

4

아쉽게도 그렇지 않습니다. 하지만 가능했으면 좋았을 것 같아요. 저희는 문법 하이라이팅에 highlight.js를 사용하고 있습니다. 해당 GitHub 저장소에서 비슷한 논의가 있었던 것 같지만, 프로젝트 범위 밖이라는 판단 하에 진행하지 않기로 결정했습니다.

3개의 좋아요
5

음 :thinking:

그들은 gist에 해당 스니펫을 올려두었는데, 제안하는 내용은 하이라이터 _외부_에서 이를 구현하라는 것입니다(해당 경우 marked.js일 텐데, highlight.js로도 동일한 방식으로 처리할 수 있을 것입니다).

Discourse에서도 이렇게 할 수 있을까요? 아니면 더 앞서서, 아키텍처 관점에서 이게 타당한가요?

일반적인 아이디어는 그냥 find-and-replace를 통해 diff 마커를 제거하고, 이를 구문 하이라이터에 전달한 뒤, 이후에도 find-and-replace로 더 작업하는 것 같습니다. 매우 어색하게 들리지만, 사실 그 스니펫은 그렇게 복잡하지 않습니다.

1개의 좋아요
6

가능성은 충분히 있지만, 쉽지 않을 것 같습니다. 모든 구문 하이라이팅이 JavaScript에서 처리되므로, 테마 컴포넌트를 통해 조작할 수 있습니다.

1개의 좋아요
7

색을 어떻게 입혔나요?

8

아래와 같이 코드 블록을 입력하세요:

```diff
A normal line
- removed line
+ added line
```

diff를 문법으로 지정하면, 줄의 시작에 +와 -를 사용하여 각각 녹색과 빨간색으로 강조할 수 있습니다.

3개의 좋아요
9 
A normal line
- removed line
+ added line

해냈어요! @david 감사합니다

2개의 좋아요
10

앞으로는 diff 구문을 사용하겠습니다. 유용하네요.

Gist에 있던 다른 제안이 Discourse에 구현될 것 같지는 않습니다. 더 생각해보면, 이 기능은 밖이 아니라 문법 하이라이터 _안쪽_에 들어가는 것이 완벽하게 맞을 것이라 생각합니다.

결국, 시간이 지날수록 문법 하이라이터에 몇 가지 기능을 추가하는 것이 합리적이며, 코드를 읽기 쉽게 보여주는 기본 역할은 자연스럽게 코드 일부의 _동적 특성_을 보여주는 것으로 확장됩니다.

무엇이 변경되었는지, 어디서, 누가 변경했는지; 내가 가리키는 것이 무엇인지; 코드가 게시된 위치와의 관계를 설명하는 유용한 주석이 무엇인지, etc.

이 토론에 참여해 주신 모든 분께 감사드립니다.

1개의 좋아요
11

아마도 대안이 될까요?

<del>del</del> 
<ins>ins</ins>

del
ins

4개의 좋아요