1. 로컬 실행과 공개 배포의 차이
게임 제작 후 데스크톱 앱의 미리보기 화면에서 localhost 주소 확인.
이 주소가 현재 컴퓨터에서만 사용할 수 있는 개발용 주소라는 점에 대한 이해. 다른 컴퓨터나 휴대폰에서 접속하려면 Vercel 같은 호스팅 서비스에 배포해야 한다는 점 확인.
localhost → 현재 컴퓨터의 개발 화면
Vercel 주소 → 인터넷에서 접속 가능한 공개 화면직접 서버 명령을 입력하는 방법보다 로컬 실행과 공개 배포의 개념적 차이에 대한 학습.
2. Git의 역할에 대한 이해
Git 명령은 데스크톱 AI 앱이 대신 실행했지만, 작업 과정에서 다음 개념 확인.
프로젝트 폴더를 Git 저장소로 관리하는 과정
변경된 파일을 커밋으로 기록하는 과정
로컬 파일과 GitHub 파일이 자동으로 같아지는 것은 아니라는 점
커밋한 내용을 푸시해야 GitHub에 반영된다는 점
main이 기본 작업 브랜치라는 점
Git 명령 자체를 익힌 것보다는 파일 변경, 커밋, 푸시가 서로 다른 단계라는 점에 대한 이해.
3. GitHub와 Vercel의 역할 구분
처음에는 GitHub에 게임을 올리면 곧바로 웹사이트가 되는 것으로 생각할 수 있는 상황.
작업을 진행하면서 두 서비스의 역할이 다르다는 점 확인.
GitHub → 소스코드와 변경 이력 보관
Vercel → 완성된 파일을 웹사이트로 배포데스크톱 앱에서 GitHub 저장소 연결과 푸시를 요청한 후에도 Vercel 배포 여부를 별도로 확인해야 했던 경험. 이를 통해 코드 저장과 웹사이트 공개가 서로 다른 작업이라는 점 학습.
4. 단일 HTML 파일의 특징
처음에는 여러 파일로 구성된 웹 프로젝트 제작. 이후 하나의 HTML 파일로 만들어 달라고 요청해 단독 실행 파일 생성.
파일 링크를 데스크톱 앱 안에서 열었을 때 게임 대신 글씨와 코드만 보이는 상황 발생. HTML 파일은 내용 보기 방식으로 열면 코드가 표시되고, 웹브라우저로 실행해야 실제 화면이 표시된다는 점 확인.
데스크톱 앱의 파일 보기 → 코드 또는 글씨 표시 가능
웹브라우저로 열기 → 게임 실행단일 HTML 파일에는 화면, 디자인, 게임 기능을 모두 포함할 수 있으며 별도의 설치 없이 브라우저에서 실행할 수 있다는 점에 대한 학습.
데스크톱 AI 앱의 역할
이번 작업에서 데스크톱 앱은 단순한 질문·답변 도구가 아니라 실제 작업을 수행하는 개발 도구의 역할.
사용자가 자연어로 다음과 같이 요청.
테트리스 게임을 만들어줘
HTML 파일로 만들어줘
GitHub 저장소를 연결해줘
파일을 올려줘
Vercel에 배포해줘AI가 요청에 따라 수행한 작업.
게임 파일 작성
로컬 실행 환경 준비
오류 확인과 수정
Git 저장소 상태 확인
GitHub 원격 저장소 연결
커밋과 푸시
Vercel 로그인 확인
프로덕션 배포
공개 주소 접속 검사
사용자는 작업 방향을 결정하고, 외부 서비스 연결이나 배포처럼 권한이 필요한 단계에서 승인하는 역할.
사례의 정확한 핵심
이번 경험을 통해 배운 것은 직접 코드를 모두 작성하거나 Git 명령어를 암기한 것이 아님.
핵심 학습은 다음과 같음.
자연어 요청으로 웹게임을 제작할 수 있다는 점
AI가 만든 결과도 사용자가 직접 확인해야 한다는 점
로컬 실행과 인터넷 배포가 다르다는 점
Git, GitHub, Vercel이 각각 다른 역할을 담당한다는 점
파일 생성, 커밋, 푸시, 배포가 구분된 단계라는 점
계정 연결과 외부 배포에는 사용자 승인이 필요하다는 점
결과물의 주소와 공개 범위를 확인해야 한다는 점
