Azure Devops로 Vue.js 프로젝트 CI/CD구현

https://dev.azure.com/

1. Azure DevOps 조직에 로그인하고, 프로젝트로 이동합니다.

2. Pipelines로 이동한 다음, 새 파이프라인을 선택합니다.

 

3. 저의 경우 소스코드의 위치로 Azure Repos Git을 선택하겠습니다.

 

4. 리포지토리 목록이 표시되면 리포지토리를 선택합니다.

5. vue를 사용했으므로 'Node.js with Vue'선택

6. yaml을 작성하면 되는데 script에 azure login, docker build, docker push를 추가한다.

1. Azure login
   1. az acr login --name ${acr명}
2. docker build
   1. docker build --tag ${이미지명}:${버전} .
3. docker push
   1. docker push ${이미지명}:${버전}

참고: https://portal.azure.com/

Microsoft Azure

 

위와 같이 작성하면 DEV브랜치에서 origin으로 push를 할 때마다 ACR에 이미지를 생성한다.

여기까지가 CI이다.

CI란 Continous Integration의 약자로 지속적 통합이다. CI는 변경 내용을 뒤늦게 통합하는 데서 비롯되는 문제들, 즉 병합 충돌과 빌드 오류에 이어지는 무수한 버그, 그리고 소프트웨어가 실제로 사용자의 요구를 충족하지 않는다는 사실을 알게 되는 등을 방지하도록 설계된 DevOps의 관행이다.

CI를 사용하면 모든 사람의 코드 변경 내용을 자동 커밋, 빌드, 테스트할 수 있습니다. 프로젝트 전체에 걸쳐 자주 통합하면 충돌을 취소화하고, 모든 사람의 변경 내용이 상호작용하는 방식을 확인하고, 버그가 깊숙이 자리잡고 다른 기능들이 그에 의존하기 전에 해결할 수 있습니다.

CI는 지속적 통합 및 전달/배포 파이프라인의 전반부를 형성합니다. 이는 각 변경 내용을 커밋, 빌드, 테스트, 스테이징, 릴리즈하는 지속적 프로세스로 각 단계마다 피드백을 제공하여 끊임없이 반복, 개선할 수 있게 해줍니다. CI/CD를 구현하려면 다양한 기능 간의 협업, 새로운 프로세스와 워크플로의 채택, 수반되는