2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

S3をデプロイ先としたCI/CD環境の構築

Last updated at Posted at 2021-06-14

## はじめに
今回やった内容はAWSのハンズオンセミナーのCodeCommit、CodePipeLineを用いAmazon S3バケットへのデプロイを行うパイプラインを構築します。
途中Cloud9が起動せず1時間ぐらい悪戦苦闘しました。そこも交えてアウトプットしていこうと思います。
またS3の静的Webホスティングについてはこちら

よろしくお願いします(。・ω・)ノ゙

## 今回使用したAWSサービス

CodeCommit ・ソースコードを管理する**Gitリポジトリサービス** ・サートバーティ製のツールも利用可能 ・プルリクエスト機能もある ・フルマネージド型のリソース管理サービス
CodePipeLine ・**フルマネージド型の継続的デリバリーサービス** ・Codecommit/CodeBuild/CodeDeployの流れをパイプラインとして定義することでソースコードがコミットされたらデプロイまで自動化 ・素早く確実性のあるアプリケーションとインフラストラクチャのアップデートのためのパイプラインのリソースを自動化
AWS Cloud9 ・アプリケーションの開発などをクラウド環境で利用できるサービス ・IDE(統合開発環境)としての機能が充実しておりGitHubなどの他のツールとの連携もスムーズ ・ブラウザ上で動くのでPCに依存することなく開発環境を準備することができるのが利点。無料 ・今回初期起動せず原因探しに時間を費やした。

今回作る構成図

CodeCommit.jpg

## CodeCommit
まずマネジメントコンソールからCodeCommitを開きリポジトリを作成していく。

スクリーンショット 2021-06-14 173533.png

スクリーンショット 2021-06-14 173655.png

Cloud9で環境構築

マネジメントコンソールからCloud9を開きCloud9の環境を作っていく過程でエラーがあり悪戦苦闘したのも書いていきたいと思います。
スクリーンショット 2021-06-14 192530.png

本来であればこのままName、EC2インスタンスのタイプやプラットフォームも今回は学習用なのでデフォルトで進めていくのだが、何故かCloud9環境に接続できなかった。

調べた限りのCloud9環境に接続できない主な原因として
 ・VPCのルーティングミス
 ・ネットワークACL
 ・セキュリティグループ辺りの設定ミス

Cloud9はVPCに接続する際デフォルトVPC(変更可)に対して接続されるようになっておりそこからCloudFormastionのテンプレートを使用しEC2インスタンスがデプロイされるようになっている。
CloudFormastionのスタックを見る限りロールバックは起きてないのでデプロイは上手く行ってる。
なので上記のネットワークの設定ミスが多いと思います。

僕の場合はインターネットゲートウェイがブラックホールになっており削除されたインターネットゲートウェイを利用しようとしていたのが原因で接続出来なかった。
接続出来ると以下のようなターミナル画面が出てくる
スクリーンショット 2021-06-14 194439.png

AWS CodeCommitの認証ヘルパーを使って接続していく

ターミナルで以下のコマンドを叩き接続する

git config --global credential.helper '!aws codecommit credential-helper $@'
git config --global credential.UseHttpPath true

そしてターミナル上でGitユーザーとメールアドレスを作成する。

git conhig --global user.name "○○○○"
git conhig --global user.email "○○○○@hogehoge.jp"

先ほど作ったCodeCommitからリポジトリをクローンする。
スクリーンショット 2021-06-14 195412.png

cdコマンドでmasterリポジトリに移動しgitコマンドを打つことでCodeCommitのリポジトリにファイルが作成される!
スクリーンショット 2021-06-14 195834.png

CodePipeLine

CodePipeLineでパイプラインの設定をしていく。
マネジメントコンソールからCodePipeLineを開き作成をクリックし名前を設定しソースステージを追加するという画面では、

1:ソースプロバイダーにCodeCommitを指定
2:リポジトリ名にそれぞれ設定した名前を指定
3:ブランチはmasterしかないのでそれを指定

をそれぞれ設定する
スクリーンショット 2021-06-14 200618.png

次へをクリックしていくとビルドステージに設定する画面が出てくるのだが今回はCodeCommitにpushされたソースをそのままS3にデプロイするように設定するので今回は省きます。

スキップするとデプロイステージがでてくるのですが今回はそのままS3にデプロイするのでプロバイダーにS3を設定する。
スクリーンショット 2021-06-14 201236.png
レビューの画面が出てくるので下にスクロールしパイプラインを作成するをクリックする

ここまで用意が終わると下のようにCloud9でHTMLファイルのソースを書き換えプッシュすることでCodePipeLineが検知してその変更をS3バケットに反映させることができるようになる!!!

おわりに

エラーで躓きそうになりましたが、楽しくできました!!
また今度はEC2上にCI/CD環境の構築をしていこうと思います!!!!

(。・ω・)ノ゙バイバイ

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?