🎬 Git Clone 하는 법 (단계별 따라하기!)

이거, 진짜 쉬워요! 딱 세 단계만 기억하시면 됩니다. 자, 여기 별표 세 개! ⭐⭐⭐

VS Code 실행 후, ‘소스 제어’ 뷰로 이동! 먼저 VS Code를 열어주세요. 그리고 왼쪽 사이드바를 보시면 ‘소스 제어(Source Control)’ 아이콘 (깃발 모양)이 있어요. 이걸 클릭하거나, 단축키 Ctrl + Shift + G (macOS는 Cmd + Shift + G)를 눌러서 소스 제어 뷰를 열어줍니다.

💡 저스틴의 팁! 만약 아무런 폴더도 열려 있지 않다면, VS Code는 친절하게 “Git 저장소 복제(Clone Repository)” 또는 “폴더 열기(Open Folder)” 같은 옵션을 바로 보여줄 거예요. 아주 편리하죠?
‘저장소 복제(Clone Repository)’ 명령 실행! 소스 제어 뷰 상단에 보시면 ‘저장소 복제’ (Clone Repository) 버튼이나 링크가 보일 거예요. 또는 VS Code 상단 메뉴에서 보기(View) > 명령 팔레트(Command Palette)를 선택 (단축키 Ctrl + Shift + P 또는 Cmd + Shift + P) 한 다음, 검색창에 **”Git: Clone”**이라고 입력하고 선택해도 돼요.

🔍 검색 팁! 명령 팔레트는 VS Code의 모든 기능을 검색해서 실행할 수 있는 만능 도구예요. 마치 궁금한 게 있을 때 검색 엔진에 바로 물어보는 것과 같죠!
Git 저장소 URL 붙여넣기 & 저장 위치 선택! 명령을 실행하면 입력창이 하나 뜰 거예요. 여기에 복제하고 싶은 Git 저장소의 URL 주소를 붙여넣으세요. 보통 GitHub나 GitLab, Bitbucket 같은 곳에서 ‘Clone’ 버튼을 누르면 나오는 주소 있죠? https://github.com/사용자이름/저장소이름.git 이런 식으로 생긴 주소요.
주소를 입력하고 Enter를 누르면, 이제 내 컴퓨터 어디에 이 프로젝트를 저장할지 폴더를 선택하라고 뜰 거예요. 원하는 폴더를 선택하고 ‘저장소 위치 선택’ 버튼을 클릭하면 끝!

잠시 기다리면 VS Code가 해당 Git 저장소를 내 컴퓨터로 통째로 복제하고, ‘복제된 저장소를 여시겠습니까?’라고 물어볼 거예요. 당연히 ‘열기(Open)’를 눌러서 바로 작업 시작하면 됩니다! 🎉

🪄 코드 자동 포맷팅 설정

자, 그럼 VS Code에서 .dart 파일을 붙여 넣었을 때 자동으로 코드를 예쁘게 정돈해주는 마법을 걸어볼까요? 자, 여기 별표 세 개! ⭐⭐⭐ 이건 정말 꿀팁입니다!

1단계: Dart & Flutter 확장 프로그램 확인하기!

가장 먼저 확인해야 할 것은 VS Code에 Dart 및 Flutter 확장 프로그램이 잘 설치되어 있는지예요. 이 확장 프로그램들이 있어야 Dart 코드의 문법을 이해하고 올바르게 포맷팅해줄 수 있거든요. 마치 요리할 때 필요한 전문 조리 도구 같은 거죠! 🧑‍🍳

VS Code 왼쪽 사이드바에서 ‘확장(Extensions)’ 아이콘(네모 4개 모양)을 클릭하세요.
검색창에 Dart 또는 Flutter를 검색해서 설치되어 있는지 확인합니다.
만약 설치되어 있지 않다면, ‘Install’ 버튼을 눌러 설치해주세요!

2단계: ‘붙여넣기 시 서식 지정(Format On Paste)’ 설정 활성화하기!

이제 핵심 설정입니다! 📋

VS Code에서 Ctrl + , (Comma) 키를 눌러 ‘설정(Settings)’을 엽니다. (Mac이라면 Cmd + ,)
검색창에 format on paste라고 입력하세요.
그러면 Editor: Format On Paste라는 설정이 보일 거예요. 이 설정 옆의 체크박스에 체크를 해주세요! ✅
- 이건 “붙여넣기 할 때마다 코드를 자동으로 예쁘게 정돈해줘!” 라고 VS Code에게 명령하는 것과 같아요.
혹시 모르니, Editor: Default Formatter 설정도 확인해보면 좋아요.
- 검색창에 default formatter를 입력하고, 드롭다운 메뉴에서 Dart 또는 Dart-Code.dart-code가 선택되어 있는지 확인해 보세요. (보통 Dart 확장 프로그램이 설치되면 자동으로 설정됩니다.)

3단계: (선택 사항) 저장 시 자동 포맷팅 설정도 함께!

붙여넣기 할 때뿐만 아니라, 파일을 저장할 때도 자동으로 코드를 예쁘게 정리해주면 정말 편리하겠죠? 이건 마치 요리 후에 주방을 바로바로 정리하는 습관과 같아요! 🧹

다시 설정 검색창에 format on save라고 입력하세요.
Editor: Format On Save 설정 옆의 체크박스에 체크를 해주세요! ✅

빠른 수정(Quick Fix) (코드를 작성하다가!)

이 방법은 여러분이 코드에서 어떤 패키지의 기능을 사용하려고 하는데, 아직 import도 안 하고 pubspec.yaml에도 추가 안 했을 때 유용해요.

.dart 파일에서 사용하고 싶은 외부 패키지의 클래스나 함수를 그냥 타이핑합니다. (예: SharedPreferences.getInstance())
그러면 VS Code가 “어? 이거 처음 보는 건데?” 하면서 해당 코드 아래에 빨간 밑줄을 띄울 거예요. 🔴
빨간 밑줄이 있는 코드 위에 마우스 커서를 올리거나, Ctrl + . 키를 누르면 (Mac은 Cmd + .), ‘빠른 수정(Quick Fix)’ 옵션이 나타납니다.