본문 바로가기

개발/React

[React] 프로젝트 시작 & git repository 연결

아래 링크를 참고해 진행했습니다.

 

[React] create-react-app으로 만든 프로젝트 git repository에 업로드하기

hello-world라는 프로젝트를 hello-people 계정의 repository에 업로드 하는 예시입니다. github repository를 hello-world라고 만들어줍니다. 프로젝트를 create-react-app을 사용해서 만들어줍니다. npx create-react-app he

dongwookit.tistory.com

 

1. github repository 만들기

이렇게 repository 만들 때 readme file 웬만해서 추가하지 말기!!

로컬에서 만들고 연결하려면 좀 복잡해지니.. (github의 history와 local의 history가 달라서 push/pull 할 때 귀찮음)

아무것도 추가하지 말고 그냥 만들기..

어차피 리드미 파일이나 라이센스 나중에 추가할 수 있으니까!

 

2. React 프로젝트 만들기

터미널에서 프로젝트 만들 위치로 이동하고, 

npx create-react-app (생성할 프로젝트 이름)

하기. 그러면 저 설정한 프로젝트 이름으로 폴더가 하나 생성됨.

이런 식으로.

그러면 이 생성된 프로젝트로 이동해준 다음에, (터미널 상으로 여기서는 cd sometimes)

3. .git 지우고 다시 생성하기

rm -rf .git
git init

이렇게 지우고 다시 git 환경을 만드는 이유가 궁금해서 chatGPT한테 물어보니,

이미 존재하는 `.git` 디렉토리를 삭제하고 `git init`을 다시 실행하는 것은 일반적으로 새로운 리포지토리를 초기화하거나 다른 설정으로 리포지토리를 새로 시작하기 위해 수행됩니다. 이 과정을 통해 현재 디렉토리의 Git 설정을 초기화하고, 원격 리포지토리를 새로 연결할 수 있습니다. 아래에 그 이유를 자세히 설명하겠습니다:

기존 `.git` 디렉토리를 삭제하는 이유
1. 새로운 리포지토리로 전환: 기존에 존재하는 `.git` 디렉토리는 이전에 다른 목적이나 프로젝트에서 사용된 설정 및 기록을 포함하고 있을 수 있습니다. 이를 삭제함으로써 새로운 프로젝트로 전환할 때 이전의 기록과 설정을 제거할 수 있습니다.

2. 리포지토리 초기화: `create-react-app`을 사용하면 기본 템플릿에 `.git` 디렉토리가 포함될 수 있습니다. 하지만 사용자가 해당 프로젝트를 새로운 리포지토리로 시작하고자 할 때, 기존의 Git 설정을 무시하고 새로 초기화하는 것이 깔끔한 방법일 수 있습니다.

3. 원격 저장소 변경: 프로젝트를 새로운 원격 저장소에 연결하고자 할 때, 기존 `.git` 디렉토리가 다른 원격 저장소와 연결되어 있을 수 있습니다. 이 경우 기존 `.git` 디렉토리를 삭제하고 새로 초기화하는 것이 더 간편합니다.

같은 경우일 때와 아닌 경우
- 같은 경우: 기본적으로 `.git` 디렉토리는 Git 리포지토리의 모든 정보(커밋 기록, 설정 등)를 포함하므로, 기존의 `.git` 디렉토리를 유지하고 사용해도 무방합니다. 단, 새로운 원격 저장소를 추가하거나, 새로운 프로젝트로 시작할 때 불필요한 이전 정보가 남아있을 수 있습니다.
  
- 다른 경우: 기존의 리포지토리 설정이 혼란을 일으킬 수 있는 경우, 또는 원격 저장소와의 충돌을 피하고자 할 때 `.git` 디렉토리를 삭제하고 새로 초기화하는 것이 더 명확하고 깔끔합니다.

결론
기존 `.git` 디렉토리를 삭제하는 것은 프로젝트를 새롭게 시작하고, 원격 저장소와의 혼란을 피하기 위한 방법입니다. 필수적인 것은 아니지만, 새로운 리포지토리 설정을 보다 명확하게 하기 위한 일반적인 방법입니다.

해당 작업이 필요 없는 경우도 있지만, 새로운 프로젝트로서 깨끗하게 시작하고자 할 때 유용한 방법입니다.

랍니다 ㅎㅎ..

4. github에서 만든 repository를 remote로 등록해주기

이렇게 주소 복사해서

git remote add origin (복사한 코드 주소)

해주기

git remote -v

로 잘 연결되었는지 확인 가능.

 

5. 다음 git repository에 시작한 react 프로젝트 push하기

git add .
git commit -m "Feat: first commit"
git push origin main

 

이렇게 하면

이렇게 잘 올라간 것을 확인 가능!