OPEN HYPER STEP
← 목록으로 (프로젝트 기획)
PROJECT-PLAN · 20 / 34
project-plan
CHAPTER 20 / 34
읽기 약 2
FUNCTION

환경변수 관리


핵심 개념

API 키를 코드에 직접 쓰면 GitHub에 노출됩니다. 환경변수로 안전하게 관리하는 법을 배웁니다.

본문

ENV 관리❌ 절대 금지:const key = "sk-abc123..." // 코드에 직접✅ 올바른 방법:.env.local (gitignore에 추가)NEXT_PUBLIC_SUPABASE_URL=...OPENAI_API_KEY=sk-....env.example (git에 올림):NEXT_PUBLIC_SUPABASE_URL=your_urlOPENAI_API_KEY=your_key⚠️ NEXT_PUBLIC_ = 브라우저 노출민감 정보는 절대 NEXT_PUBLIC_ X


🛠️ 이 챕터의 실습 방법

실습 1: SEO 기초 체험

  1. https://search.google.com/search-console 에 사이트 등록
  2. meta 태그 작성 연습:
HTML📋 코드 (2줄)
<title>페이지 제목 (60자 이내)</title>
<meta name="description" content="페이지 설명 (155자 이내)">
  1. https://metatags.io 에서 OG 태그 미리보기 확인

실습 2: 보안 체크리스트 점검

자신의 프로젝트에 아래 항목을 체크하세요:

  • HTTPS 적용
  • 환경변수로 시크릿 관리 (.env)
  • .gitignore에 .env 추가
  • 입력값 검증 (서버 사이드)
  • 비밀번호 해싱 (bcrypt)

실습 3: GA4 설치 체험

https://analytics.google.com 에서 측정 ID를 발급받고 프로젝트에 추가해보세요.


AI 프롬프트
🤖 AI에게 잘 물어보는 법 — 모델·전략별 프롬프트
무료 모델

Gemini 2.5 Flash(무료) + Claude Sonnet 4.6(무료) + Grok 4.1(무료)

'환경변수 관리' 기획을 0원으로 시작하고 싶어.
ChatGPT(아이디어) → Gemini(경쟁 분석) → Claude(기획서 구조화) 순서로
Notion+Figma+GitHub Projects만 사용하는 워크플로우를 설계해줘.
소자본 모델

Claude API + Cursor $20/mo + Make.com — 월 10~30만원

'환경변수 관리' 기획에 AI를 활용해서 시간을 단축하고 싶어.
Perplexity API(시장조사) + Claude API(문서 작성) + Cursor(프로토타입) 조합으로
1주일 안에 기획→MVP까지 끝내는 월 20만원 플랜을 짜줘.
프로덕션 모델

Claude Opus + CrewAI + LangGraph — 월 100만원+

'환경변수 관리'를 팀 프로젝트로 확장하려 해.
AI PM(Claude Opus) + AI 리서처(Perplexity) + AI 개발(Cursor+Copilot)
에이전트 팀과 AGENTS.md 협업 프로토콜을 월 100만원 예산으로 설계해줘.
스택 프롬프트

0원→$20/mo→$100/mo 단계별 스택 비교

'환경변수 관리' 기획에 최적화된 AI 도구 조합을 단계별로 알려줘.
무료(Notion+Figma+ChatGPT) → 소자본(Cursor+Perplexity API) → 프로덕션(CrewAI+LangGraph)
각 단계별 도구·결과물·전환 시점을 비교해줘.

⭐ 이것만 기억하세요
환경변수 관리 이 3가지만 확실히 잡으세요
1.환경변수를 관리하지 않으면 로컬 DB가 프로덕션에 연결되거나, API 키가 Git에 노출됩니다
2..env.local, .env.production으로 환경별 분리하고, .gitignore에 추가하며, .env.example로 팀에 공유합니다
3.다음 챕터에서 AI에게 파일 생성을 시키는 효율적인 방법을 배웁니다

공유하기
진행도 20 / 34