[DAY3] 과제 - 간단한 웹앱 만들기(Fork, Pull requests)

목차

🚀 진행기간: 2023년 6월 26일 ~ 2023년 7월 13일

⭐요약

---

이번 과제에서는 목업이 아닌 실제로 작동하는 계산기를 만들고, Github를 사용해 PR를 하는 과정까지 진행함.

 

1) 버튼이 잘 눌렸는지 확인

• 계산기의 숫자버튼을 클릭했을 때의 변화를 개발자 도구의 Console 탭을 이용하여 확인함.

2) 기본 계산 기능 구현

• 두 숫자의 사칙연산을 할 수 있는 계산기를 구현함.

3) 학습 목표

• 계산기 Github repository에 작성된 HTML, CSS를 이해할 수 있음.
• 두 숫자의 사칙연산을 구현할 수 있음.

⭐과제

---

계산기

원본 저장소를 fork 하고, 위 내용 진행하여 코드 수정 후 pull requests를 하는 과제임.

⭐과정

---

1. 원본 저장소 Fork

원본 저장소(레포지토리) 오른쪽 상단을 확인하면 fork 버튼이 있음. 클릭해서 자신의 저장소로 fork 함.

2. clone, remote 설정

fork로 생성한 자신의 저장소의 url을 복사함. 상단의 주소를 복사하지 말고 Code 버튼을 클릭하여 HTTPS 주소를 복사하도록 함.

그리고 터미널에 다음과 같이 입력함.

# 자신의 원격 저장소 복제
$ git clone [자신의 저장소 url]

# git 저장소 생성
$ git init

만약 git clone를 진행하지 않고 Download ZIP으로 파일을 다운받은 경우 pr을 할 때 커밋 메시지 오류가 발생할 수 있음. (알고 싶지 않았음🥹) git init를 하지 않으면 또 오류가 발생할 수 있음.

# 원본 프로젝트 저장소를 원격 저장소로 추가
$ git remote add [별명] [원본 저장소 url]

# 원격 저장소 설정 현황 확인
$ git remote -v

원본 프로젝트의 저장소를 원격 저장소로 추가하고 나서, git remote -v 명령어를 실행하면 다음과 같이 나타나야 함. origin은 git clone를 했을 때 자동으로 등록되어 있는 것임.

3. branch 생성

원래 코드와 독립적으로 개발하기 위해서 브랜치를 생성함.

# [branch 이름] 이라는 이름의 branch를 생성
$ git checkout -b [branch 이름]

# branch 리스트 확인
$ git branch

4. 코드 작업 후 Add, Commit, Push

$ git add .

$ git commit -m "commit message"

$ push push origin [branch 이름]

미리 develop 브랜치에 한 적이 있어서 새로 test 브랜치를 생성해 위 명령어를 실행했음.

5. Pull Request 생성

자신의 저장소 github를 확인하면 Compare & pull request 버튼이 활성화된 것을 확인할 수 있음. 이 버튼을 클릭함.

 

작성하고 싶은 메시지를 입력하고 Create pull request 버튼을 클릭하면 pull request가 완료되어 과제가 제출됨.

 

pr이 제출되었는지는 원본 저장소 왼쪽 상단의 Pull requests에서 확인할 수 있음.

⭐후기

---

• 이번 과제를 수행하면서 git 사용이 미숙해 어렵게 느껴졌던 pull requests에 대해서 정리함.
• 코딩 부분은 빠르게 끝냈는데, pr 과정에서 commit 메시지가 일치하지 않는다고 해서 이 부분에서 시간이 많이 걸림.
• git clone에 대한 이해가 부족했었음.

⭐참고자료

---

1) Inpa Dev, "깃헙 Pull Request 보내는 방법 - 알기 쉽게 정리", 2021.11.22, https://inpa.tistory.com/entry/GIT-%E2%9A%A1%EF%B8%8F-%EA%B9%83%ED%97%99-PRPull-Request-%EB%B3%B4%EB%82%B4%EB%8A%94-%EB%B0%A9%EB%B2%95-folk-issue

2) 초보몽키의 개발공부로그, "git 초보를 위한 풀리퀘스트(pull request) 방법", 2017.07.08, https://wayhome25.github.io/git/2017/07/08/git-first-pull-request-story/

 

이 글은 코드스테이츠 x KNU가 주최한 직무역량캠프에서 공부한 내용을 작성한 것입니다.