🇰🇷 한국어 | 🇺🇸 English

Loopback Social 배너 리포지터리입니다.

Loopback Social은 커뮤니티 간의 연대와 연합을 위한 플랫폼입니다.

이 웹사이트에서 커뮤니티 운영자는 각 커뮤니티 상단에 부착할 수 있는 검은색 띠 배너를 받을 수 있습니다. 이 배너에는 캠페인에 동참하는 다른 커뮤니티의 이름이 함께 표시됩니다.

느슨한 연결이지만, 서로 커뮤니티가 연결되어있다는 점을 어필하면서 때로는 행사 홍보 배너나 팝업을 띄우는 등 여러 수단을 접목해본다면 어떨까 하는 생각으로 이 프로젝트를 시작해보았습니다.

이 프로젝트를 통해 커뮤니티 간의 연결을 상징하고, 함께하는 캠페인으로서 운영하고자 합니다.

웹사이트에 연대 배너를 추가하려면 다음 한 줄의 코드를 HTML 파일의 </body> 태그 바로 앞에 추가하면 됩니다.

<script src="https://loopback.social/banner.js" defer></script>

data-color 속성으로 배너 배경색을, data-textcolor 속성으로 텍스트 색상을, data-lang 속성으로 표시 언어를 지정할 수 있습니다.

<script src="https://loopback.social/banner.js" data-color="#005a9c" data-textcolor="#ffffff" data-lang="en" defer></script>

data-lang이 auto이면 페이지의 lang 속성이나 URL을 기반으로 자동 감지합니다.

이 단계의 모든 옵션은 Step 1. 설치하기에 따라 운영하시는 커뮤니티 사이트 상단에 배너를 먼저 설치한 뒤 진행해주세요. 배너가 설치되어 있지 않으면 다른 커뮤니티의 소식이 우리 커뮤니티 방문자에게 노출되지 않고, 네트워크의 연결도 양방향으로 이뤄지지 않습니다.

커뮤니티에서 운영하시는 도메인에 news.json 형식의 파일을 호스팅하시고, 커뮤니티 등재 이슈에 해당 URL을 함께 제출해주세요. 등재가 머지되면 Loopback Social 봇이 6시간마다 자동으로 가져와 배너와 공용 피드(RSS/Atom/JSON/iCal)에 노출합니다. 이후에는 호스팅하신 파일만 갱신하시면 다음 사이클에 반영되어, 매번 PR을 만들 필요가 없습니다. 배너에는 [커뮤니티 이름] 메시지 형태로 출처가 항상 명시됩니다.

호스팅 요구사항·선택 규칙·갱신 주기·장애 대응 등 운영자가 알아야 할 상세 명세는 별도 페이지에 정리해두었습니다 — 네트워크 피드 호스팅 명세 (공개 URL)를 참조하세요.

자동 게시 환경을 운영하기 어렵다면, 종전 방식대로 항목 단위 제보로도 계속 참여 가능합니다.

1. 커뮤니티 등재 이슈에 커뮤니티 정보를 제출 (네트워크 URL 칸은 비워두세요).
2. 소식이 생길 때마다 뉴스 제보 등재 이슈를 제출하거나 docs/news.json을 직접 수정하는 PR을 보냅니다.
3. 운영자가 검토·머지하면 다음 사이클에 배너와 공용 피드에 반영됩니다.

Loopback Social 운영진이 큐레이션해 강조하고 싶은 소식도 이 경로로 직접 등재됩니다.

배너 하단 뉴스 티커에 표시할 항목은 docs/news.json 파일에 아래 형식으로 추가합니다.

{
 "start": "YYYY-MM-DD HH:mm:ss",
 "end": "YYYY-MM-DD HH:mm:ss",
 "timezone": "+09:00",
 "message": {
 "ko": "한국어 메시지",
 "en": "English message"
 },
 "link": "https://example.com",
 "display": true
}

{
 "start": "2026年03月01日 00:00:00",
 "end": "2026年03月31日 23:59:59",
 "timezone": "Asia/Seoul",
 "message": {
 "ko": "3월 밋업에 참여하세요!",
 "en": "Join our March meetup!"
 },
 "link": {
 "ko": "https://example.com/ko",
 "en": "https://example.com/en"
 },
 "display": true
}

3월 1일부터 14일까지 배너에 노출되지만, 실제 행사는 3월 14일 14:00–17:00에 열리는 경우. category·event_start·event_end·location을 함께 지정하면 news.ics와 events.jsonld에 정확한 시각과 장소로 반영됩니다.

{
 "start": "2026年03月01日 00:00:00",
 "end": "2026年03月14日 17:00:00",
 "timezone": "Asia/Seoul",
 "event_start": "2026年03月14日 14:00:00",
 "event_end": "2026年03月14日 17:00:00",
 "category": "event",
 "location": "서울 강남",
 "message": {
 "ko": "3월 정기 밋업",
 "en": "March Regular Meetup"
 },
 "link": "https://example.com/march-meetup",
 "display": true
}

참고: link·message·location은 단일 문자열로도 설정할 수 있으며, 이 경우 모든 언어에 동일한 값이 사용됩니다.

docs/news.json과 docs/communities.json이 바뀔 때마다 GitHub Actions가 다음 파일을 자동으로 다시 빌드합니다. 모두 https://loopback.social/ 아래에 정적으로 서빙됩니다.

피드 형식별로 세 가지 변형을 발행합니다:

• 이중 언어 (feed.xml, news.ics, ...): 항목 제목·설명에 한국어와 영어를 모두 표기. 양쪽 언어를 다 보고 싶을 때.
• 한국어 전용 (feed.ko.xml, news.ko.ics, ...): 한국어 텍스트만 표기 (해당 항목에 한국어가 없으면 영어로 자동 폴백).
• 영어 전용 (feed.en.xml, news.en.ics, ...): 영어 텍스트만 표기 (해당 항목에 영어가 없으면 한국어로 자동 폴백).

배너의 "피드"/"캘린더" 버튼은 data-lang(또는 자동 감지)에 따라 사용자 언어에 맞는 변형 URL을 자동으로 보여줍니다.

자동 생성되는 모든 피드(events.jsonld 포함)는 https://loopback.social/feeds/ 아래에 보관됩니다. sitemap.xml만 검색엔진 컨벤션(/sitemap.xml 기본 경로)에 따라 사이트 루트에 유지됩니다.

빌드 트리거:

• 이슈 → PR 자동화에서 news.json/communities.json을 수정한 PR을 만들 때 함께 빌드되어 PR에 포함됩니다.
• main 브랜치에 news.json/communities.json이 푸시되면 build-feeds.yml이 결과물을 자동 커밋합니다.
• 매일 00:00 UTC (09:00 KST)에도 한 번 실행되어, 만료된 항목이 자연스럽게 빠지고 lastBuildDate가 갱신됩니다.
• 수동으로 돌리려면: node .github/scripts/build-feeds.mjs

• docs/banner.js: 가벼운 로더 스크립트 (캐시되어도 무방)
• docs/banner.impl.js: 실제 배너 구현체 (타임스탬프로 캐시 무효화)
• docs/communities.json: 참여 커뮤니티 목록
• docs/news.json: 뉴스 티커 콘텐츠
• docs/news.ics, docs/feed.xml, docs/events.jsonld, docs/sitemap.xml: 자동 생성 피드 (직접 편집하지 말 것)
• docs/llms.txt, docs/robots.txt: 검색/AI 친화 메타데이터
• docs/schemas/: communities.json/news.json JSON Schema (CI에서 검증에 사용)
• .github/ISSUE_TEMPLATE/: 구조화된 제출 양식 (자동화 봇이 파싱)
• .github/scripts/: 양식 → JSON 변환, 피드 빌드 스크립트
• .github/workflows/issue-to-pr.yml: 이슈 → PR 자동화 워크플로
• .github/workflows/build-feeds.yml: 피드 재빌드 워크플로

1. banner.js가 로드되면 현재 타임스탬프를 포함한 URL로 banner.impl.js를 동적 로드
2. banner.impl.js는 페이지 상단에 검은색 띠 배너를 생성하고 삽입
3. 배너에는 loopback.social 제목과 커뮤니티 드롭다운 메뉴가 포함
4. 뉴스 티커는 현재 시각에 해당하는 news.json 항목들을 순환 표시

GitHub Pages의 캐시 문제를 해결하기 위해 2단계 로딩 구조를 사용합니다:

• banner.js: 항상 동일한 로더 코드 (브라우저 캐시 가능)
• banner.impl.js: 타임스탬프 파라미터(?ts=)로 강제 새로고침

이를 통해 배너 업데이트 시 즉시 반영이 가능합니다.

이 프로젝트는 MIT 라이선스를 따릅니다. 자세한 내용은 LICENSE 파일을 참고하세요.

Site Icon (Loop) by https://icons8.com