Dev Lab2 min read

in-labs 아키텍처: 무과금 지향 블로그·데이터 설계 가이드라인

테스트넷·스마트 컨트랙트·S3(JSON)·Next.js(SSR/ISR)·Vercel을 묶어 거의 무과금으로 운영하는 in-labs의 구조와 데이터 흐름, 캐시·보안·비용 전략을 한눈에 설명합니다.

#nextjs-ssr#blockchain-as-database#aws-s3-json#vercel-free-tier#testnet-architecture

Next.js·Vercel·블록체인·S3가 연결된 전체 아키텍처 다이어그램

목표: “거의 0원” 운영

  • 상시 과금되는 관리형 DB 대신 블록체인과 S3로 읽기 중심 워크로드를 처리합니다.
  • 검색 노출을 위해 SSR/ISR을 활용해 초기 응답 속도와 크롤러 친화성을 확보합니다.
  • 도메인은 구매하되, 배포·호스팅·데이터 계층은 무료·저가 옵션을 우선합니다.

선택의 이유

  • Next.js(App Router): SSR/ISR 혼합으로 SEO와 속도의 균형.
  • 스마트 컨트랙트(테스트넷): 포스트 무결성 앵커(CID/해시)와 메타 인덱스를 온체인에 기록.
  • AWS S3(JSON): 삭제되면 안 되는 스냅샷/원본을 저렴하게 저장.
  • Vercel(무료 플랜): 빌드·프리뷰·엣지 캐시와 쉬운 커스텀 도메인 연결.

주의: 테스트넷은 합의 지연·리오그가 있을 수 있습니다. 읽기·쓰기 경로에 재시도와 임시 캐시를 넣어야 합니다.

읽기는 빠르게, 쓰기는 안전하게

  1. 게시/수정: 관리자 도구에서 작성 → 컨트랙트에 포스트 CID/해시 기록 → S3에 index.json 업데이트.
  2. 페이지 요청:
    • 인기 글·목록: ISR로 사전 생성 → Vercel 에지에서 빠르게 제공.
    • 신규/미생성: SSR로 즉시 렌더 후 짧은 주기로 재검증.
  3. 검증: 렌더 시 컨트랙트에서 해시를 조회해 S3 원본과 일치성 확인(필요 시 선별 적용).

팁: 내부 링크를 촘촘히 연결하면 크롤러가 더 많은 페이지를 탐색합니다. 예: 블록체인 데이터 API 설계

캐시·SEO 전략: ISR 우선, SSR 보완

  • 목록/태그/홈: 변동이 느린 페이지는 긴 revalidate로 비용 절감.
  • 상세 페이지: SSR로 신선도 확보 후 짧은 ISR로 재생성.
  • 동적 데이터: 체인 조회는 클라이언트 캐시(React Query 등)로 네트워크 비용을 제어.

핵심 전제: 컨텐츠는 읽기 비중이 높고, 쓰기(발행)는 상대적으로 드뭅니다.

무엇을 아끼고 어디에 쓰나

항목선택과금 특성운영 메모
데이터베이스미사용0원체인+S3로 대체
블록체인테스트넷무료(가스/쿼터 주의)RPC 쿼터 확인
스토리지S3(JSON)저가/버저닝index.json 단일화
호스팅Vercel무료프리뷰·엣지 캐시
도메인구매연 단위최소 1개 유지

팁: 이미지 다량 트래픽은 초기엔 Vercel 이미지 최적화를 이용하고, 성장 시 전용 CDN을 검토합니다.

단순하지만 견고하게

  • 권한 경계: 컨트랙트 쓰기는 소유자/역할 기반으로 제한, 이벤트 로그로 변경 이력 확보.
  • S3 최소 권한: 리스트/읽기, 필요한 경로만 쓰기 허용. 민감 키는 서버 전용 환경변수로.
  • 헬스체크: RPC 상태, S3 접근, Vercel 응답을 주기적으로 점검하고 장애 지점을 구분합니다.
  • 롤백: index.json 버저닝으로 빠른 과거 상태 복구.

포스트NFT

적용 순서

  1. S3 버킷과 폴더 구조 확정(posts/, index.json).
  2. 테스트넷에 컨트랙트 배포(읽기 메서드부터 고정).
  3. Next.js 라우팅 구성 후 ISR/SSR 기준 수립.
  4. Vercel에 연결하고 환경변수/도메인 설정.
  5. 색인 파일(sitemap/robots) 제출로 검색 노출 최적화.

이 구조는 읽기 많은 블로그에 적합하며, 성장 단계에서도 부분 교체가 쉽습니다. 더 자세한 설정은 dev-lab에서 이어서 확인해 주세요.

참고 링크

다음으로 읽어볼 글