바이브 코딩(Codex로 홈페이지 제작) 창업 도전기(8월)
요즘..
블로그 글이나, 유튜브다 죄다 AI .. AI…
물론 이 블로그를 만든진 얼마 안되었지만..
음..
AI는 유튜브나 네이버 등 배제하는 느낌이지만…
어찌됫듯.. 시대적인 흐름은 AI다 보니..
이속에서 내가 잘 활용하는 방법을 강구할 생각이다.
(아직 명확한 계획은 없다.)
다만 옛날부터, 제품리뷰 관련한 홈페이지를 만들고 싶었기 때문에..
기존에 GPT를 유료로 사용하고 있었는데.
코덱스라는 GPT안에 코딩 기능이 있어서,
그걸 이용한 코딩 관련 포스팅이다..
약 한달간 진행된 프로젝트…
홈페이지 제작 과정(5~8월 초)
제품을 검색하면 내가 직접 작성한 제품 정보와 후기부터 보여주고,
없으면 회원들이 직접 제품을 등록하고 의견을 남길 수 있는 사이트를 만들 수 없을까?
라는 신념하나로…
5월 즈음에 도메인을 구입(유튜브 보면서 따라함)
워드프레스 + 케미클라우드로 시작했다.
(초기자금 15만원)
다만, 코딩을 1도 몰라서 약간 방치하는 느낌….이였고..
본격적으로 시작한건 8월..
2026년 8월, 홈페이지 제작 시작
처음 시작은 밀리의서재로 HTML관련 서적을 보고 따라 했다.
딱 위에 정도 만드는데는 2일 정도 (하루면 가능하긴함)걸렸다..
(여기서 제품검색을 하면, 구글에서 검색하는걸로 시작했다..)
2026년 8월 둘째주 (코덱스를 활용)
본격적으로 Codex를 이용해서 홈페이지를 만들기 시작한 건 2026년 8월 초반이다.
처음에는 정말 단순했다.
HTML 파일과 CSS 파일을 만들고 가운데 로고와 검색창을 배치하는 정도였다.
Google처럼 검색창이 하나 있고, 내가 원하는 제품을 검색할 수 있는 형태였다.
그런데 만들다 보니 욕심이 계속 생겼다.
단순 검색 사이트보다는,
제품 검색 → 제품 정보 확인 → 없으면 직접 등록 → 다른 회원과 댓글로 의견 공유
가 가능한 일종의 제품 전문 위키 + 리뷰 커뮤니티를 만들어보고 싶어졌다.
사이트 이름은 기존에 운영하던 lilireview.com을 사용하기로 했다.
사갈.. 그냥 하라는대로 하기만했다..
뭔말인지는 1도 모르겠다..
1단계. HTML/CSS로 기본 홈페이지 만들기
처음에는 프론트 화면부터 만들었다.
검색창을 만들고 제품 검색 결과를 표시할 수 있도록 구성했다.
여기에 점점 기능을 추가했다.
제품 검색
제품 등록
제품 상세페이지
회원 로그인/회원가입
로그인한 회원의 제품 등록
제품 내용 수정
댓글
Google 검색
쿠팡 검색 위젯
네이버 카페/블로그 연결
처음에는 단순했던 홈페이지가 점점 하나의 서비스 형태로 변하기 시작했다.
특히 제품 등록 페이지는 일반적인 입력폼보다는 나무위키처럼 자유롭게 내용을 작성할 수 있는 구조를 목표로 했다.
제목, 문단, 목록, 이미지 등을 조합해서 하나의 제품 문서를 만드는 방식이다.
2단계. Supabase를 이용해 백엔드 만들기
화면만 만들어서는 실제 서비스가 될 수 없었다.
로그인을 하면 누가 로그인했는지 알아야 하고,
제품을 등록하면 다음에 다시 검색했을 때 나타나야 하고,
댓글을 작성하면 서버에 저장돼야 했다.
그래서 처음에는 Supabase를 사용했다.
Products 테이블을 만들고 로그인/회원가입 기능을 연결하면서 제품 데이터를 저장하는 구조를 만들었다.
이 단계에서 처음으로
프론트엔드와 백엔드는 완전히 다른 영역이라는 것도 알게 됐다.
HTML/CSS만 있다고 홈페이지가 완성되는 게 아니었다.
3단계. Supabase를 빼고 WordPress로 방향 변경
그런데 생각해보니 이미 나는 WordPress를 유료로 사용하고 있었다.
이미 서버와 저장 공간을 사용하고 있는데 굳이 Supabase까지 별도로 운영해야 할 필요가 있을까 싶었다.
그래서 방향을 바꿨다.
Supabase를 제거하고 WordPress를 백엔드로 사용하기로 했다.
구조는 대략 이렇게 바뀌었다.
사용자
↓
lilireview.com
↓
HTML / CSS / JavaScript
↓
WordPress REST API
↓
회원 / 제품 / 댓글 / 이미지
로그인도 WordPress 회원을 사용하고,
제품 데이터도 WordPress에 저장하고,
댓글과 이미지 역시 WordPress를 이용하는 방식이다.
지금 생각하면 프로젝트에서 꽤 큰 방향 전환이었다.
몰라도 너무 몰랐다… 처음부터 워드프레스 쓸껄…
망아지 같이..
이미지를 올릴려면 이미지를 저장하는 클라우드? 가 있어야 하는데
내가 SUPABASE로 로그인창과 이미지를 만들었기 때문에.. 나중에 용량이 차면
유료로 써야 한다.
근데 생각해 보면…
나는 워드프레스 유료로 사용하고 있는데??
하고….
지피티 한테 물어보니
워드프레스 유료면 워드프레스써라해서…
로그인창부터 다시 워드프레스에 맞춰서 짜달라고 했다..
문
제
는
여기서 일어났다…
준 코딩으로는 로그인도 안되고, 제품등록도 안되고…
그걸 고치기위해 질문을 하다가..
제한 용량을 다써버렸다..
여튼…
4단계. 워드프레스 전향 후 로그인 문제 봉착….
여기서 막혀서..
해결 못하고..
그냥 한달뒤에 다시해야 하나?
하루종일 gpt한테 물어보니..
개같은것…
나름 gpt go(대충 1만원짜리)쓰는데…
말길을 못알아 처먹는다..
화딱지가 난다..
코딩 배울겸 내가 수정할려고 했는데.
코덱스의 간편함이란….
결국..
5단계. ChatGPT Plus로 업그레이드
Codex를 계속 사용하다 보니 또 다른 문제가 생겼다.
바로 사용량 제한이었다.
처음에는 무료 버전으로 홈페이지를 만들고 있었는데, 코드를 계속 수정하고 오류를 잡다 보니 사용량이 상당히 빠르게 소진됐다.
특히 홈페이지 작업은 한 번 명령한다고 끝나는 게 아니었다.
코드 작성 → 실행 → 오류 발견 → 수정 → 다시 실행
이 과정이 계속 반복된다.
결국 2026년 8월 말 ChatGPT Plus로 업그레이드해서 Codex를 계속 활용하기로 했다.
처음에는 단순히 AI에게 코드를 물어보는 수준이었다면, 지금은 Codex에게 프로젝트 폴더 전체를 검토시키고 수정하도록 하는 방식으로 작업 방법 자체도 바뀌었다.
6단계. 2026년 8월 28일 현재
그리고 현재.
홈페이지의 기본적인 UI는 상당 부분 만들어졌다.
회원 로그인도 해결했고,
제품 등록 및 상세페이지 구조도 만들어져 있다.
제품 내용을 문서처럼 작성할 수 있는 편집 기능과 이미지, 버전 관리, 댓글 기능 등도 코드상으로 구현하고 있다.
하지만 아직 끝난 건 아니다.
현재 새롭게 막힌 부분이 있다.
바로 제품 검색 결과다.
이번에는 검색을 하면 아래와 같은 오류가 발생한다.
검색 실패: URL과 요청한 메소드에 일치하는 라우트를 찾을 수 없습니다.
📷 여기에 지금 올린 오류 화면을 넣으면 좋다.
특히 제목을
「로그인은 해결했는데 이번엔 검색이 안 된다」
정도로 붙이면 개발 기록 느낌이 꽤 잘 살아날 것 같다.
그리고 댓글 기능 역시 아직 정상적으로 해결하지 못했다.
그래서 2026년 8월 28일 기준 진행 상황을 정리하면,
완료된 부분: 기본 UI, 검색창, WordPress 기반 회원 구조, 로그인 문제 해결, 제품 등록 화면, 제품 상세페이지 및 편집 구조, Google/쿠팡 등 외부 검색 연결.
진행 중인 부분: 제품 검색 결과 API 오류 수정, 댓글 작성/저장 기능 정상화, 전체 기능 연결 및 오류 검증.
정도다.
코딩을 모르는데 홈페이지를 만들 수 있을까?
이번 프로젝트를 하면서 가장 크게 느낀 부분이다.
나는 처음부터 코드를 직접 작성할 수 있어서 이 홈페이지를 만든 게 아니다.
오히려 반대에 가깝다.
만들면서 HTML이 무엇인지, CSS가 무엇인지, JavaScript가 무엇인지, API가 왜 필요한지 하나씩 알게 되고 있다.
특히 이번 작업을 하면서 REST API, 세션, 쿠키, 데이터베이스, 프론트엔드와 백엔드 같은 개념도 자연스럽게 접하게 됐다.
AI가 모든 걸 한 번에 완벽하게 만들어주는 것도 아니었다.
실제로 로그인 문제 하나 때문에 코드를 여러 번 수정했고,
로그인을 해결하니 이번에는 검색이 안 되고,
검색을 고치려다 보면 댓글에서 문제가 발생한다.
그래도 예전이었다면 오류 메시지를 보는 순간 포기했을 텐데, 지금은 오류 화면을 캡처해서 Codex와 ChatGPT에게 보여주고 원인을 찾아 다시 수정하는 방식으로 계속 진행하고 있다.
앞으로 남은 작업
일단 다음 목표는 명확하다.
검색 결과 오류와 댓글 기능을 해결하는 것.
그다음 실제 cPanel에 최종 파일을 올리고 전체 기능을 하나씩 테스트할 예정이다.
최종적으로 원하는 형태는 단순하다.
제품을 검색한다.
→ 등록된 제품이 있으면 정보를 본다.
→ 제품이 없으면 로그인한 회원이 직접 등록한다.
→ 회원들이 제품 내용을 수정하고 정보를 추가한다.
→ 제품 페이지 아래에서 댓글로 의견을 나눈다.
일종의 제품에 특화된 위키 + 리뷰 커뮤니티다.
아직 갈 길은 조금 남았다.
그래도 2026년 8월 중순에 검색창 하나에서 시작했던 걸 생각하면 불과 몇 주 사이에 상당히 많은 걸 만들었다.
다음 기록에서는 가능하면,
「검색과 댓글 오류까지 해결, lilireview 1차 완성」
이라는 제목으로 글을 쓸 수 있었으면 좋겠다.
결론
차근차근 배우면서 만들껀데 놀러 오이소.
(현재 아무것도 없음..)
회원가입해서 제품 검색하고,
없으면 나무위키처럼..
글쓰면 됩니다.
추신 : GPT글 BASE에대가 내가 중간중간 글 넣으니깐.
가독성 개 떨어지네…
(다음부터 엥간해서, 제가 직접쓸께요.._)
