연습 - 환경 설정

  • 15분

팀은 DevOps 전략을 해당 프로세스에 천천히 통합했습니다. 이 섹션에서는 현재 환경이 이제까지의 팀의 노력을 반영하고 있는지 확인합니다.

이렇게 하려면 다음을 수행합니다.

  • Azure DevOps에서 Azure 구독에 연결할 수 있는지 확인하기 위해 사용자를 추가합니다.
  • 이 모듈의 Azure DevOps 프로젝트를 설정합니다.
  • 빌드 파이프라인을 추가합니다.

Azure DevOps에 사용자 추가

이 모듈을 완료하려면 자체 Azure 구독이 필요합니다. Azure 평가판을 시작할 수 있습니다.

Azure DevOps를 사용하기 위해 구독이 필요하지는 않지만 여기에서는 Azure 구독에 있는 Azure 리소스에 배포하기 위해 Azure DevOps를 사용합니다. 프로세스를 간소화하려면 동일한 Microsoft 계정을 사용하여 Azure 구독과 Azure DevOps 조직에 모두 로그인합니다.

서로 다른 Microsoft 계정을 사용하여 Azure 및 Azure DevOps에 로그인할 경우 Azure에 로그인하는 데 사용하는 Microsoft 계정의 DevOps 조직에 사용자를 추가합니다. 자세한 내용은 조직 사용자 추가 및 액세스 관리를 참조하세요. 사용자를 추가하는 경우 기본 액세스 수준을 선택합니다.

그런 다음 Azure DevOps에서 로그아웃하고 Azure 구독에 로그인하는 데 사용하는 Microsoft 계정으로 다시 로그인합니다.

Azure DevOps 프로젝트 가져오기

Azure DevOps 조직에서 이 모듈의 나머지 부분을 완료하도록 설정합니다. 이를 위해 템플릿을 실행하는데, 이 템플릿은 Azure DevOps에서 프로젝트를 생성합니다.

이 학습 경로의 모듈은 DevOps 여정에서 Tailspin 웹 팀을 추적하는 전체 진행 과정을 구성하고 있습니다. 학습 목적을 위해 각 모듈에는 연결된 Azure DevOps 프로젝트가 있습니다.

템플릿 실행

Azure DevOps 조직에 대한 모든 항목을 설정하는 템플릿을 실행합니다.

템플릿 실행

Azure DevOps Demo Generator 사이트에서 다음 단계를 수행하여 템플릿을 실행합니다.

  1. 로그인을 선택하고 사용 약관에 동의합니다.

  2. 새 프로젝트 만들기 페이지에서 Azure DevOps 조직을 선택하고, ‘Space Game - 웹 - 릴리스’와 같은 프로젝트 이름을 입력합니다.

    Screenshot of the Azure DevOps Demo Generator web site showing the process to create the project.

  3. Yes, I want to fork this repository>Authorize를 선택합니다. 창이 표시되면 GitHub 계정에 대한 액세스 권한을 부여합니다.

    중요

    이 옵션을 선택해야 템플릿에서 GitHub 리포지토리에 연결합니다. Space Game 웹 사이트 프로젝트를 이미 포크한 경우에도 이 옵션을 선택합니다. 템플릿에서 기존 포크를 사용합니다.

  4. Create Project를 선택합니다. 템플릿을 실행하는 데 몇 분 정도 걸립니다.

  5. Navigate to project를 선택하여 Azure DevOps의 해당 프로젝트로 이동합니다.

중요

이 모듈의 Azure DevOps 환경 정리 페이지에는 중요한 정리 단계가 포함되어 있습니다. 환경을 정리하면 사용 가능한 빌드 시간을 늘릴 수 있습니다. 정리 단계는 이 모듈을 완료하지 않은 경우에도 수행해야 합니다.

프로젝트의 표시 유형 설정

처음에는 GitHub의 Space Game 리포지토리 포크가 퍼블릭으로 설정되고 Azure DevOps 템플릿에서 만든 프로젝트는 프라이빗으로 설정됩니다. GitHub의 퍼블릭 리포지토리에는 누구나 액세스할 수 있으며, 프라이빗 리포지토리는 사용자와 공유하도록 선택한 사용자만 액세스할 수 있습니다. 마찬가지로 Azure DevOps에서 퍼블릭 프로젝트는 인증되지 않은 사용자에게 읽기 전용 액세스를 제공하는 반면, 프라이빗 프로젝트는 사용자에게 액세스 권한을 부여하고 서비스에 액세스하기 위해 인증을 받아야 합니다.

현재로서는 이 모듈의 목적을 위해 이러한 설정을 수정할 필요가 없습니다. 그러나 개인 프로젝트의 경우 다른 사용자에게 부여하려는 표시 유형 및 액세스를 결정해야 합니다. 예를 들어 프로젝트가 오픈 소스인 경우 GitHub 리포지토리와 Azure DevOps 프로젝트를 모두 퍼블릭 상태로 만들지 선택할 수 있습니다. 프로젝트가 재산적 가치를 가지는 경우 일반적으로 GitHub 리포지토리와 Azure DevOps 프로젝트를 모두 프라이빗 상태로 설정할 수 있습니다.

나중에 프로젝트에 가장 적합한 옵션을 결정하는 데 도움이 되는 다음과 같은 리소스를 찾을 수 있습니다.

Visual Studio Code 준비

웹 사이트를 로컬로 빌드하고 원본 파일을 사용할 수 있도록 Visual Studio Code를 설정합니다.

Visual Studio Code는 통합 터미널과 함께 제공되므로 한 곳에서 파일을 편집하고 명령줄에서 작업을 수행할 수 있습니다.

  1. Visual Studio Code를 시작합니다.

  2. [터미널]을 선택한 다음 [새 터미널]을 선택합니다.

  3. 드롭다운 목록에서 Git bash를 선택합니다. Zsh와 같이 사용하려는 다른 Unix 셸에 익숙한 경우 대신 해당 셸을 선택합니다. Git for Windows는 Git Bash를 제공하므로 Git 명령을 쉽게 실행할 수 있습니다.

    참고 항목

    Windows에서 Git Bash가 옵션으로 표시되지 않으면 Git을 설치했는지 확인한 다음, Visual Studio Code를 다시 시작합니다.

  4. 다음 명령을 실행하여 홈 디렉터리로 이동합니다.

    cd ~

Git 구성

Git 및 GitHub를 처음 사용하는 경우, 먼저 몇 가지 명령을 실행하여 ID를 Git에 연결하고 GitHub에 인증해야 합니다. 자세한 내용은 Set up Git(Git 설정)을 참조하세요.

최소한 다음 단계를 완료해야 합니다.

  1. 최신 버전의 Git을 다운로드하여 설치합니다.
  2. 사용자 이름을 설정합니다.
  3. 커밋 메일 주소를 설정합니다.

참고

이미 GitHub에서 2단계 인증을 사용하고 있는 경우 개인용 액세스 토큰을 만듭니다. 나중에 프롬프트가 표시되면 암호 대신 토큰을 사용합니다.

액세스 토큰을 암호와 마찬가지로 취급하세요. 안전하게 보관하세요.

Visual Studio Code에서 프로젝트 설정

템플릿을 실행하여 Azure DevOps 프로젝트를 설정했을 때 프로세스에서 자동으로 mslearn-tailspin-spacegame-web-deploy 리포지토리를 포크했습니다. 이제 복사본으로 작업할 수 있도록 컴퓨터에 해당 복사본을 다운로드하거나 ‘복제’합니다.

로컬로 포크 복제

  1. GitHub에서 Space Game 웹 프로젝트의 포크(mslearn-tailspin-spacegame-web-deploy)로 이동합니다.

  2. 코드를 선택한 다음, HTTPS 탭에서 [복사] 버튼을 선택해 URL을 클립보드에 복사합니다.

    Screenshot that shows how to locate the URL and copy button from the GitHub repository.

  3. Visual Studio Code에서 앞서 연 터미널 창으로 이동합니다.

  4. git clone 명령을 실행합니다. 여기에 표시된 URL을 클립보드의 내용으로 바꿉니다.

    git clone https://github.com/your-name/mslearn-tailspin-spacegame-web-deploy.git

  5. mslearn-tailspin-spacegame-web-deploy 디렉터리로 이동합니다. 이 디렉터리는 리포지토리의 루트입니다.

    cd mslearn-tailspin-spacegame-web-deploy

업스트림 원격 설정

‘원격’은 GitHub의 리포지토리처럼 팀 구성원이 협업하는 Git 리포지토리입니다. 여기에서 원격을 나열하고 Microsoft의 리포지토리 복사본을 가리키는 원격을 추가하여 최신 샘플 코드를 얻을 수 있습니다.

  1. 다음 명령을 실행하여 원격을 나열합니다.

    git remote -v

    다음과 같이 리포지토리에 대한 페치(다운로드) 및 푸시(업로드) 액세스 권한이 모두 있는 것을 확인할 수 있습니다.

    origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (fetch)
origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (push)

    Origin은 GitHub의 리포지토리를 지정합니다. 다른 리포지토리의 코드를 포크할 때 원본 원격(포크한 원격)을 일반적으로 ‘업스트림’이라고 합니다.

  2. 다음 명령을 실행하여 Microsoft 리포지토리를 가리키는 업스트림이라는 원격을 만듭니다.

    git remote add upstream https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.git

  3. git remote를 다시 실행하여 다음과 같은 변경 내용을 확인합니다.

    git remote -v

    여전히 리포지토리에 대한 페치(다운로드) 및 푸시(업로드) 액세스 권한이 모두 있음을 확인할 수 있습니다. 그리고 이제 Microsoft 리포지토리에서의 페치 액세스 권한도 있습니다.

    origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (fetch)
origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (push)
upstream        https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.git (fetch)
upstream        https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.git (push)

Visual Studio Code에서 프로젝트 열기

  1. 프로젝트의 루트 디렉터리에서 다음 명령을 실행합니다.

    code .

  2. 통합 터미널을 다시 엽니다. 터미널을 실행하면 웹 프로젝트의 루트에서 시작됩니다.

code 명령이 실패하면 시스템 PATH에 Visual Studio Code를 추가해야 합니다. 이를 수행하려면:

  1. Visual Studio Code에서 F1을 선택하거나 보기>명령 팔레트를 선택하여 명령 팔레트에 액세스합니다.
  2. shell command를 입력하여 Shell Command: Install 'code' command in PATH 명령을 찾습니다.
  3. 새로운 PATH가 적용되도록 터미널을 다시 시작합니다.

이제 로컬 개발 환경에서 Space Game 소스 코드 및 Azure Pipelines 구성을 사용하여 작업하도록 설정되었습니다.

GitHub에서 분기 가져오기

  1. Visual Studio Code에서 통합 터미널을 엽니다.

  2. 다음 명령을 실행하여 MicrosoftDocs 리포지토리에서 릴리스 파이프라인 분기를 가져오고 새 분기 업스트림/릴리스 파이프라인을 확인합니다.

    git fetch upstream release-pipeline
git checkout -B release-pipeline upstream/release-pipeline

  3. 선택적 단계로, Visual Studio Code에서 azure-pipelines.yml 파일을 열고 초기 YAML 파이프라인 구성을 숙지합니다.

파이프라인 실행

현재 다음과 같은 요구 사항을 충족해야 합니다.

  • GitHub 계정에 있는 mslearn-tailspin-spacegame-web-deploy 리포지토리의 포크.
  • 로컬로 복제된 mslearn-tailspin-spacegame-web-deploy 리포지토리.
  • 웹 사이트 소스 코드와 초기 Azure Pipelines 구성을 포함하는 릴리스 파이프라인이라는 분기입니다.

그런 다음 파이프라인이 실행되도록 수동으로 트리거합니다. 이 단계를 수행하면 프로젝트를 GitHub 리포지토리에서 빌드하도록 설정할 수 있습니다. 초기 파이프라인 구성은 애플리케이션을 빌드하고 빌드 아티팩트를 생성합니다.

  1. Azure Devops에서 프로젝트로 이동한 다음 파이프라인을 선택합니다.

  2. mslearn-tailspin-spacegame-web-deploy 파이프라인을 선택합니다. 메시지가 표시되면 리소스 권한 부여를 선택하여 서비스 연결에 권한을 부여해야 합니다.

    Screenshot of Azure Pipelines showing the pipeline for this project. The pipeline has no runs.

  3. 파이프라인 실행을 선택한 다음 분기/태그 드롭다운 메뉴에서 릴리스 파이프라인 분기를 선택합니다. 실행을 선택합니다.

    Screenshot of Azure Pipelines showing the location of the Run pipeline button.

  4. 요약 페이지에서 파이프라인 작업을 선택하여 로그를 봅니다.

    Screenshot of Azure Pipelines showing the running job.

  5. 빌드가 완료되면 뒤로 단추를 선택하여 요약 페이지로 돌아갑니다.

    Screenshot of Azure Pipelines showing how to navigate to the summary page.

  6. 게시된 아티팩트를 선택합니다.

    Screenshot of Azure Pipelines showing the location of the link to the published artifact.

  7. Tailspin.Space.Game.Web.zip은 빌드 아티팩트입니다. 이 파일은 빌드된 애플리케이션 및 해당 종속성을 포함합니다.

    Screenshot of Azure Pipelines showing the published artifact. The artifact includes a .zip file.

이제 Space Game 웹 프로젝트에 대한 빌드 파이프라인이 있습니다. 다음으로 배포 단계를 추가하여 빌드 아티팩트를 Azure App Service에 배포합니다.