Amazon CodeCatalyst は新規のお客様には提供されなくなりました。既存のお客様は、通常どおりサービスを引き続き使用できます。詳細については、「[CodeCatalyst から移行する方法](migration.md)」を参照してください。 翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。 # チュートリアル: GitHub Action を使用した lint コード このチュートリアルでは、Amazon CodeCatalyst ワークフローに [Super-Linter GitHub Action](https://github.com/marketplace/actions/super-linter) を追加します。Super-Linter アクションは、コードを検査し、コードにエラー、フォーマットの問題、疑わしいコンストラクトがある領域を見つけて、その結果を CodeCatalyst コンソールに出力します。ワークフローに linter を追加したら、ワークフローを実行してサンプル Node.js アプリケーション (`app.js`) を lint します。次に、報告された問題を修正し、ワークフローを再度実行して、修正がうまくいったかどうかを確認します。 **ヒント** Super-Linter を使用して、[CloudFormation テンプレート](https://docs.aws.amazon.com/AWSCloudFormation/latest/UserGuide/template-guide.html)などの YAML ファイルを lint することを検討してください。 **Topics** + [前提条件](#integrations-github-action-tutorial-prereqs) + [ステップ 1: ソースレポジトリを作成する](#integrations-github-action-tutorial-create-source-repo) + [ステップ 2: app.js ファイルを追加する](#integrations-github-action-tutorial-add-appjs) + [ステップ 3: Super-Linter アクションを実行するワークフローを作成する](#integrations-github-action-tutorial-create-workflow) + [ステップ 4: Super-Linter が検出した問題を修正する](#integrations-github-action-tutorial-fix-probs) + [クリーンアップ](#integrations-github-action-tutorial-cleanup) ## 前提条件 開始するには、以下のものが必要です。 + が接続された CodeCatalyst **スペース** AWS アカウント。詳細については、「[スペースを作成する](spaces-create.md)」を参照してください。 + CodeCatalyst スペース内の `codecatalyst-linter-project` という空のプロジェクト。このプロジェクトを作成するには、**[ゼロから開始]** オプションを選択します。 ``` ``` 詳細については、「[Amazon CodeCatalyst での空のプロジェクトの作成](projects-create.md#projects-create-empty)」を参照してください。 ## ステップ 1: ソースレポジトリを作成する このステップでは、CodeCatalyst に空のソースリポジトリを作成します。このリポジトリを使用して、このチュートリアルのサンプルアプリケーションソースファイル `app.js` を保存します。 ソースリポジトリの詳細については、「[ソースリポジトリを作成する](source-repositories-create.md)」を参照してください。 **ソースリポジトリを作成するには** 1. [https://codecatalyst.aws/](https://codecatalyst.aws/) で CodeCatalyst コンソールを開きます。 1. プロジェクト「`codecatalyst-linter-project`」に移動します。 1. ナビゲーションペインで **[コード]** を選択してから、**[ソースリポジトリ]** を選択します。 1. **[リポジトリの追加]** を選択し、**[リポジトリの作成]** を選択します。 1. **[リポジトリ名]** に次のように入力します。 ``` codecatalyst-linter-source-repository ``` 1. **[作成]** を選択します。 ## ステップ 2: app.js ファイルを追加する このステップでは、`app.js` ファイルをソースリポジトリに追加します。`app.js` にはいくつかの誤りがある関数コードが含まれており、これが linter によって検出されます。 **app.js ファイルを追加するには** 1. CodeCatalyst コンソールで、プロジェクト `codecatalyst-linter-project` を選択します。 1. ナビゲーションペインで **[コード]** を選択してから、**[ソースリポジトリ]** を選択します。 1. ソースリポジトリのリストから、リポジトリ `codecatalyst-linter-source-repository` を選択します。 1. **[ファイル]** で、**[ファイルを作成]** を選択します。 1. テキストボックスに次のコードを入力します。 ``` // const axios = require('axios') // const url = 'http://checkip.amazonaws.com/'; let response; /** * * Event doc: https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html#api-gateway-simple-proxy-for-lambda-input-format * @param {Object} event - API Gateway Lambda Proxy Input Format * * Context doc: https://docs.aws.amazon.com/lambda/latest/dg/nodejs-prog-model-context.html * @param {Object} context * * Return doc: https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html * @returns {Object} object - API Gateway Lambda Proxy Output Format * */ exports.lambdaHandler = async (event, context) => { try { // const ret = await axios(url); response = { statusCode: 200, 'body': JSON.stringify({ message: 'hello world' // location: ret.data.trim() }) } } catch (err) { console.log(err) return err } return response } ``` 1. **[ファイル名]** に `app.js` と入力します。その他のオプションはデフォルトのままにします。 1. **[コミット]** を選択します。 これで、`app.js` と呼ばれる新しいファイルが作成されました。 ## ステップ 3: Super-Linter アクションを実行するワークフローを作成する このステップでは、ソースリポジトリにコードをプッシュするときに Super-Linter アクションを実行するワークフローを作成します。ワークフローは、YAML ファイルで定義する以下の要素で構成されます。 + **トリガー** – このトリガーは、ソースリポジトリに変更をプッシュすると、ワークフローの実行を自動的に開始します。トリガーについての詳細は、「[トリガーを使用したワークフロー実行の自動的な開始](workflows-add-trigger.md)」を参照してください。 + **GitHub Actions アクション** - トリガー時に、**GitHub Actions** アクションは Super-Linter アクションを実行し、ソースリポジトリ内のすべてのファイルを検査します。linter で問題が検出されると、ワークフローアクションは失敗します。 **Super-Linter アクションを実行するワークフローを作成するには** 1. CodeCatalyst コンソールで、プロジェクト `codecatalyst-linter-project` を選択します。 1. ナビゲーションペインで **[CI/CD]**、**[ワークフロー]** の順に選択します。 1. **[ワークフローを作成]** を選択します。 1. **[ソースリポジトリ]** で、`codecatalyst-linter-source-repository` を選択します。 1. **[ブランチ]** で、`main` を選択します。 1. **[作成]** を選択します。 1. YAML サンプルコードを削除します。 1. 次の YAML を追加します。 ``` Name: codecatalyst-linter-workflow SchemaVersion: "1.0" Triggers: - Type: PUSH Branches: - main Actions: SuperLinterAction: Identifier: aws/github-actions-runner@v1 Configuration: Steps: github-action-code ``` 上記のコードで、この手順の次のステップで指示されているように、*github-action-code* を Super-Linter アクションコードに置き換えます。 1. GitHub Marketplace の [Super-Linter のページ](https://github.com/marketplace/actions/super-linter)に移動します。 1. `steps:` (小文字) の下にあるコードを見つけ、CodeCatalyst ワークフローの `Steps:` (大文字) に貼り付けます。 次のコードに示すように、GitHub Action コードを CodeCatalyst の規格に準拠するように調整します。 CodeCatalyst ワークフローは次のようになります。 ``` Name: codecatalyst-linter-workflow SchemaVersion: "1.0" Triggers: - Type: PUSH Branches: - main Actions: SuperLinterAction: Identifier: aws/github-actions-runner@v1 Configuration: Steps: - name: Lint Code Base uses: github/super-linter@v4 env: VALIDATE_ALL_CODEBASE: "true" DEFAULT_BRANCH: main ``` 1. (任意) **[検証]** を選択して、コミットする前に YAML コードが有効であることを確認します。 1. **[コミット]** を選択して **[コミットメッセージ]** を入力し、`codecatalyst-linter-source-repository` **[リポジトリ]** を選択して再度 **[コミット]** を選択します。 これでワークフローが作成されました。ワークフローの先頭で定義されているトリガーにより、ワークフローの実行が自動的に開始されます。 **ワークフロー実行の進行状況を確認するには** 1. ナビゲーションペインで **[CI/CD]**、**[ワークフロー]** の順に選択します。 1. 先ほど作成したワークフロー `codecatalyst-linter-workflow` を選択します。 1. ワークフロー図で、**SuperLinterAction** を選択します。 1. アクションが失敗するのを待ちます。この失敗は想定されるもので、linter でコードに問題が検出されたためです。 1. CodeCatalyst コンソールを開いたままにして、「[ステップ 4: Super-Linter が検出した問題を修正する](#integrations-github-action-tutorial-fix-probs)」に進みます。 ## ステップ 4: Super-Linter が検出した問題を修正する Super-Linter で、ソースリポジトリに含まれる `README.md` ファイルだけでなく、`app.js`コードにも問題が検出されているはずです。 **linter が見つけた問題を修正するには** 1. CodeCatalyst コンソールで、**[ログ]** タブにある **[lint コードベース]** を選択します。 Super-Linter アクションで生成されたログが表示されます。 1. Super-Linter ログで、問題が始まる 90 行目付近までスクロールダウンします。次のような内容です。 ``` /github/workspace/hello-world/app.js:3:13: Extra semicolon. /github/workspace/hello-world/app.js:9:92: Trailing spaces not allowed. /github/workspace/hello-world/app.js:21:7: Unnecessarily quoted property 'body' found. /github/workspace/hello-world/app.js:31:1: Expected indentation of 2 spaces but found 4. /github/workspace/hello-world/app.js:32:2: Newline required at end of file but not found. ``` 1. ソースリポジトリの `app.js` と `README.md` を修正し、変更をコミットします。 **ヒント** `README.md` を修正するには、次のように `markdown` をコードブロックに追加します。 ``` ```markdown Setup examples: ... ``` ``` 変更により、別のワークフローが自動的に実行されます。ワークフローが終了するのを待ちます。すべての問題を修正すると、ワークフローが成功します。 ## クリーンアップ CodeCatalyst でクリーンアップを行い、このチュートリアルの作業内容を環境から削除します。 **CodeCatalyst でクリーンアップを行うには** 1. [https://codecatalyst.aws/](https://codecatalyst.aws/) で CodeCatalyst コンソールを開きます。 1. `codecatalyst-linter-source-repository` を削除します。 1. `codecatalyst-linter-workflow` を削除します。 このチュートリアルでは、一部のコードを lint するために Super-Linter GitHub Action を CodeCatalyst ワークフローに追加する方法を学習しました。