[Git]리액트 프로젝트 생성 후 github 연동 명령어/주의사항(README.md/branch)

오랜만에 프로젝트를 생성해서 깃연동부터 두번의 난관이 있었다,, 그래서 정리해두는 리액트 깃허브 연동법!

 

연동 순서

 

1. 리액트 프로젝트 생성

create-react-app 프로젝트이름

 

2. 깃허브 리포지토리 생성

 : 깃허브 홈페이지에서 수동으로 리포지토리를 생성해준다. 추후 연동할 때 이 리포지토리의 주소가 필요!

 

 

※ 주의할 점

앞선 리액트 폴더를 생성할 때 자동으로 README.md파일이 만들어져 있음! 그래서 

리포지토리 만들 때 이 README 파일을 체크하면 파일이 2개라서 연동할 때 충돌이 생겼었다..

그래서 굳이 추가할 필요가 없음! 난 아래 내용을 삭제하고 충돌처리하여 올렸다 ^^,,

 

react에 기본 생성되는  README.md 내용

 

3. 기본 브랜치 설정

git init
//새로운 Git 저장소를 초기화
//폴더나 프로젝트 디렉토리에서 이 명령어를 실행하면 그 디렉토리를 Git 저장소로 지정
//.git이라는 숨겨진 디렉토리를 생성하고, Git이 프로젝트의 버전을 관리
// 이미 Git 저장소가 있는 경우에는 다시 초기화할 필요가 없지만,
//새로운 저장소를 생성할 때는 git init 명령어를 사용하여 초기화

 

※ 주의할 점

create-react-app로 리액트 프로젝트를 생성하면 master가 기본 브랜치로 지정되어 있음

하지만 github는 main을 기본 브랜치로 사용하므로 리액트의 기본 브랜치를 재설정 해줘야한다.

git branch -M main
//-M 은 현재 브랜치를 가리킴
// 현재 브랜치의 이름을 main으로 변경하는 명령어

 

그리고 앞으로 생성할 프로젝트에서 공통적으로 기본 브랜치를 main으로 생성하도록 설정을 변경해놓을 수도 있다.

git config --global init.defaultBranch main
//config --global : Git의 전역 설정을 변경(해당 컴퓨터에서 Git을 사용하는 모든 곳에 적용되는 설정을 변경)
//앞으로 생성되는 git저장소의 기본 브랜치의 이름을 main으로 변경

 

처음에 이걸 몰랐을 때 push를 했다가 main브랜치와 master브랜치 2개가 생겨서 상당히 난감했었다..

 

 

4. 연동하기

git remote add origin https://github.com/사용자명/리포지토리명.git
-- 현재 작업 중인 Git 저장소에 원격 저장소(remote repository)를 추가하는 명령어

 

생성해둔 리포지토리 주소를 통해 원격 저장소에 연결해준다. 

git pull origin main
-- 원격저장소(origin)로부터 변경내용을 가져오는 명령어

 

pull을 받지 않고 올리면 버전차이로 충돌이 생겨 올릴 수 없음

 

git add .
-- 현재 디렉토리의 모든(.) 변경 사항을 Staging Area로 추가

git commit -m "커밋메세지"

git push origin main

 

 

push까지 완료했다면 github 사이트에서 잘 올라갔는지 확인하면 된다!