스레드와 답글을 트리 기반 형식으로 표시하도록 설계된 4chan(https://4chan.org)용 읽기 전용 클라이언트입니다.
나는 4chan이 스레드에 대한 답글을 구성하는 방식이 대화의 흐름을 결정하는 데 매우 혼란스럽고 도움이 되지 않는다는 것을 알았습니다. 4chan 웹 클라이언트에서 답변은 원래 게시된 순서대로 단순 목록으로 표시됩니다.
스레드가 더 많은 응답을 받을수록 응답 체인 형태의 여러 대화가 형성되기 시작하는 것은 당연합니다. 여기에서 체인에 추가되는 모든 항목은 큰 연대순 목록에 추가됩니다.
즉, 해당 목록을 스크롤하는 경우 서로 관련이 거의 또는 전혀 없는 여러 응답 체인의 게시물이 지속적으로 얽혀 있어 지속적으로 컨텍스트를 전환해야 하며 응답 체인을 꼼꼼하게 확인해야 하는 게시물을 만나게 됩니다. 실제로 대화를 계속하기 위해 응답합니다.
대체로 짜증납니다.
이것이 바로 이 프로젝트가 존재하는 이유입니다. 실제로 제대로 표시되기 때문에 일련의 응답을 따라가는 것이 이제 매우 쉽습니다! 게시물에 대한 답글은 해당 게시물의 하위 항목이 되며 한 수준 더 깊이 표시됩니다. 이것이 Reddit의 댓글 구성 방식이며, 사용자 경험을 10배 향상시키는 매우 직관적인 시스템이라고 생각합니다.
이 앱은 Svelte로 작성되었으며 nginx를 4chan의 API 서버에 대한 CORS 프록시로 사용하여 거의 전적으로 클라이언트 측에서 실행됩니다. 앱을 호스팅하고 CORS 프록시 역할을 하는 하나의 nginx 컨테이너를 실행할 수 있으므로 매우 컴팩트하고 배포가 쉽습니다.
모든 HTML, JS 및 CSS 자산을 포함하여 앱 크기는 약 38.43 KB
입니다. Gzip을 사용하면 총 14 KB
로 줄어듭니다. 빌딩은 Vite 빌드 시스템에 의해 구동되며 유형은 TypeScript를 사용하여 코드에 적용됩니다.
스레드 이미지는 브라우저 보기로 스크롤될 때마다 로드되며, 4chan의 API에 대한 스팸 API 호출을 제거하는 것을 목표로 합니다. nginx CORS 프록시는 요청의 실제 출처를 표시하기 위해 모든 요청에 X-Forwarded-For
및 X-Real-IP
헤더를 첨부합니다.
treechan을 실행하려면 Docker와 Git이 필요합니다. 사용자의 편의를 위해 빌드 프로세스가 완전히 컨테이너화되어 있으므로 NodeJS를 호스트에 설치할 필요가 없습니다.
Docker가 설치되어 있는지 확인하려면 다음을 수행하세요.
$ docker -v
Docker version 20.10.21, build baeda1f82a
$ git -v
git version 2.38.1
Docker와 git 버전이 일치할 필요는 없습니다. 최신 버전이 있는지 확인하세요.
이제 Git을 사용하여 리포지토리를 복제 해야 합니다 . 이는 빌드 스크립트를 실행하는 데 중요합니다. GitHub에서 zip 파일을 다운로드하지 마세요!
$ git clone --depth=1 https://github.com/xxcodianxx/treechan.git
이제 포함된 run.sh
스크립트를 사용하면 treechan이 자동으로 설치 및 실행됩니다.
$ ./run.sh
네트워크 다운로드 시간을 제외하면 설치 속도가 매우 빠릅니다(약 2초).
기본적으로 서버는 포트 8080
에서 실행되지만 ./run.sh
파일 상단에서 변경할 수 있습니다.
축하합니다. 이제 treechan을 실행하게 되었습니다. 로컬 컴퓨터에서 이 작업을 수행했다면 이제 http://localhost:8080을 방문하여 즐길 수 있습니다.
서버에서 수행한 경우 localhost
서버의 IP로 바꾸십시오. 포트 전달 포트 8080
또는 선택한 포트를 기억하십시오.