사례 2주차 2026-08-06 · 위키 글마다 사진 자동으로 붙이기 연재

위키 글마다 사진이 자동으로 붙는 기능 만들기 — 조사부터 배포까지

“직접 만들긴 어려울 것 같다”는 한 마디로 시작해서 API 4개를 비교 조사하고, 무료 서비스 하나를 골라 실제로 연결까지 끝낸 하루.

Laptop displaying code in a dark setting, highlighting programming concepts and digital work.
사진: Nemuel Sereti · Pexels

이 글은 이런 분께

  • 위키·블로그 글마다 어울리는 사진을 일일이 찾아 넣는 게 귀찮은 분
  • “API로 자동화하고 싶은데 나는 코딩을 못 한다”는 상황인 분
  • 여러 이미지 API 중에 뭐가 초보에게 제일 쉬운지 헷갈리는 분

Before — 사진을 매번 손으로 찾아 넣고 있었다

위키 글을 쓸 때마다 어울리는 사진이 있으면 좋겠다고 생각했지만, 직접 찾아서 넣는 건 번거롭고, 코드로 자동화하는 건 “나는 못 만든다”는 벽이 있었다. 그래서 이렇게 요청했다.

내 프로젝트에 [이미지 자동 삽입 기능]을 넣고 싶은데 직접 만들긴 어려울 것 같아.
API로 가져올 수 있는지, 어떤 걸 쓰면 좋을지 최신 기준으로 찾아봐줘.
초보가 붙이기 쉬운 것 위주로, 무료로 쓸 수 있는지도 알려줘.

1단계 — 후보 4개를 조사해서 비교

“어디에 쓸 거냐”에 따라 답이 완전히 달라진다는 걸 먼저 알게 됐다. 사이트(위키 페이지)용과 강의안 GPT·Gamma용을 나눠서 각각 조사했다.

후보무료 여부초보 난이도결과
Pexels API완전 무료 (시간당 200회)가입만 하면 즉시 발급✅ 채택
Unsplash API무료지만 승인 필요승인 대기, 출처 표시 의무보류
Gamma APIPro 요금제 이상만유료 전환 필요❌ 기각
GPT Actions무료OpenAPI 스키마 작성 필요❌ 기각 (코딩 필요)

결론은 명확했다. 사이트엔 Pexels, 강의안 GPT·Gamma 쪽은 지금처럼 손으로 사진 바꾸는 게 최선이라는 것. 자동화하겠다고 무리해서 유료 전환하거나 스키마를 배울 필요가 없었다.

막힘 — 로그인은 됐는데 키 발급 화면을 못 찾음

Pexels에 가입까지는 했는데, 정작 API 키를 어디서 받는지 못 찾았다. 로그인 후 들어간 화면은 API 키 화면이 아니라 “내 갤러리”(사진 올리는 프로필) 페이지였다.

→ 주소창에 pexels.com/api/직접 입력해서 들어가야 “Generate a Pexels API Key” 신청 폼이 나왔다. 로그인된 상태에서 이 폼(프로젝트 이름·용도·사이트 주소 입력)을 채우고 나서야 승인 대기 없이 키가 바로 발급됐다.

2단계 — 코드에 연결 (AI가 진행)

키를 받은 뒤부터는 코드 작업이라 AI가 대신 진행했다.

  1. 키를 코드에 직접 적지 않고 .env 파일에 저장 (.gitignore에 이미 걸려 있어서 깃허브엔 안 올라감)
  2. 글의 태그(또는 제목)로 Pexels에서 사진을 검색해오는 함수 작성
  3. 위키 글 상세 페이지에서, 사이트를 만들 때(빌드 시점)마다 그 함수를 호출해 사진 + 사진작가·Pexels 출처를 자동으로 붙이게 연결
  4. 로컬 미리보기로 실제 사진이 뜨는지 확인 → 커밋 → GitHub 푸시

After — 실제 배포 사이트에서 확인

로컬에서만 되고 끝나는 게 아니라, Vercel(실제 배포 사이트) 환경변수에도 같은 키를 등록해야 했다. 등록하고 재배포하니, 실제 사이트에서도 사진이 자동으로 뜨는 걸 확인했다 — “저장소 비공개 전환” 글에는 옥토캣 스티커가 붙은 노트북 사진이, 딱 맞아떨어져서 웃겼다.

재사용 자산 — 사진이 안 어울릴 때

자동 검색이라 가끔 엉뚱한 사진이 걸린다(예: “만들기 전에 검색부터” 글에 웬 정장 입은 사람 사진). 이럴 걸 대비해서, 글 파일에 한 줄만 추가하면 바로잡을 수 있게 만들어뒀다.

이미지: "돋보기 검색"        # 이 검색어로 Pexels에서 다시 찾음
이미지: "https://images.pexels.com/..."   # 이 사진을 그대로 고정

코딩을 몰라도 되는 부분: 이 줄을 직접 안 써도 된다. “이 글 사진 이상해, OO로 바꿔줘”라고 AI한테 말만 하면 파일을 찾아 고치고 확인까지 대신 해준다.

배운 것

“어디에 쓸 건지”가 API 선택을 완전히 바꾼다. 같은 “이미지 자동화”라도 무료 정적 사이트엔 Pexels가 맞고, 유료 도구(Gamma)나 코딩이 필요한 방식(GPT Actions)은 지금 단계엔 안 맞았다. “쉬운 것”과 “그럴듯해 보이는 것”은 다르다는 걸 확인했다.

조사 요청 프롬프트 템플릿

[하고 싶은 기능]을 넣고 싶은데 직접 만들긴 어려울 것 같아.
API로 할 수 있는지, 어떤 걸 쓰면 좋을지 최신 기준으로 찾아봐줘.
초보가 붙이기 쉬운 것 위주로, 무료로 쓸 수 있는지도 알려줘.

막히면 이렇게 물어보기

  • 여러 서비스 중 뭘 골라야 할지 모를 때 → “이거 다 무료야? 초보가 쓰기 제일 쉬운 게 뭐야?”
  • 가입은 했는데 필요한 화면을 못 찾을 때 → 화면을 캡처해서 “여기서 뭘 눌러야 해?”