🧔🏿 😻 😴 私自身のDevOps：Webアプリケーション用のクラウドのみのCIの構築 🆙 🔣 👎🏿

こんにちは、Habr！今日は、プロジェクトの1つを例として使用して、DevOpsと自己組織化について少し説明します。

業界の開発者の半数が同意しないフレーズから始めましょう：「すべての開発者は彼自身のDevOpsでなければなりません」。開発者がコードの品質について心配するだけで済むように、別の専任の担当者がこれを行う必要があると誰かが考えています。一部の人々は、コード自体について考えるのと同じくらい、コード配信パイプラインについて考える傾向があります。市場の現代の現実と豊富なツール/知識の中で、開発者は、必要な環境にアーティファクトを迅速かつ予測可能に配信するためのパイプラインを設定および維持できる必要があると思います。インフラストラクチャとアプリケーション配信の問題がベンダー（GoogleとApple）によって大部分解決されているモバイル開発者とは異なり、バックエンドとWeb開発者は、所有していない場合でも、少なくともコード配信の実践に関心を持つ必要があります。

また、スタッフユニット全体が通常犠牲になる、大規模で面倒なビルドシステムのセットアップについては話していません。そうではありません。DevOpsは人ではなく、自己組織化に基づく日常の小さな習慣のシステムです。上や横からではなく、下から上に成長する概念。また、開発者として、アーティファクト（アメリカで人気のあるコンセプト「バリューストリーム」）のフローをわずかな割合で高速化できた場合は、おめでとうございます。これはすでにDevOpsの方法です。この概念を理解するのに最適な本である、Gene KimによるDevOpsハンドブックを読むことをお勧めします（記事の最後にあるリンク）。

この記事では、私たちのチームでDevOpsが誕生した小さな歴史を紹介します。これにより、プロジェクトの開発を加速することができました。この話は、一人の開発者と大規模なチームの両方に当てはまります。

WHO

- . , :

3
2 , QX (QA experience)

web- Angular 9.0, .

Atlassian, " ":

Jira
Bitbucket
CI Bitbucket Pipelines
Confluence.

Bitbucket $4/, 1500 Bitbucket Pipelines. . 90 Gitlab CI, Gitlab .

. , CI Docker- .

DevOps QX (QA experience) . Jira, Bitbucket Bitrise.io -, . : , №30 №170, Jira- №500. -, -

, - .

. , master ( trunk-based development master

).

- web . - , - . , , . CI web , . , , "" . , , (Kubernetes OpenShift, ), . .

: ? : Heroku, AWS, Netlify, Surge . AWS S3. , , S3 - S3 . AWS.

AWS?

. AWS , S3 2 :
- ~ 2
- ~ 12
- - ~ 5
- = 13 Mb
AWS API CLI. "Surge" , Amazon AWS. , CLI Heroku , Heroku Dynos .
AWS.

Amazon, EC2 . Docker Hub Elastic Container Registry, $100 . -, . .

№1: S3

, S3 bucket . (bitbucket-pipelines.yml), (html/css/js/img) S3 bucket. AWS CLI, , , Bitbucket Pipes ( Github actions), Pipe S3 bucket. : , - web.s3-website.ap-northeast-2.amazonaws.com.

AWS "Enable static hosting" . bucket .

- step:
      name: Build and deploy webadmin PR version into AWS for QA
      caches:
        - node
      script:
        #  
        - apk update && apk add git
        - npm install
        # 
        - npm run build:admin
        - cd dist/admin
        #   S3
        - pipe: atlassian/aws-s3-deploy:0.2.4
          variables:
            AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID
            AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY
            AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION
            S3_BUCKET: $S3_WEBADMIN_BUCKET_NAME
            DELETE_FLAG: 'true'
            LOCAL_PATH: $(pwd)
            ACL: 'public-read'

: - . .

-
QX -

№2: S3 bucket

S3 bucket . , - S3 jsn-web-manar

jsn-web-michael

. bitbucket-pipelines.yml

step - S3 PR .

: , - , , . :

- . 3 -, . , . , , Chrome , - S3 .
. - , , -, -. "" S3 . version-under-test .
. git author name . , . , Bitbucket Pipelines Jira account, commit git author. , "Manar Kurmanov" "Dark Lord" 2 - .

️ .

-
QX -

№3: web

- footer :

, timestamp. - - , Jira- .

bitbucket-pipelines.yml

- step:
    name: Build PR version
    caches:
      - node
    script:
      # initial configuration
      - apk update && apk add git
      - npm install
      # preparing site footer text
      - TIMESTAMP_FILE="./src/app/some/folder/copyright.timestamp.html"
      - GIT_AUTHOR=$(git log -n 1 --format=format:'%an')
      - PR_URL="$BITBUCKET_GIT_HTTP_ORIGIN/pull-requests/$BITBUCKET_PR_ID"
      - BRANCH_TEXT="PR branch <a href=\\"$PR_URL\\">$BITBUCKET_BRANCH</a><br>"
      - echo $BRANCH_TEXT >> $TIMESTAMP_FILE
      - echo "Author $GIT_AUTHOR<br>" >> $TIMESTAMP_FILE
      - echo "Built at $(TZ=UTC-6 date '+%d-%m-%Y %H:%M') <br>" >> $TIMESTAMP_FILE
      - echo "</small>" >> $TIMESTAMP_FILE
      - cat $TIMESTAMP_FILE > src/app/target/folder/copyright.component.html
      # building artefacts
      - npm run build
    artifacts:
      paths:
        #     Build Step 
        - dist/web/**

, +100 QX, . . , 3 - S3 . ? , - S3 . Pipelines, Rerun.

, - . .

-
QX -

№4:

AWS API . :

S3 .
, - .

Bitbucket Pipes, AWS S3. Bitbucket Pipelines, CI , cloud-first Docker . aws-cli, AWS CLI (curl, sed, xargs).

bitbucket-pipelines.yml

. NOTE: AWS S3, .

- step:
    name: Deploy PR version into AWS bucket for QA
    image:
      name: amazon/aws-cli
    script:
      # 1.    aws cli   
      - aws configure set aws_access_key_id=$AWS_ACCESS_KEY_ID aws_secret_access_key=$AWS_SECRET_ACCESS_KEY
      # 2.     
      - export BUCKET_NAME=web-pullrequest-$BITBUCKET_PR_ID
      # 3.   AWS     ,     
      - if [ -z $(aws s3 ls | grep $BUCKET_NAME) ]; then aws s3api create-bucket --bucket $BUCKET_NAME --acl public-read --region ap-northeast-2 --create-bucket-configuration LocationConstraint=ap-northeast-2; fi
      # 4.      
      - aws s3api put-bucket-website --website-configuration "{\\"ErrorDocument\\":{\\"Key\\":\\"error.html\\"},\\"IndexDocument\\":{\\"Suffix\\":\\"index.html\\"}}" --bucket $BUCKET_NAME
      # 5.   
      - aws s3 rm s3://$BUCKET_NAME --recursive 
      # 5.     html/css/js
      - aws s3 cp dist/web s3://$BUCKET_NAME --acl public-read --recursive
      # 6.            
      - export PR_API_URL=https://api.bitbucket.org/2.0/repositories/$BITBUCKET_REPO_FULL_NAME/pullrequests/$BITBUCKET_PR_ID/comments
      - export BUCKET_PUBLIC_URL=http://$BUCKET_NAME.s3-website.ap-northeast-2.amazonaws.com
      - curl $PR_API_URL -u $CI_BB_USERNAME:$CI_BB_APP_PASSWORD --request POST --header 'Content-Type:application/json' --data "{\\"content\\":{\\"raw\\":\\"[http://$BUCKET_NAME.s3-website.ap-northeast-2.amazonaws.com](http://$BUCKET_NAME.s3-website.ap-northeast-2.amazonaws.com)\\"}}"

CI App-specific password. Atlassian , .

- .

" - S3 . ?" - . , 25 AWS - .

- step:
    name: Remove dangling s3 buckets left after PR merges
    image:
        name: amazon/aws-cli
    script:
      # 1.   10  MERGED  
      - export API_URL="<https://api.bitbucket.org/2.0/repositories/$BITBUCKET_REPO_FULL_NAME/pullrequests?state=MERGED>"
      - curl "$API_URL" -u $CI_BB_USERNAME:$CI_BB_APP_PASSWORD > pr_list.json
      # 2.  ,  - 
      - aws s3 ls | grep -o '[a-zA-Z\\-]\\+pullrequest\\-[0-9]\\+' > buckets.txt
			- set +e
      #      -,   MERGED
      # (AWS API       )
      - echo "$(cat pr_list.json | grep -o '"id":\\s[0-9]\\+')" | sed 's/[^0-9]//g' | xargs -I{} grep {} buckets.txt | xargs -I{} aws s3 rm s3://{} --recursive
      #      -,   MERGED
      - echo "$(cat pr_list.json | grep -o '"id":\\s[0-9]\\+')" | sed 's/[^0-9]//g' | xargs -I{} grep {} buckets.txt | xargs -I{} aws s3api delete-bucket --bucket {}

QX - . ? , X (QX, DevX, HX) -

, .

#1: CORS

API (.amazonaws.com) (*.somebank.com), - CORS (cross origin resource sharing) . , , . , API api.server.com server.com. GET another.com "pre-flight" , "same-origin-policy".

, S3 API, Headers.

Access-Control-Allow-Origin: <http://bucket.s3-website.amazonaws.com>
# 
Access-Control-Allow-Origin: *

Cross Origin.

#2:

№4 :

aws s3 rm s3://$BUCKET_NAME --recursive

AWS. , 4 .

, - 1 . 3 , - . , AWS API.

! S3 bucket aws-s3-deploy

pipe, , DELETE_FLAG

. bucket . #1 2 . .

#      S3   DELETE_FLAG
- pipe: atlassian/aws-s3-deploy:0.2.4
    variables:
      AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID
      AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY
      AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION
      S3_BUCKET: $S3_WEBADMIN_BUCKET_NAME
      DELETE_FLAG: 'true' #    
      LOCAL_PATH: $(pwd)
      ACL: 'public-read'

, DevOps . , CI/CD, .

最終バージョンbitbucket-pipelines.yml

は、githubリポジトリで表示できます。

読み物

BitbucketのCI / CDチュートリアル-ツールに飛び込む
SpringBootでのCORSサポート
http://www.yamllint.com/-このツールが手元にない場合は、ここでYAML構造を検証できます
DevOpsハンドブック-例を使用して概念を理解するため。強くお勧めします。

私自身のDevOps：Webアプリケーション用のクラウドのみのCIの構築

WHO

№1: S3

№2: S3 bucket

№3: web

№4:

#1: CORS

#2:

読み物

More articles: