본문으로 건너뛰기

© 2026 Molayo

HN요약2026. 05. 05. 15:56

Show HN: DD Photos – 오픈소스 사진 앨범 사이트 생성기 (Go 와 SvelteKit)

요약

DD Photos는 빠르고, 사용하기 쉬우며, 모바일 친화적인 오픈소스 사진 앨범 웹사이트 생성기입니다. iCloud와 같은 기존 서비스의 느린 로딩 속도나 불편함에 대한 대안으로 개발되었으며, Go와 SvelteKit을 사용하여 구축되었습니다. 사용자는 `albums.yaml` 파일을 통해 앨범 구조를 정의하고, 전용 도구를 사용해 사진을 웹 최적화하며 정적 사이트로 배포할 수 있습니다. 이 솔루션은 데이터베이스가 필요 없고, AWS S3 같은 정적 호스팅 환경에 완벽하게 적합합니다.

핵심 포인트

  • **빠른 성능과 사용자 경험:** 로딩 속도가 빠르고 모바일 친화적인 UI를 제공하여 사진 공유의 불편함을 해소했습니다.
  • **간편한 워크플로우:** `albums.yaml` 파일 정의와 전용 도구 실행만으로 앨범을 구성하고 웹 최적화를 완료할 수 있습니다.
  • **정적 사이트 배포에 최적화:** 데이터베이스가 필요 없는 순수 HTML/CSS/JS로 구성되어 AWS S3 등 정적 호스팅 서비스에 쉽게 배포 가능합니다.
  • **풍부한 기능성:** 다크/라이트 모드, 키보드 지원(화살표 키), 선택적 비밀번호 보호, OpenGraph 태그 등 다양한 고급 기능을 제공합니다.

DD Photos 를 실행하는 가장 쉬운 방법은 Docker↗ 를 통한 것입니다. Go, Node 또는 libvips 가 필요하지 않습니다.

시작 사이트를 시도해 보세요:

mkdir ~/my-ddphotos
docker run --rm -v ~/my-ddphotos:/ddphotos dougdonohoe/ddphotos init
cd ~/my-ddphotos
...

그런 다음 config/albums.yaml 을 편집하여 자신의 앨범을 정의하고 반복하세요.

**초등 초당 배포 (무료, 서버 필요 없음)**는 Surge↗ 또는 Cloudflare Pages↗ 를 통해 가능합니다 (무한대 대역폭):

./ddphotos export --copy
surge --domain my-unique-site.surge.sh export/my-photos
./ddphotos export --cloudflare
...

rsync 를 통한 배포 또는 S3 에 대한 자세한 내용은 Docker 페이지를 참조하세요.

저는 사진 공유 사이트, 특히 Apple 의 iCloud 공유 앨범에 불만족되었습니다. 이 사이트들은 일반적으로 20 초 이상을 소요하여 로드합니다. 다른 공유 사이트는 불편한 UI, 광고, 사진 관련 물품 판매 및 소셜 미디어 방해와 같은 자체적인 문제점들을 가지고 있습니다.

저는 친구 및 가족과 사진을 공유하고 싶습니다. 저는 그것이 빠르고, 쉬우며, 모바일 친화적이며 방해가 없기를 원했습니다. 사진에 집중하세요. 그래서 DD Photos 를 만들었으며, 이는 photos.donohoe.info↗ 뒤에 숨겨진 것입니다. 그것은 실제로 매우 좋으며, 끔찍하게 빠르며 저의 요구 사항을 충족합니다. 아마도 당신의 요구 사항도 충족할 것입니다. 이것이 제가 오픈소스로 공개한 이유입니다.

P.S. DD Photos 를 만드는 과정에 대해 이 Medium 기사↗ 에서 작성했습니다.

DD Photos 사이트는 모든 앨범과 설명이 있는 홈 페이지를 가지고 있습니다. 다크 모드와 라이트 모드를 쉽게 전환할 수 있습니다. 앨범을 클릭/터치하면 사진의 그리드가 표시됩니다. 사진을 클릭/터치하면 전체 크기의 버전 및 캡션 (있다면) 을 볼 수 있습니다. 사진을 쉽게 스와이프하거나 (또는 노트북에서 화살표 키를 사용) 할 수 있습니다. 모바일, 태블릿, 데스크톱에서 잘 작동합니다.

이것이 큰 디스플레이에서 어떻게 보이는지 (더 큰 버전을 위해 Screenshots 를 참조하세요):

아이디어는 이미 다른 것을 사용하여 사진을 큐레이션 및 필터링한다는 것입니다. 아마도 Adobe Lightroom Classic (저의 도구) 일 수 있습니다. 또는 Apple Photos 나 Google Photos 일 수 있습니다.

무엇이든 중요하지 않지만, 앨범을 구성하는 사진 선택을 한 후 사진을 폴더로 내보냅니다. 폴더에 있는 모든 사진은 앨범을 구성합니다.

그것이 간단합니다.

각 앨범 폴더에서 선택적인 photogen.txt 파일을 생성하여 각 사진의 캡션을 정의할 수 있습니다. 이 파일은 날짜 순서로 정렬이 충분하지 않은 경우 앨범의 정렬 순서를 정의하는 데에도 사용할 수 있습니다.

DD Photos 에서, 당신은 당신의 앨범이 어디에 있는지 albums.yaml 파일에서 정의합니다.

별도의 descriptions.txt 에서 각 앨범의 짧은 설명을 제공합니다.

사진의 위치를 정의한 후, photogen 도구를 실행하여 웹 뷰어용 사진을 크기 조절하고 웹 앱이 사용하는 인덱스 파일을 생성합니다.

그것이 끝입니다. 이제 당신은 개발 서버를 사용하여 자신의 사진 앨범을 기계에서 볼 수 있습니다.

마지막으로, 웹 서버 (Apache 나 nginx) 에 배포할 수 있는 정적 사이트를 만들 수 있는 빌드 단계가 있습니다. AWS S3 나 어떤 정적 호스팅 서비스에 배포할 수 있습니다. 서버에는 코드가 실행되지 않습니다. 데이터베이스는 필요하지 않습니다. 그것은 HTML, CSS, JavaScript 와 당신의 (크기 조절된) 사진들뿐입니다.

웹사이트 기능:

  • 설명, 사진 수, 날짜 범위 및 선택한 커버 사진이 포함된 간결한 앨범 카드.
  • 앨범 페이지는 PhotoSwipe lightbox 가 화면 크기에 잘 조정되는 깔끔하게 정렬된 사진 그리드 레이아웃을 가지고 있습니다.
  • 키보드 지원: 화살표 키가 lightbox 에서 이동하고 ESC 키가 lightbox 를 종료하며 앨범 페이지에서 홈 페이지로 돌아갑니다.
  • 선택적인 photogen.txt 를 통한 사진별 설명:

: 이미지 alt 로 사용

text, grid mouse-hover caption (desktop), always-visible caption (mobile), and lightbox caption. - 각 앨범은 인간이 읽기 쉬운 URL 을 가집니다 (예: /albums/antarctica). - 각 사진은 복사 버튼 (copy-to-clipboard) 을 통해 접근 가능한 공유용 permalink 이 있습니다 (예: /albums/patagonia/5). - 선택적 히어로 이미지: 홈페이지 상단에 전체 폭 배너로 지정되며, albums.yaml 에 crop position(상단/중앙/하단) 을 설정합니다. - 선택적 HTML 제목, 서브제목 및 사이트 개요. - 선택적 비밀번호 보호: 개별 앨범 또는 전체 사이트를 암호화할 수 있습니다. 비밀번호는 서버 측에 저장되지 않으며, Web Crypto API 를 사용하여 브라우저에서 해독됩니다. 비밀번호 대화상자에 힌트를 표시할 수 있습니다. 로그아웃 버튼은 암호화된 사이트의 저장된 비밀번호를 초기화합니다.

  • 다크/라이트 테마 토글.
  • 커스텀 CSS 오버라이드: albums.yaml 에 CSS 파일을 지정하여 소스 코드를 수정하지 않고 사이트를 재디자인할 수 있습니다.
  • OpenGraph 태그: 소셜 미디어 또는 메시징 앱에서 앨범 또는 사진 URL 을 공유할 때 풍부한 링크 미리보기 생성. 히어로 이미지 (설정된 경우) 또는 앨범 커버 JPEG 를 미리보기 이미지로 사용합니다.

Backend features:

  • 두 가지 효율적인 WebP 이미지 크기를 생성합니다: grid(600px) 와 full(1600px).
  • EXIF 메타데이터 추출 (크기, 날짜) 을 JSON 에 저장합니다.
  • 모든 이미지 메타데이터를 WebP 출력에서 제거합니다 (작은 파일 크기, GPS 누출 방지).
  • 동시 이미지 리사이징을 goroutines 를 통해 수행합니다 (버퍼드 채널, WaitGroup).
  • 기본값으로 Dry-run 모드를 사용합니다 (-doit 을 사용하여 파일을 작성). - 선택적으로 photogen.txt 를 사용하여 정렬 순서를 오버라이드할 수 있습니다 (기본값은 촬영 날짜 기준).
  • 재귀 앨범 지원: recurse: true 를 설정하여 하위 디렉토리에서 사진을 수집하고, 충돌을 피하기 위해 자동 파일명 접두사를 추가합니다.
  • 암호화된 앨범의 WebP 파일명은 HMAC 에서 유래하여, 원본 소스 파일명이 알려져 있어도 파일명 추측을 방지합니다.

The photogen Go 프로그램 (cmd/photogen/photogen.go) 는 사진을 WebP 형식으로 리사이징하고, 프론트엔드가 소비하는 JSON 인덱스 파일 (albums.json, 앨범별 index.json) 을 생성합니다. 또한 각 앨범을 식별하는 sitemap.xml 파일을 생성합니다.

사이트 (Node.js 앱인 web) 는 SvelteKit 를 사용하여 정적으로 빌드됩니다. HTML 쉘 및 자산은 웹 서버에 의해 직접 제공되는 미리 빌드 파일이며, 사진 데이터는 photogen 으로 생성된 정적 JSON 인덱스에서 클라이언트 측에서 가져옵니다.

이러한 스태틱 사이트를 배포하는 방법은 많습니다. 가장 빠른 옵션은 Surge↗ 와 Cloudflare Pages↗ 입니다 - 한 명령어로 사이트가 공개 URL 에서 바로 시작되며 무료입니다. 프로덕션용으로는 DD Photos 가 두 가지 옵션을 제공합니다: rsync 를 통한 Apache 와 aws s3 sync 를 통한 S3+CloudFront. 설정 세부 사항은 Deployment 를 참조하세요.

이 문서들은 주로 DD Photos 사용자를 위한 것입니다:

DocumentDescription
DockerDocker 워크플로우: init, photogen, run, build, serve, deploy, upgrade
...

이 문서들은 주로 DD Photos 개발자를 위한 것입니다:

DocumentDescription
Developer Setup요구 사항, 샘플 앱, 명령어 (개발자 모드)
...

기여를 환영합니다! 자세한 내용은 CONTRIBUTING.md 를 참조하세요.

이 프로젝트는 GNU Affero General Public License v3.0 (AGPL v3) 에 따라 라이선스됩니다.

다른 조건으로 이 프로젝트를 사용하시려면 doug [at] donohoe [dot] info 로 연락하세요.

AI 자동 생성 콘텐츠

본 콘텐츠는 HN Claude Code Search의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.

원문 바로가기
2

댓글

0