⚡️etc.

[Next.js X GitHub] Next.js 앱을 Github에 연동하기

s2ylvia 2024. 4. 16. 19:30

 

Nexj.js로 앱을 만들었다면 우리는 Github에 연동을 해줘야 합니다.

잔디도 심고, 공부내용도 기록하고, 코드도 관리하고 아주 중요한 요소죠.

 

하지만 저는 맨날 이 부분에서 애를 먹는데요, 이번에는 절 ㅡ 대 잊지 않기 위해 정리를 해보겠습니다.

 

 

레파지토리 생성하기

 

New 버튼을 눌러줍니다.

 

 

레파지토리 이름은 기존에 만들었던 앱의 이름, package.json의 name에 있는 값을 입력해주면 좋습니다.

README.md는 이미 앱 안에 있기 때문에 추가하지않아도 됩니다.

Create repository 버튼을 눌러줍니다.

 

 

정상적으로 만들어졌으면 해당 화면을 보게 됩니다.

Quick setup이 안내되어있는데, 사실 이대로 하시면 됩니다.

 

 

생성된 레파지토리와 연동하기

vscode에서 만든 앱의 폴더를 열어줍니다.

그리고 터미널을 켜 git init 명령어을 통해 git 저장소를 초기화 해줍니다.

git init

 

 

초기화를 했으면, 또 터미널에서 git remote 명령어를 통해 원격 저장소와 연결시켜줍니다.

git remote add origin https://github.com/(깃허브계정명)/(레파지토리명).git

 

Quic Setup에 url 있으니 복사하시면 됩니다.

 

remote 명령이 잘 들어갔습니다.

이제 그대로 앱을 원격 저장소에 push 해주면 됩니다.

 

해당 명령어들을 차례대로 터미널에 적어줍니다.

git add .

 

모든 변경사항을 커밋되기 전에 머물러있는 스테이지(Staging Area)에 이동시켜 줍니다.

git commit -m "쓰고 싶은 커밋 메시지"

 

쓰고싶은 메시지와 함께 해당 명령어로 add 해놓은 변경사항을 커밋해줍니다.

git push origin main

 

main 브랜치에 push 해줍니다.

 

 

 

GitHub 연동 성공

 

짠.

 

내가 만든 프로젝트가 잘 올라왔습니다.

이후로는 계속해서 변경사항들을 원격저장소에 올려주면 됩니다.