Vercel로 프로필 사이트 만들고, 노션과 연동해서 회사 멤버 전체로 확장하기(...ing)

목표

사람이 늘어도 배포는 한 번만 하고싶다.... 🙄

노션에 행 하나 추가하면 /m/이름 으로 멤버별 페이지가 추가로 생기면 좋겠는데...

그리고 사내 우수 사례를 노션에 넣으면 담당자 페이지와 전 직원 페이지에 동시에 펼쳐지게끔 해서 개인 PR겸 회사 PR 그리고 사내 교육 공유자료까지 될수있도록....

한 사람용을 스무 명용으로

스터디장님이 본인 프로필을 Vercel로 배포해 공유하시는 걸 봤습니다. 그때 든 생각이 "나도 하나 만들자"가 아니라 "이걸 회사 전체에 적용하면 어떨까" 였습니다.

저희는 지점이 세 곳이고 사정사마다 전문 분야가 다릅니다. 그런데 의뢰인이 담당자를 확인할 방법이 전화밖에 없었습니다.

또한 멤버들 PR을 위해 명함 지원 뿐 아니라 개별 사이트를 과거에 마치 자영업자 홈페이지를 무료로 만들어주던 서비스(모다?모두?)같이 제공하면 어떨까 해서 작업을 시작해보았습니다

노션을 데이터베이스로 붙였습니다

B로 가려면 사람 정보를 코드 밖에 둬야 합니다. 그래야 직원이 늘어도 제가 코드를 안 건드립니다.

노션 DB 두 개를 만들었습니다. 코워크에서 MCP로 대화하면서 만들어서, 노션 화면을 한 번도 열지 않았습니다.

역할

지산 멤버 프로필

사람 — 이름, slug, 직함, 경력, 연락처

지산 처리사례

사례 — 담당자로 멤버와 연결

여기서 욕심이 하나 더 생겼습니다. 매달 사내에서 좋은 처리 사례가 나오는데 담당자 머릿속에만 남습니다. 이걸 각자 페이지에 자동으로 얹으면 대외 영업과 사내 전파를 한 번에 해결하겠다 싶었습니다.

배포 — 코워크로 어디까지 되나

Vercel MCP를 붙이고 코워크에서 바로 배포를 시켜봤습니다.

첫 배포는 됐습니다. 파일을 통째로 올려 프로젝트가 생기고 주소까지 나왔습니다.

폰으로도 되겠다 싶었죠.

(코워크가 모바일 버전도 풀렸길래 클로드 코드 대신 해봤습니다)

그런데 수정본을 올리려니 막혔습니다.

You don't have permission to create a Preview Deployment
for this Vercel project: jisan-members.

production도 preview도 403. 커넥터는 새 프로젝트를 만들 때만 배포할 수 있고, 이미 있는 프로젝트에는 못 씁니다. 결국 프로젝트를 지우고 다시 만들어 우회했습니다. 조회 API도 막혀 있어서 빌드 성공 여부조차 매번 화면을 열어 확인해야 했고요.

그래서 이렇게 정리했습니다. 기준은 하나입니다 — 파일 내용을 바꾸는 일만 AI, 나머지는 터미널.

코워크 (폰·외부)

로컬 (VS Code)

잘하는 것

갈림길 정리, 노션 DB 설계, 코드 초안

배포, 환경변수, 수정 반복

배포

최초 생성만

git push 하나로 끝

결과 확인

못 봄

즉시

코워크   설계 → 노션 DB → 코드 초안
로컬     GitHub push → Vercel 연결 → 환경변수 → 배포
이후     클로드 코드로 수정 → push (자동 배포)

확장이 실제로 되는지 세 번 시험했습니다

만드는 것보다 늘리는 게 되는지가 이 프로젝트의 핵심이라 하나씩 확인했습니다.

① 멤버 추가 — 코드 없이 ✅ 노션에 행 추가하고 공개 체크. 5분 안에 페이지가 생깁니다. 기다리기 싫으면 /api/revalidate 주소를 누르면 즉시 반영...

② 사진 추가 ✅ 처음엔 노션 첨부로 하려 했는데 노션 이미지 주소는 1시간 뒤 만료됩니다. 명함 QR 찍고 들어온 고객에게 깨진 사진이 보일 수 있죠. 그래서 public/members/{slug}.jpg 로 저장소에 넣는 방식으로 갔습니다. 이쪽이 노션 사진보다 우선하도록 만들어뒀습니다.

③ 클로드 코드로 세부 수정 ✅