[Git]VSCode설치부터 html을 깃허브GitHub에 연동하고 올리기

준비물 : vscode 회원가입, github 회원가입, github에 html 파일을 올릴 리포지토리 생성해두기

 

< VSCode 설치 >

 

1. 설치 링크 : https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

다음 다음 쭉쭉쭉 눌러서 설치를 해줍니다.

 

*추가 작업 선택 설명

 

1) "Code(으)로 열기" 작업을 Windows 탐색기 파일의 상황에 맞는 메뉴에 추가

 : 파일에 오른쪽 마우스 클릭 시 VSCode로 열 수 있는 기능 제공

 

2) "Code(으)로 열기" 작업을 Windows 탐색기 디렉터리의 상황에 맞는 메뉴에 추가

 : 폴더에 오른쪽 마우스 클릭 시 VSCode로 열 수 있는 기능 제공

 

3) Code을(를) 지원되는 파일 형식에 대한 편집기로 등록합니다.

 : VSCode로 열 수 있는 파일은 바로 VSCode로 실행

 

4) PATH에 추가(다시 시작한 후 사용 가능)

 : VSCode를 PATH에 추가

 

 

2. 한글 에디터 설치

영어가 불편하신 분들은 Korean Language Pack을 설치하여 한글로 전환해줍시다.

 

 

< Git 설치 및 환경설정 >

 

1. 설치 링크 : https://git-scm.com/

Git

이것도 다음 다음 쭉쭉쭉 눌러서 설치를 해줍니다. 

 

 

2. 다운로드 후 Git Bash 열기

 

 

3. 이름과 이메일 설정

git config --global user.name "본인 이름"

git config --global user.email "본인이 가입한 Github 이메일 주소"

-> 아무런 일도 일어나지 않습니다.

 

* 잘 됐나 확인하기 : git config --list를 쳐서 맨 밑에 user.name과 user.email 확인.

 

 

< VSCode로 html 파일 만들기 >

 

 

1. [파일] - [폴더 열기]에서 아무 폴더나 만들어줍니다.

저는 바탕화면에 html이라는 폴더를 만들었습니다.

 

 

2. 새 파일 생성

파일명 뒤에 .html을 필수로 입력해주셔야 합니다.

 

 

3. 생성된 코드 영역에 "!"를 입력(따옴표 제외, 느낌표만)하면 다음과 같이 자동으로 완성된 코드 생성.

 

 

4. 저장하기

 

 

< html을 GitHub에 Commit 하기 >

 

1. [터미널] - [새 터미널new terminal] 클릭

 

 

2. Git Bash 클릭

 

 

3. git 초기화 및 파일 추가

1) git init : git을 초기화 / 맨 처음 프로젝트를 올릴 때 git init을 해줍니다. 이후 프로젝트를 올릴 때는 써줄 필요가 없습니다.

 

2) git add 파일명 : git에 올릴 파일명을 작성해줍니다. 저는 방금 first.html로 파일을 만들었기 때문에

git add first.html이라고 쳐줬습니다.

* 폴더에 있는 모든 파일을 올리고 싶을 때 : git add . (git add 스페이스+점)

 

 

4. 히스토리 만들기

 

git commit -m "first commit" : 첫 번째 커밋. 코드를 작성할 때, 여러 번에 걸쳐서 작성되는 경우가 많기 때문에 몇 번째 수정인지 따로 표기해둡니다. (ex. 과제 수정할 때 보고서 수정1 - 보고서 수정2 - 보고서 수정3 - 보고서 최종 - 보고서 찐최종 등등)

두 번째 second commit, 세 번째 third commit 등등.. 꼭 first commit이 아니더라도 자유롭게 작성해주시면 됩니다.

 

 

5. 내 Git에 연결하기

1) Git에 연결 : git remote add origin git@github.com:계정/리포지토리

*계정이나 리포지토리 잘못 입력했을 때 : git remote remove origin으로 삭제하시고 다시 진행하시면 됩니다.

 

2) 연결이 잘 됐나 확인 : git remote -v

 

 

여기까지 잘 진행하셨다면, 

 

3) git에 파일 올리기 : git push origin master

 

짜잔