FIELD NOTE · 126
내 아이디어에 주소가 생겼다 표지
S&S ORIGINALS개발·노코드

코드가 생겼다는 착시를 끝내고, 다른 사람이 접속하는 주소까지

내 아이디어에 주소가 생겼다

코딩을 몰라도 Claude Code로 기획·화면·회원가입·DB·테스트·배포까지 끝내는 14일 웹서비스 빌드

그럴듯한 로컬 화면에서 멈추지 않고 요구사항·인증·데이터·권한·테스트·배포를 한 줄로 연결해 실제 주소를 만드는 비개발자용 바이브 코딩 필드 가이드.

#Claude Code#바이브 코딩#배포#보안#웹서비스

그럴듯한 화면이 아니라, 누군가 접속하고 가입하고 저장할 수 있는 서비스를 완성하세요.

한 번의 기적 프롬프트 대신 한 사람·한 문제·한 행동을 고르고, 프로젝트 문서와 완료 기준을 먼저 만든 뒤 화면·데이터·권한·오류·배포를 세로로 연결합니다.

웹서비스는 화면의 합이 아니라 사용 흐름의 연결이다. 입력·저장·권한·오류·배포 중 하나라도 끊기면 데모에 머문다.

읽고 난 뒤, 손에 남는 것

  1. 01아이디어를 사용자 행동과 완료 상태로 고정하는 한 문장 서비스 정의
  2. 02AI가 길을 잃지 않게 하는 PROJECT_BRIEF·FEATURES·USER_FLOW·DONE 문서
  3. 03화면 하나의 입력부터 데이터 저장과 다시 읽기까지 잇는 세로 슬라이스
  4. 04회원가입과 권한을 분리하고 두 계정으로 교차 접근을 확인하는 보안 테스트
  5. 05정상 상태를 저장하고 오류 범위를 좁히는 Git·복구·품질 게이트
  6. 06localhost를 미리보기와 운영 주소로 옮긴 뒤 첫 사용자로 검증하는 배포 루틴

설명보다 먼저, 실제 페이지를 보세요

표지와 목차만 보여주는 미리보기가 아닙니다. 책이 문제를 풀어가는 방식과 편집 리듬을 그대로 확인할 수 있습니다.

PAGE 003바이브 코딩 필드 가이드의 전체 빌드 지도
완료 기준·세로 흐름·복구·검증·배포라는 다섯 단어로 14일 제작 경로를 조망합니다.
PAGE 014GIVEN WHEN THEN 웹서비스 테스트 워크시트
화면의 인상이 아니라 현재 상태·한 가지 변경·통과 증거를 테스트 문장으로 남깁니다.
PAGE 053로그인과 권한을 구분하는 보안 근거 페이지
로그인 성공을 보안으로 착각하지 않도록 두 계정 교차 테스트와 RLS의 한계를 명시합니다.
PAGE 116PROJECT BRIEF 프로젝트 템플릿
읽은 내용을 사용자·문제의 순간·핵심 흐름·하지 않을 일로 고정하는 첫 실행 파일입니다.

정보를 나열하지 않고, 이 순서로 데려갑니다

  1. 01

    완성의 기준과 첫 버전의 범위를 정합니다

    화면이 보이는 것과 기능이 작동하는 것을 구분하고, 한 사람·한 문제·한 행동만 남깁니다.

  2. 02

    긴 프롬프트보다 먼저 네 개의 문서를 만듭니다

    프로젝트 브리프·기능 명세·사용자 흐름·완료 체크리스트로 AI의 판단 범위와 종료 조건을 고정합니다.

  3. 03

    첫 화면보다 세로 흐름 한 줄을 완성합니다

    코드를 만들기 전에 계획을 검토하고, 입력·서버 처리·저장·다시 읽기까지 핵심 가치 하나만 연결합니다.

  4. 04

    데모를 회원과 데이터가 있는 서비스로 바꿉니다

    회원가입·로그인·권한·입력 검증·비밀정보를 구분하고 두 계정과 직접 요청으로 접근 제어를 검사합니다.

  5. 05

    AI와 오류를 반복하는 루프에서 빠져나옵니다

    변경 전 정상 상태를 Git에 남기고 증상·원인·재현 절차를 분리해 한 번에 한 가설만 검증합니다.

  6. 06

    localhost를 실제 주소로 바꿉니다

    개발·미리보기·운영 환경을 나누고 빌드·환경변수·로그·리디렉션을 확인해 배포 후 오류를 추적합니다.

  7. 07

    첫 사용자 이후의 운영 시스템을 만듭니다

    멈춘 지점과 반복 행동을 관찰하고 요청을 분류해, 운영 중 서비스를 안전하게 수정하는 기준을 남깁니다.

이 책이 지금 필요한 사람

  • AI가 화면은 만들었지만 새로고침·회원가입·저장·배포에서 멈춘 비개발자
  • 긴 프롬프트를 반복할수록 요구사항이 빠지거나 기능이 서로 깨지는 사람
  • 개발 문법보다 첫 웹서비스를 끝까지 완성하는 순서가 필요한 사람
  • 로그인과 데이터 소유권
  • 테스트
  • 비밀키 같은 운영 기준을 놓치고 싶지 않은 사람
  • 한 프로젝트의 시행착오를 두 번째 서비스에 재사용할 시스템으로 만들고 싶은 사람

읽는 데서 끝나지 않게 만든 실행 자료

  1. FILE 01PROJECT_BRIEF.md 템플릿
  2. FILE 02FEATURES.md + USER_FLOW.md
  3. FILE 03DONE_CHECKLIST.md
  4. FILE 04CLAUDE.md + 첫 실행 프롬프트
  5. FILE 05테스트·보안 품질 게이트
  6. FILE 06Git과 배포 최소 명령
  7. FILE 07Supabase RLS 최소 예시

서재에 담기 전 확인하세요

코딩을 전혀 몰라도 가능한가요?

문법보다 제작 순서에 집중하지만 폴더·터미널·오류 메시지·환경변수를 다루는 기본 작업은 필요합니다. 각 단계는 관찰 가능한 완료 기준으로 설명합니다.

책의 설치 명령을 그대로 복사하면 되나요?

도구와 버전은 바뀔 수 있습니다. 구체적인 버튼 위치보다 프로젝트의 package.json, 공식 Quickstart, 빌드 로그를 우선 확인하도록 안내합니다.

이 책대로 하면 보안이 완전히 해결되나요?

아니요. 인증과 권한 분리, 비밀키, 입력 검증, 두 계정 교차 테스트의 기본 품질 게이트를 제공하지만 실제 서비스는 스키마와 위험에 맞춘 별도 검토가 필요합니다.

컴퓨터로 PDF 파일을 받을 수 있나요?

아니요. 저작권 보호를 위해 자료는 내 서재의 전용 뷰어에서만 열람하며 외부 파일 다운로드는 제공하지 않습니다.