프로젝트 소개
ECK(Ethereum Collective Korea)는 한국 이더리움 생태계의 공공재를 만드는 비영리 팀이며, 이 저장소는 그 공식 홈페이지 겸 리서치·뉴스·이벤트 허브입니다. 'The Ticker is ETH'는 이 팀이 운영하는 텔레그램 채널 이니셔티브입니다.
기술 구성은 React 19 + TypeScript + Vite, Tailwind CSS 3 + Framer Motion, Three.js/React Three Fiber(3D), React Router DOM 7, react-i18next(한국어/영어 전환)입니다. 인증은 Privy(지갑·Google·Twitter 로그인 및 임베디드 지갑), 온체인 기능은 thirdweb(ERC-1155 배지, Base·Ethereum 멀티체인)을 사용합니다. 테스트는 Vitest + Testing Library, 입력 정화는 DOMPurify(XSS 방지), 알림은 Sonner 토스트이며, 테마는 CSS 변수와 Tailwind dark: 클래스로 다크/라이트 모드를 지원합니다.
주요 화면과 기능으로 멤버 아바타 애니메이션이 있는 Hero 섹션, Core Team·Contributors 프로필(소셜 링크, 기여 히트맵, 통계 배너), 작성과 열람이 가능한 Research 블로그(패스프레이즈 인증, 텔레그램 카테고리, 동적 로딩과 Load More 페이지네이션, 저자 필터와 디바운싱 검색), RSS 기반 News 페이지(이더리움 주간 리서치 리포트), Events 페이지, 프로필 페이지, 404 페이지와 ErrorBoundary가 있습니다. 데스크탑에서는 이더리움 다이아몬드 커스텀 커서와 트레일 효과가 적용되고, 온체인 기여자 배지 클레임/민트 흐름과 성공·실패 토스트 피드백, Research/News 상세 페이지의 소셜 공유 버튼도 포함됩니다. 접근성 관련으로는 i18n 스킵 내비게이션, 포커스 트랩, label 연결, aria-live를 언급하고 있습니다. 라우트 기반 코드 스플리팅(React.lazy + Suspense)을 사용합니다.
데이터 동기화는 GitHub Actions cron이 매일 KST 09:00에 텔레그램 채널 데이터를 수집하고 전처리해 개별 article .md 파일을 생성한 뒤 RSS 뉴스 피드를 수집하여 커밋하는 방식입니다. Actions 탭에서 수동 실행도 가능하며 TELEGRAM_API_ID, TELEGRAM_API_HASH, TELEGRAM_SESSION 시크릿이 필요합니다. 텔레그램 채널 메시지를 기반으로 기여도를 분석합니다.
개발 방법은 npm install 후 .env.example을 .env.local로 복사해 VITE_PRIVY_APP_ID를 설정하고 npm run dev로 실행합니다. dev, build, preview, test, test:run, test:coverage, lint, analyze(번들 크기 분석), fetch:telegram, preprocess:telegram, fetch:news 스크립트를 제공합니다. Vercel을 통해 main 브랜치 push 시 자동 배포됩니다. 환경변수로 Privy 앱 ID, thirdweb 클라이언트 ID, Base·Ethereum 각각의 ERC-1155 배지 컨트랙트 주소를 사용합니다.
현재 TODO에는 4종 배지(Core Contributor, Translator, Event Attendee, Research Author) 이미지 디자인, Ethereum Mainnet ERC-1155 컨트랙트 배포, 배지 컨트랙트 주소 환경변수 분리 적용, Vercel 환경변수 동기화가 남아 있습니다. 라이선스는 MIT이며 CONTRIBUTING.md와 버그 리포트·기능 제안 이슈 템플릿을 제공합니다.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.