학습 목표
- 개발을 시작하기 전 기본 개념의 역할과 적용 조건을 설명할 수 있다.
- 내 서비스의 화면·서버·장부·외부 API를 각각 한 칸에 적으세요.
- 공개 설정과 비밀키를 구분한 환경설정 목록을 만드세요.
사전 지식
앞선 어떤 AI 도구를 선택해야 할까?를 먼저 읽으면 용어를 이해하기 쉽습니다. 이미 아는 내용이면 이 장부터 시작해도 됩니다.
개념 이해
앱을 식당에 비유하면 화면은 메뉴판, 서버는 주문을 처리하는 주방, 데이터베이스는 장부입니다. 서로의 역할을 나누어 이해하면 AI의 설명과 오류를 더 쉽게 읽을 수 있습니다.
웹사이트와 웹 애플리케이션
웹사이트는 정보 전달에, 웹앱은 사용자의 행동과 데이터 처리에 초점이 있습니다. 실제 서비스는 두 성격을 함께 가집니다.
프론트엔드와 백엔드
프론트엔드는 사람이 조작하는 화면입니다. 백엔드는 신뢰할 수 있는 환경에서 저장과 권한, 업무 규칙을 처리합니다.
클라이언트와 서버
클라이언트는 요청을 보내는 브라우저나 앱, 서버는 요청에 응답하는 프로그램입니다. 브라우저 안에서 실행하는 비밀 검증은 사용자가 바꿀 수 있습니다.
데이터베이스와 API
데이터베이스는 구조를 갖춘 장부입니다. API는 장부를 읽고 바꾸는 약속된 창구이며 모든 요청을 허용한다는 뜻은 아닙니다.
프레임워크와 라이브러리
라이브러리는 필요한 부품을 가져오는 방식, 프레임워크는 정해진 틀 안에 부품을 배치하는 방식에 가깝습니다.
호스팅과 도메인
호스팅은 프로그램이 동작할 공간, 도메인은 사람이 기억할 주소입니다. 주소를 샀다고 서버나 메일 서비스가 자동으로 생기지는 않습니다.
인증과 로그인
인증은 누구인지 확인하는 절차, 권한은 무엇을 할 수 있는지 정하는 규칙입니다. 로그인했다고 모든 데이터에 접근할 수 있어서는 안 됩니다.
Git과 GitHub
Git은 파일 변경을 기록하는 도구, GitHub는 기록을 공유하고 검토하는 서비스입니다. GitHub 없이도 Git은 사용할 수 있습니다.
개발·운영·배포·업데이트
개발 환경은 연습 공간, 운영 환경은 실제 사용자 공간입니다. 배포는 검증한 버전을 운영에 올리는 절차이며 업데이트는 그 버전을 바꾸는 일입니다.
환경변수와 API Key
환경변수는 실행 환경별 설정을 담습니다. API 키는 서비스 접근 수단이며 공개해도 되는 식별자와 서버 비밀키를 구분해야 합니다.
JSON과 HTTP
JSON은 이름과 값으로 데이터를 적는 형식입니다. HTTP 요청에는 주소·메서드·헤더·본문이 있고 응답에는 상태 코드와 결과가 있습니다.
실제 사용 사례
회원이 게시글을 작성하면 브라우저가 HTTP 요청을 보내고 서버가 인증·입력 검증을 거친 뒤 장부에 기록합니다. 응답이 성공해야 화면이 저장 완료를 표시합니다.
단계별 실습
실습은 운영 서비스가 아닌 별도 연습 프로젝트에서 진행하세요. 기존 파일이 있다면 변경 전 기록을 남깁니다.
- 내 서비스의 화면·서버·장부·외부 API를 각각 한 칸에 적으세요.
- 게시글 제목 하나를 JSON으로 표현하세요.
- 브라우저 개발자 도구의 Network에서 요청 메서드·상태·응답을 확인하세요.
- 공개 설정과 비밀키를 구분한 환경설정 목록을 만드세요.
코드와 프롬프트
아래 코드는 브라우저 개발자 도구의 응답 보기 환경의 예시입니다. 실제 프로젝트의 버전과 기존 구성을 확인한 뒤 필요한 부분만 적용하세요.
{"id":"post-1","title":"첫 번째 기록","ownerId":"user-1"}아래 요청에서 대괄호 부분을 내 프로젝트에 맞게 바꾼 뒤 AI 도구에 전달하세요.
서비스는 [서비스]야. 회원이 글을 쓰는 과정을 클라이언트·서버·API·데이터베이스·인증·권한의 역할로 나누어 설명해줘. 요청과 응답 JSON 예시를 들고 공개 설정과 비밀키가 어디에 있어야 하는지도 표시해줘.자주 발생하는 문제와 해결
| 문제와 원인 | 해결 방법과 확인 기준 |
|---|---|
| 환경변수면 무조건 비밀이라고 생각함 | 브라우저 번들에 포함되는 공개 접두어는 비밀 저장용이 아닙니다. |
| 성공 상태만 보고 데이터가 있다고 생각함 | 응답 형식과 실제 저장 여부도 확인합니다. |
핵심 요약
- 화면과 서버의 신뢰 수준은 다릅니다.
- 요청→검증→저장→응답 흐름을 이해합니다.
완료 확인
참고자료
확인 기준일: 2026-10-20. 요금·사용 한도·제품 기능·설정 경로는 변경될 수 있으므로 작업 직전 공식 문서와 설치 버전을 확인하세요.