반응형

클로드 코드에 Github MCP를 설치하는 방법입니다.

아래 공식 문서를 참조하였습니다.

https://github.com/github/github-mcp-server/blob/main/docs/installation-guides/install-claude.md

 

github-mcp-server/docs/installation-guides/install-claude.md at main · github/github-mcp-server

GitHub's official MCP Server. Contribute to github/github-mcp-server development by creating an account on GitHub.

github.com


Github Personal Access Token 생성

Github MCP를 사용하려면 인증이 필요합니다. 이때 사용되는 것이 Github personal access token입니다.

생성 방법은 다음과 같습니다.

  • Github 로그인
  • 우측 상단의 "Profile" 아이콘을 클릭
  • "Settings" 메뉴 클릭
  • 왼쪽 메뉴 중 제일 하단의 "Developer Settings" 클릭
  • 왼쪽 메뉴에서 "Personal Access Tokens" 클릭
  • 하위 펼쳐진 메뉴에서 "Tokens Classic" 클릭
  • 아래와 같은 화면에서 "Generate new token"을 클릭하고 "Generate New Token(Classic)"을 클릭

  • 이름, expiration, scope을 설정 후 하단의 "Generate Token" 버튼을 클릭
    • 이름은 사용하고 싶은 것으로 입력하시면 됩니다. 예) codegear-info
    • expiration은 만료 기간입니다.
    • scope은 범위 입니다. 보통은 repo만 체크해주시면 됩니다.

Docker desktop 실행

Github MCP를 사용하기 위해서는 Docker Desktop이 실행되고 있어야 합니다.


클로드 코드에 Github MCP 추가하기

  • 터미널에서 다음 명령을 실행합니다.
claude mcp add github -- docker run -i --rm -e GITHUB_PERSONAL_ACCESS_TOKEN ghcr.io/github/github-mcp-server
  • 이렇게 하면 github mcp가 추가됩니다.

Github MCP에 인증 추가하기

  • 로그인 계정의 루트에 .claude.json 파일을 에디터에서 Open합니다.
  • github으로 검색해보시면 아래와 같이 추가된것을 확인할 수 있습니다.
"mcpServers": {
	"github": {
      "type": "stdio",
      "command": "docker",
      "args": [
        "run",
        "-i",
        "--rm",
        "-e",
        "GITHUB_PERSONAL_ACCESS_TOKEN",
        "ghcr.io/github/github-mcp-server"
      ],
      "env": {}
    }
}
  • env 아래에 GITHUB_PERSONAL_ACCESS_TOKEN 을 추가합니다. 
"env": {
    "GITHUB_PERSONAL_ACCESS_TOKEN": "$GITHUB_CODEGEAR"
  }
  • 예시로 사용한 $GITHUB_CODEGEAR 부분에 github에서 생성한 토큰을 입력하시면 됩니다.
  • 저는 맥북에서 환경변수로 $GITHUB_CODEGEAR 를 사용하였으므로 이렇게 썼습니다.
  • 맥북 환경변수 등록은 .zshrc 파일에 아래 내용을 추가하시면 됩니다.
export GITHUB_CODEGEAR_TOKEN="github에서 생성한 토큰"

 


Github MCP 연결 확인

  • 이제 클로드코드를 재실행 합니다.
  • "/mcp" 를 입력합니다.
  • 아래와 같이 "connected"라고 나오면 정상적으로 설치가 완료된 것입니다.

반응형
반응형

여러 사이트에 ssh 접속을 할때 접속 정보를 모두 기억하기가 어렵습니다.

예를 들어 AWS에 EC2가 여러개 있다면 아래와 같은 정보들을 모두 입력해야 하는 불편함이 있습니다.

ssh -i /path/key-pair-name.pem instance-user-name@instance-public-dns-name

이럴때를 위해 맥북에서는 ssh를 미리 저장해 놓고 alias 만으로 접속하는 기능이 있습니다.

 

맥북의 .ssh/config 파일을 사용하면 여러 서버에 대한 SSH 접속 설정을 간결하게 관리하고, 짧은 별칭(alias)으로 쉽게 접속할 수 있습니다. 이는 특히 여러 원격 서버나 여러 GitHub 계정을 관리할 때 매우 유용합니다.

 

.ssh/config 파일 생성 또는 열기

 

맥(macOS)의 경우 .ssh/config 파일이 자동으로 생성되어 있지 않을 수 있습니다. 이 경우 직접 파일을 생성해야 합니다.

touch ~/.ssh/config
open ~/.ssh/config

 

.ssh/config 파일 내용 작성

 

파일을 열고 아래와 같은 형식으로 각 서버의 접속 정보를 입력합니다.

Host [별칭]
    HostName [원격 서버의 IP 주소 또는 도메인 이름]
    User [접속할 사용자 계정]
    IdentityFile [SSH 키 파일 경로]
    Port [SSH 포트 번호 (기본값 22, 변경된 경우)]
  • Host: 이 별칭은 SSH 접속 시 사용할 짧은 이름(alias)이 됩니다.
  • HostName: 접속할 원격 서버의 IP 주소 또는 도메인 이름을 입력합니다.
  • User: 원격 서버에 접속할 사용자 계정 이름을 입력합니다.
  • IdentityFile: 해당 서버에 접속할 때 사용할 SSH 키 파일의 경로를 지정합니다. 예를 들어, ~/.ssh/your_key.pem과 같이 입력할 수 있습니다 . AWS EC2와 같은 경우 pem 키 파일을 다운로드하여 권한을 변경한 후 사용합니다.
  • 권한은 다음 명령을 사용하여 변경합니다.
chmod 600 your_key_file.pem
  • 권한을 변경하지 않으면 다음과 같은 메시지가 나옵니다.
Permissions 0644 for '/Users/admin/.ssh/id_rsa' are too open.
It is required that your private key files are NOT accessible by others.
This private key will be ignored.
Load key "/Users/admin/.ssh/id_rsa.pub": bad permissions
git@github.com: Permission denied (publickey).
  • Port: SSH 접속에 사용되는 포트 번호입니다. 기본값은 22이며, 변경된 경우에만 작성합니다.
  • Github의 경우 HostName과 User명은 아래와 같이 동일한 값을 사용합니다.
HostName github.com
User git

예시:

# 개인 GitHub 계정
Host github.com-personal
    HostName github.com
    User git
    IdentityFile ~/.ssh/id_rsa_personal

# 회사 GitHub 계정
Host github.com-work
    HostName github.com
    User git
    IdentityFile ~/.ssh/id_rsa_work

# 개발 서버
Host dev_server
    HostName 192.168.0.1
    User ubuntu
    IdentityFile ~/.ssh/dev_server_key.pem
    Port 2222

# Amazon Linux 2003 EC2     
Host aws-ec2
    HostName ec2-1-100-200-333.ap-northeast-2.compute.amazonaws.com
    User ec2-user
    IdentityFile ~/myec2.pem
 

 

연결 테스트 하기

다음과 같이 테스트를 할 수 있습니다.
ssh -T git@github.com-personal
ssh -T ec2-user@aws-ec2

 

Git 연결 설정을 config에 설정된 alias로 변경하기

 

기존 git 연결을 config에 설정한 alias명으로 변경할 수 있습니다.

git remote set-url origin git@github.com-personal:username/repo.git

 

SSH 접속하기

 

.ssh/config 파일에 설정한 별칭을 사용하여 터미널에서 간결하게 접속할 수 있습니다.

ssh [별칭]
ssh github.com-personal
ssh dev_server

 

이렇게 설정하면 복잡한 IP 주소, 사용자 이름, 키 파일 경로를 매번 입력할 필요 없이 간편하게 SSH 접속을 할 수 있습니다.

반응형
반응형

지난 글에 이어 Github Desktop 사용법에 대해 조금 더 알아보겠습니다.

 

다음은 이글의 동영상 강좌입니다.

https://youtu.be/n77Jtz1iP_M

 

순서

  • Private 프로젝트 만들기
  • Github desktop에서 github.com 계정으로 로그인
  • Branch 개념 이해하기
  • Branch 생성
  • Branch Merge

 

Private 프로젝트 만들기

외부에 공개되지 않는 자신만의 프로젝트를 만들기 위해서는 private으로 프로젝트를 만듭니다.

  • www.Github.com 에서 Repository 메뉴로 이동합니다.
  • 우측 상단의 [New] 버튼을 클릭합니다.

  • [프로젝트명]을 입력합니다.(예: test)
  • [public / private] 항목에서 private를 선택합니다.

  • [Add a README file] 이라고 된 부분을 체크하고, [Create repository] 버튼을 클릭하여 프로젝트를 생성합니다.

  • readme 파일이 하나 추가된 [test repository]가 아래와 같이 생성됩니다.

Github Desktop에서 github.com 로그인 하기

private로 만들어진 프로젝트는 로그인을 해야만 사용이 가능합니다. github desktop에서는 github 로그인 기능을 제공하므로, 이것을 알아보겠습니다.

  • github desktop을 실행합니다.
  • 상단의 [Github Desktop] 메뉴에서 [Preferences]를 클릭합니다.

 

  • [Accounts] 메뉴에 들어가면 Github.com 항목의 [Sign In]을 클릭합니다.

  • Sign in Using Your Browser
    - 현재 github.com에 로그인한 브라우저를 통해서 로그인을 할 수 있습니다.

 

레파지토리 추가하기

  • Repository명 옆의 버튼을 클릭합니다.

  • clone repository를 선택합니다.
  • github.com tab을 클릭한 후 test repository를 선택하고 clone 버튼을 클릭하면 소스가 다운로드 됩니다.

 

Branch 만들기

  • 화면에서 main branch 옆의 화살표를 클릭합니다.

  • New Branch를 선택합니다.

  • 브랜치명을 "develop" 이라고 입력하고 "Create Branch"를 클릭합니다.

  • "Publish branch"를 클릭하여 github.com에 share 합니다.

  • github.com에서 새로고침해보면 branch가 2개가 된것을 확인할 수 있습니다.

 

Branch 개념 이해하기

  • 한개의 Branch만 사용할 경우 (Main Branch)
    • Main Branch에 push될때 운영 배포가 이루어지게 설정을 해 놓았다면,
    • 소스를 push 할때마다 운영서비스에 반영이 됩니다.
    • 소스에 대한 검증이 제대로 안될 경우 장애가 발생할 수 있습니다.

  • 두개의 Branch를 사용할 경우 (Develop Branch)
    • Sub Branch를 활용해서 개발기에 배포를 하고 소스를 검증한 후
    • Main Branch에 Merge 하여 안전하게 운영 서버에 배포를 할 수 있습니다.

Merge 하기

develop branch의 소스를 변경한 후 main에 merge 하는 방법입니다.

  • develop branch를 선택합니다.
  • 소스를 수정합니다. 

  • develop branch에 commit과 push를 합니다.

  • main branch로 변경합니다.

  • 상단 메뉴에서 "Branch"-"Merge Into Current Branch"를 선택합니다.

  • Merge할 브랜치를 선택하는 화면에서 "develop" branch를 선택하고 "Create a merge commit" 버튼을 클릭합니다.

  • "Push origin" 버튼을 클릭하면 Merge가 완료됩니다.

 

 

반응형
반응형

다음은 이 글의 동영상 강좌입니다.

https://youtu.be/9KbnFR_1_Jg

 

 

 

nest project 생성(Backend)

nestjs.com에 가시면 프로젝트 생성하는 법을 확인할 수 있습니다.

https://docs.nestjs.com/first-steps

- project명은 slider-api로 생성합니다.

nest new slider-api

 

nuxt project 생성(Frontend)

nuxt.org에 가시면 프로젝트 생성하는 법을 확인할 수 있습니다.

https://nuxtjs.org/docs/get-started/installation

 

Installation

Here, you will find information on setting up and running a Nuxt project in 4 steps.

nuxtjs.org

- project명은 slider-front로 생성합니다.

- yarn create nuxt-app <project-name> 을 사용합니다.

 

yarn create nuxt-app slider-front

 

Repository 생성

github.com에 접속해서 Repository를 생성합니다.

  • github.com -> Repositories -> New를 선택합니다.
  • Backend Repository는 slider-api로 생성합니다.
  • Frontend Repository는 slider-front로 생성합니다.

.gitignore 파일 생성

  • 두개 프로젝트의 root 폴더에 .gitignore 파일을 생성합니다.
  • 이 파일은 git 서버에 올라가지 않아도 되는 파일들을 작성해줍니다.
/node_modules
/dist

.DS_Store
.idea

yarn.lock

 

Repository 연결

  • github desktop을 이용해서 소스를 clone합니다.
  • clone한 소스에 생성한 프로젝트 소스를 이동합니다.
  • 소스를 commit하고 push 합니다.

 

반응형
반응형

다음은 이 글의 유튜브 영상입니다.

https://youtu.be/E3i9qt0SS-I

 

프로젝트를 진행할때 많은 시간을 들여야 하는 것 중에 하나가 바로 배포입니다.

형상관리(Git)에 커밋을 하고, 서버에 파일을 업로드 하고, 서버를 리스타트 하는 과정들을 수작업으로 반복하다 보면 여간 불편한게 아니죠.

이럴때 자동 배포 기능을 만들면 개발 PC에서 커밋하는 것만으로도 배포를 할 수 있습니다. 그럼 나머지 시간들은 다시 개발을 하거나 조금 쉴 수 있는 여유가 생기겠죠?

 

우선 전체적인 구성은 다음과 같습니다.

  1. 로컬 PC에서 개발을 한 후 Github에 Push를 합니다.
  2. Github Repository 특정 branch에 push가 되면 Github Action이 동작을 시작합니다.
  3. Github Actions가 Github Container Registry에 소스를 받은 후 Docker 이미지로 빌드를 합니다.
  4. 빌드된 이미지를 EC2에 등록된 Runner가 복사합니다.
  5. 기존 이미지를 삭제하고 새로운 이미지로 실행을 합니다.

환경

  • 프론트 : Vuejs (Nuxt)
  • 형상관리 : Git (Github)
  • 빌드 : Docker (Github Action)
  • 서버 : Linux (AWS EC2 micro)

* nodejs, git, docker는 기본적으로 설치되어 있어야 합니다.

순서

  • Github 저장소 생성
  • 프로젝트 원격 저장소 클론
  • Nuxt 프로젝트 생성
  • Docker로 로컬 테스트
  • Github Actions
  • AWS EC2 생성 및 Docker 설치
  • 자동 배포 테스트

Github 저장소 생성 및 연결

www.github.com 에서 아래와 같이 저장소를 만듭니다.

  • Repository name은 프로젝트명과 동일하게 생성합니다.
  • Repository는 아무나 사용할 수 없도록 private으로 만듭니다.
  • 주의하실 점은 Owner명에 대문자가 들어가 있으면 안됩니다.
  • Github Action에서 도커빌드시에 대문자를 쓸 수 없다는 오류가 납니다.

프로젝트 원격 저장소 클론

원격 저장소를 local PC로 클론합니다.

  • 저는 github desktop을 이용했습니다.
  • git 명령어 또는 다른 프로그램을 사용하셔도 됩니다.

  • 우측 상단의 아래 화살표를 클릭합니다.

  • 우측 상단의 Add 버튼을 누르고 clone repository를 선택합니다.

 

 

  • Repository를 선택하고 Clone 버튼을 클릭하면 로컬PC에 폴더가 생성됩니다.

 

Vue (Nuxt) 프로젝트 생성

Clone 받은 폴더로 이동한 후 다음과 같이 Nuxt 프로젝트를 생성합니다. 

  • 선택항목은 모두 자동으로 선택합니다.
npx create-nuxt-app nuxt-auto-deploy

프로젝트 생성이 완료되면 생성된 모든 파일을 상위 폴더로 옮겨줍니다.

cd nuxt-auto-deploy
mv * ..

다시 상위 폴더로 이동하여 비어있는 nuxt-auto-deploy 폴더를 삭제합니다.

cd ..
rm -Rf nuxt-auto-deploy

 

다음과 같이 프로젝트를 실행합니다.

npm run dev 또는 yarn dev

실행이 완료되면 브라우저에서 http://localhost:3000으로 실행 화면을 확인할 수 있습니다.

 

확인이 되었으면 ctrl+C 키를 눌러 프로젝트 실행을 종료합니다.

 

Docker로 로컬 테스트

Docker 이미지를 만들기 위해 프로젝트 루트에 Dockerfile을 아래와 같이 생성합니다.

FROM node:14.19.0

RUN mkdir -p /app
WORKDIR /app
ADD . /app/

RUN rm yarn.lock || true
RUN rm package-lock.json || true
RUN yarn
RUN yarn build

ENV HOST 0.0.0.0
EXPOSE 3000

CMD [ "yarn", "start"]
  • FROM node:14.19.0 : nodejs 14.19.0 버전의 이미지를 받아서 docker image를 생성합니다.
  • RUN mkdir -p /app : app 폴더를 생성합니다.
  • ADD . /app/ : 현재 폴더의 모든것을 생성된 app 폴더에 복사합니다.
  • RUN rm ... || true : 파일 삭제. 뒤의 "|| true" 는 파일이 없을 경우 오류로 인해 실행이 중단되지 않게 하기 위해 추가합니다.
  • RUN yarn build : nuxt 프로젝트를 빌드합니다.
  • ENV HOST 0.0.0.0 : 모든 IP를 개방합니다.
  • EXPOSE 3000 : 3000번 포트를 개방합니다.
  • CMD ["yarn", "start"] : yarn start 명령을 실행합니다.

Docker 이미지 생성시 불필요한 파일을 제외하도록 루트 폴더에 .dockerignore 파일을 생성합니다.

node_modules/
dist/

Dockerfile을 저장하고 다음 명령으로 이미지를 생성 합니다.

docker build --tag nuxt-auto-deploy:0.0.1 .

Docker 이미지를 실행합니다.

docker run --name nuxt-auto-deploy -d -p 3000:3000 nuxt-auto-deploy:0.0.1
  • --name 뒤의 이름(nuxt-auto-deploy)은 도커 컨테이너명이고,
  • 뒤의 nuxt-auto-deploy:0.0.1은 docker image명과 tag명입니다.

localhost:3000으로 접속하면 아까와 동일한 화면을 확인할 수 있습니다.

Docker 테스트가 모두 완료되었으므로 코드를 github에 push 합니다.

 

Github Actions 

Github Access Token 발급
github에 접속한 후 계정에서 settings 메뉴로 이동합니다.

왼쪽 메뉴 하단의 Developer settings를 선택합니다.

왼쪽 메뉴에서 Personal access tokens를 선택하고, Generate new token을 선택합니다.

토큰의 유효기간과 권한을 설정합니다.

  • 유효기간은 최대 1년까지 가능합니다.
  • 권한은 workflow, write:packages, delete:packages를 선택합니다.

하단의 generate 버튼을 클릭하면 토큰이 생성됩니다.

생성된 토큰을 복사하여 Repository-Settings-Secret-Actions에 등록합니다.

 

 

레파지토리의 Actions 탭으로 이동하여 "set up a workfolow yourself"를 클릭합니다.

아래와 같이 workflow 파일을 작성합니다.

이것은 Github Container Registry를 이용해서 docker를 빌드하고 서버에 푸쉬해주는 역할을 합니다.

 

Github Actions으로 AWS EC2에 CI/CD 구축하기

AWS EC2에 CI/CD 구축하기

velog.io

다음은 workflow 파일입니다.( .github/workflows/main.yml)

name: CI/CD Docker

# 트리거를 수행할 브랜치를 지정합니다.
on:
  push:
    branches: [ main ]

# 환경설정
env:
  DOCKER_IMAGE: ghcr.io/${{ github.actor }}/nuxt-auto-deploy
  VERSION: ${{ github.sha }}
  NAME: go_cicd

jobs:
  # 빌드 Job
  build:
    name: Build
    runs-on: ubuntu-latest
    steps:
      # github repository에서 checkout
      - uses: actions/checkout@v2
      # docker build 수행
      - name: Set up docker buildx
        id: buildx
        uses: docker/setup-buildx-action@v1
      - name: Cache docker layers
        uses: actions/cache@v2
        with:
          path: /tmp/.buildx-cache
          key: ${{ runner.os }}-buildx-${{ env.VERSION }}
          restore-keys: |
            ${{ runner.os }}-buildx-
      # GitHub 컨테이너 레지스트리에 로그인 후 빌드 & 푸시
      - name: Login to ghcr
        uses: docker/login-action@v1
        with:
          registry: ghcr.io
          username: ${{ github.repository_owner }}
          password: ${{ secrets.GITHUB_TOKEN }}
      - name: Build and push
        id: docker_build
        uses: docker/build-push-action@v2
        with:
          builder: ${{ steps.buildx.outputs.name }}
          push: true
          tags: ${{ env.DOCKER_IMAGE }}:latest
  # 배포 Job
  deploy:
    needs: build  # build 후에 실행되도록 정의
    name: Deploy
    runs-on: [ self-hosted, label-go ] # AWS ./configure에서 사용할 label명
    steps:
      - name: Login to ghcr
        uses: docker/login-action@v1
        with:
          registry: ghcr.io
          username: ${{ github.repository_owner }}
          password: ${{ secrets.GITHUB_TOKEN }}
      # 3000 -> 80 포트로 수행하도록 지정
      - name: Docker run
        run: |
          docker stop ${{ env.NAME }} && docker rm ${{ env.NAME }} && docker rmi ${{ env.DOCKER_IMAGE }}:latest
          docker run -d -p 80:3000 --name go_cicd --restart always ${{ env.DOCKER_IMAGE }}:latest

commit 버튼을 클릭하면 다음과 같이 파일이 생성됩니다.

.github/workflows/main.yml

 

AWS EC2 생성 및 Docker 설치

이제 자동 배포가 적용될 서버를 만듭니다.

AWS console에 로그인 한 후 EC2 서비스로 이동합니다.

인스턴스 시작 버튼을 클릭합니다.

무료로 사용할 수 있는 Amazon Linux 2 AMI를 선택합니다.

t2.micro를 선택하고 검토및시작 버튼을 클릭합니다.

보안그룹 편집을 선택합니다.

규칙추가 버튼을 누르고 80번 port를 추가한 후 검토및시작 버튼을 클릭합니다.

인스턴스 실행이 완료되면 해당 인스턴스를 체크하고 연결을 클릭합니다.

SSH 클라이언트를 클릭하면 접속 방법이 나옵니다.

터미널을 이용해 ssh로 접속을 합니다.

 

AWS에 Docker 설치

아래 내용을 참조해서 Docker를 설치합니다.

https://docs.aws.amazon.com/ko_kr/AmazonECS/latest/developerguide/create-container-image.html#create-container-image-install-docker

 

Amazon ECS용 Docker 기본 사항 - Amazon Elastic Container Service

Amazon ECS용 Docker 기본 사항 Docker는 사용자가 Linux 컨테이너를 기반으로 하는 분산 애플리케이션을 구축, 실행, 테스트 및 배포할 수 있는 도구를 제공합니다. Amazon ECS는 태스크 정의에 Docker 이미

docs.aws.amazon.com

AWS에 Github Runner 설치

github repository의 settings 탭에서 Runner를 선택합니다.

Runners / Create self-hosted runner를 선택하고, Linux를 선택합니다.

Architecture는 x64로 하고 Download 항목을 한라인씩 복사해서 EC2에서 실행합니다.

./config.sh 문을 실행하면 다음과 같이 입력을 요청합니다.

  • Enter the name of the runner group to add this runner to : 엔터
  • Enter the name of runner : 엔터
  • Enter any additional label : label-go (워크플로우 yml에 작성했던 라벨명
  • Enter name of work folder : 엔터

./run.sh는 다음과 같이 백그라운드로 실행을 합니다.

nohup ./run.sh &
  • tail -f nohup.out 명령을 실행하면 ec2상의 빌드 로그를 확인할 수 있습니다.

Runner 셋팅이 끝나면 github의 Settings - Actions - Runner 메뉴에서 다음과 같이 등록된것을 확인할 수 있습니다.

 

자동 배포 테스트

이제 소스를 수정하고 push를 하면 다음과 같이 빌드가 실행이 됩니다. 

해당 빌드를 클릭하면 세부 정보를 확인할 수 있습니다.

build와 Deploy가 나타나고, 실행되는 것을 확인 할 수 있습니다.

Build 또는 Deploy를 누르면 세부 실행 내역을 볼 수 있습니다.

Deploy가 완료되면 다음과 같은 화면을 볼 수 있습니다.

EC2 인스턴스의 공인 IP를 확인합니다.

브라우저에 아이피를 입력하면 다음과 같은 결과를 확인할 수 있습니다.

 

이제 Push를 하면 서버에 자동 배포가 되는 것을 확인할 수 있습니다.

 

branch를 하나 더 만들어서 (예 : develop) 개발시에 사용하고,
main으로 merge 할 때 자동으로 배포되도록 하는 것도 가능합니다.

반응형
반응형

다음은 이 글의 동영상 강의입니다.

https://youtu.be/0YsMEPxi_wc

Github Desktop 5분컷 사용법

 

 

GIT 개념

여러곳에서 다른 컴퓨터로 개발을 하다보면 서로 소스가 맞지 않은 상황이 발생합니다.

소스 불일치

이때 GIT을 사용하면 소스를 여러곳에서 동기화 시킬수가 있습니다.

 

git 개념

여러사람이 동일한 프로젝트를 개발할 때도 Git을 통해 이런 문제를 해결할 수 있습니다.

 

github 초보자도 쉽게 사용할 수 있는 github desktop의 사용법을 알아보겠습니다.

 

Github 가입

우선 Git을 사용하시려면 아래 github 사이트에 가입을 해야합니다.

https://github.com/

 

GitHub: Where the world builds software

GitHub is where over 73 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs and feat...

github.com

회원 로그인 후 Repository를 만들기 위해 Your repositories로 이동합니다.

Your repositories

New 버튼을 클릭하고 새로운 Repository를 만듭니다.

New Repository

Repository 이름 "test"로 입력하고 하단의 "Create Repository" 버튼을 클릭합니다.

Create a new repository

아래와 같이 test repository가 만들어졌습니다.

test repository

 

Github Desktop 설치

 

아래 사이트에서 github desktop을 download 합니다.

https://desktop.github.com/

 

GitHub Desktop

Simple collaboration from your desktop

desktop.github.com

다운로드 버튼을 클릭합니다.

download

설치가 완료되면 아래와 같이 github desktop이 실행됩니다.

github desktop

소스 clone

github.com의 repository에서 code 버튼을 클릭

repository code

clone에서 url을 copy합니다.

clone

github desktop에서 add 버튼을 클릭하고 clone repository를 선택합니다.

clone repository

URL 탭을 클릭하고, github.com에서 복사한 주소를 붙여넣기 한 후, clone 버튼을 클릭합니다.

이때 local path 변경도 가능합니다.

clone a repository

test repository가 로컬에 clone 되었습니다.

 

소스를 수정하고 commit 하고 push하기

Open in Visual Studio Code를 선택하면 VSCode가 실행됩니다.

clone된 test repository

README.md 파일을 수정하고 저장합니다.

README.md

github desktop에 가시면 변경된 파일이 아래와 같이 표시됩니다.

중간에 변경내용 요약해서 작성해 주시고 ("update README.md"),

아래 commit 버튼을 클릭합니다.

commit

push origin을 클릭하시면 서버에 소스가 upload 됩니다.

push origin

github.com에 가시면 변경된 내용을 확인 할 수 있습니다.

github.com 변경내역확인

변경 소스 받기

이번에는 다른쪽에서 소스가 수정되었을 경우 테스트를 진행합니다.

github.com에서 파일을 하나 추가하기 위해 Add file 버튼을 클릭합니다.

Add file

파일 내용을 입력 후 Commit 버튼을 클릭합니다.

edit text

test.txt 파일이 생성된 것을 확인할 수 있습니다.

test.txt

github desktop에서 fetch origin을 선택합니다.

fetch origin

1개의 파일이 commit 되었음을 표시해줍니다. Pull origin 버튼을 클릭해서 소스를 pull(땡겨옴) 합니다.

Pull

VSCode를 열면 새로 추가된 test.txt 파일을 확인할 수 있습니다.

test.txt

이상으로 github desktop의 기본적인 사용법을 알아보았습니다.

반응형

+ Recent posts