← 돌아가기

Step 0: 프로젝트 폴더 정리

🗂️ 왜 폴더 정리가 필요한가요?

나쁜 예

📁 바탕화면/my-app
📁 다운로드/test
📁 문서/project
📁 바탕화면/프로젝트1

찾기 어렵고 관리 힘듦!

좋은 예

📁 Documents/
  📁 projects/
    📁 my-app/
    📁 note-app/

깔끔하고 찾기 쉬움!

💡

왜 중요한가요?

  • • 프로젝트 찾기 쉬움
  • • Git이 위치를 기억
  • • 나중에 관리 편함

📁 권장 폴더 구조

📁 Documents/          # 또는 문서 폴더
  📁 projects/         # 개발 프로젝트 모음
    📁 my-app/             # 우리가 만들 프로젝트
    📁 note-app/           # 메모 앱
    📁 counter-app/        # 카운터 앱
    ...

✅ 이렇게 하세요

  • • 문서 폴더 안에 projects 폴더 만들기
  • • 모든 개발 프로젝트는 projects 안에
  • • 영어로 폴더명 짓기 (공백 없이)
  • • iCloud 자동 백업!

❌ 피하세요

  • • 바탕화면에 프로젝트 만들기
  • • 한글 폴더명 (Git 오류 가능)
  • • 공백 포함된 이름 (예: "내 프로젝트")

💻 실습: 개발 폴더 만들기

1

터미널 열기

맥: Cmd + Space → "터미널" 입력

2

문서 폴더로 이동

cd ~/Documents

💡 ~는 홈 폴더를 의미합니다

3

projects 폴더 만들기

mkdir projects

💡 mkdir = make directory (폴더 만들기)

4

projects 폴더로 이동

cd projects
5

Next.js 프로젝트 만들기

npx create-next-app@latest my-app

# 질문에 다음처럼 답하세요:
# TypeScript? No
# Tailwind CSS? Yes
# App Router? Yes
# 나머지는 Enter (기본값)

✅ 완료! ~/Documents/projects/my-app 폴더가 생성되었습니다!

✅ 제대로 만들어졌는지 확인

현재 위치 확인

pwd

다음처럼 나와야 합니다:
/Users/사용자명/Documents/projects

폴더 목록 보기

ls

my-app 폴더가 보여야 합니다!

프로젝트 폴더로 이동

cd my-app

🎨 VS Code에서 열기

방법 1: 터미널에서

code .

💡 점(.)은 "현재 폴더"를 의미합니다

방법 2: VS Code에서 직접

  1. 1. VS Code 실행
  2. 2. File → Open Folder
  3. 3. Documents/projects/my-app 선택

💡 핵심 정리

✅ 앞으로 이렇게 하세요!

  1. 1. 새 프로젝트 만들 때마다 ~/Documents/projects/로 이동
  2. 2. 거기서 프로젝트 생성
  3. 3. 모든 개발 프로젝트가 한 곳에 정리됨!

🎯 이제 프로젝트를 절대 잃어버리지 않습니다!

🚀 상급자 팁: 나중에는 이렇게!

프로젝트가 많아지면 더 체계적으로 분류할 수 있어요:

~/projects/
├── learning/      # 학습용 (튜토리얼, 강의)
├── personal/      # 개인 프로젝트 (포트폴리오)
├── playground/    # 실험, 테스트
├── work/          # 실무 프로젝트
├── archived/      # 완료/보관
└── opensource/    # 오픈소스 기여

📚 초급자 (지금)

~/Documents/projects/

• 간단하게 시작
• iCloud 자동 백업
• 모든 프로젝트 한 곳에

🎯 상급자 (나중에)

~/projects/

• 짧은 경로
• 목적별 분류
• 전문가 구조

💡 지금은 ~/Documents/projects/만 사용하세요!
프로젝트가 10개 이상 되면 상급자 구조로 옮겨도 됩니다.

🤔 Git이 뭔가요?

💾

저장소 (Repository)

USB에 파일 백업하는 것처럼
코드를 저장하는 곳

📸

커밋 (Commit)

특정 시점의 스냅샷
"이 순간을 저장!"

☁️

GitHub

온라인 저장소
어디서나 접근 가능

💡 쉽게 이해하기

Git = 코드의 "시간 여행 기계" ⏰
언제든 과거로 돌아갈 수 있고, 여러 버전을 관리할 수 있어요!

🎯 필수 3개 명령어만 외우세요!

1

git add .

저장할 파일을 선택합니다.

git add .

💡 점(.)은 "모든 파일"이라는 뜻

2

git commit -m "메시지"

저장하고 메시지를 남깁니다.

git commit -m "첫 번째 커밋"

💡 메시지는 무엇을 했는지 설명

3

git push

GitHub에 업로드합니다.

git push

💡 온라인으로 올리는 단계

📊 전체 흐름

# 1. 파일 선택
git add .

# 2. 저장
git commit -m "카운터 기능 추가"

# 3. GitHub에 업로드
git push
💻
내 컴퓨터
📸
저장
☁️
GitHub

✅ Git 설치 확인

터미널을 열고 다음 명령어를 입력하세요:

git --version

✅ 성공

git version 2.39.0

버전이 나오면 설치되어 있습니다!

❌ 실패

command not found

git-scm.com 에서 설치하세요

⚙️ Git 초기 설정 (처음 한 번만)

이름과 이메일을 설정합니다. (GitHub 계정과 동일하게)

# 이름 설정
git config --global user.name "홍길동"

# 이메일 설정
git config --global user.email "your@email.com"

💡 이 설정은 컴퓨터에서 딱 한 번만 하면 됩니다!

💡 핵심 정리

외울 것 3개!