From 8f55da693ca2b1a67c6bc3a0dda73f8d999ea6cb Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Tue, 27 May 2025 23:55:05 -0500 Subject: [PATCH 1/8] feat: Add development environment marker and fix Vite environment variable handling --- .env.example | 1 + app.ts | 2 ++ config/index.ts | 37 ++++++++++++++++++------------------- lib/clock-website-stack.ts | 9 +++++++-- package.json | 2 +- src/index.html | 1 + src/script.ts | 9 +++++++++ src/style.css | 10 ++++++++++ src/vite-env.d.ts | 17 +++++++++++++++++ vite.config.ts | 32 ++++++++++++++++++++++---------- 10 files changed, 88 insertions(+), 32 deletions(-) create mode 100644 src/vite-env.d.ts diff --git a/.env.example b/.env.example index 5aaa072..2967c7c 100644 --- a/.env.example +++ b/.env.example @@ -5,3 +5,4 @@ AWS_HOSTED_ZONE_ID=Z0123456789ABCDEFGHIJ # Environment NODE_ENV=development +ENVIRONMENT=development diff --git a/app.ts b/app.ts index 3910aea..d9434e7 100644 --- a/app.ts +++ b/app.ts @@ -8,6 +8,8 @@ const environment = app.node.tryGetContext('environment') || 'development'; // R const stackId = `ClockWebsiteStack-${environment}`; // Create a unique stack ID based on environment new ClockWebsiteStack(app, stackId, { + environment: environment, + envVars: process.env, // Pass process.env to the stack /* If you don't specify 'env', this stack will be environment-agnostic. * Account/Region-dependent features and context lookups will not work, * but you can deploy to any account and region. */ diff --git a/config/index.ts b/config/index.ts index e157f86..2068844 100644 --- a/config/index.ts +++ b/config/index.ts @@ -7,25 +7,24 @@ export type DeploymentConfig = { }; }; -const configs: Record = { - development: { - environment: 'development', - aws: { - domainName: process.env.AWS_DOMAIN_NAME || 'dev-clock.taylormadetech.net', - baseDomainName: process.env.AWS_BASE_DOMAIN || 'taylormadetech.net', - hostedZoneId: process.env.AWS_HOSTED_ZONE_ID || 'Z08476952AAJG5D55EAB6' +export function getConfig(env: string = 'development', envVars: Record): DeploymentConfig { + const configs: Record = { + development: { + environment: 'development', + aws: { + domainName: envVars.VITE_AWS_DOMAIN_NAME || envVars.AWS_DOMAIN_NAME || 'dev-clock.taylormadetech.net', + baseDomainName: envVars.VITE_AWS_BASE_DOMAIN || envVars.AWS_BASE_DOMAIN || 'taylormadetech.net', + hostedZoneId: envVars.VITE_AWS_HOSTED_ZONE_ID || envVars.AWS_HOSTED_ZONE_ID || 'Z08476952AAJG5D55EAB6' + } + }, + production: { + environment: 'production', + aws: { + domainName: envVars.VITE_AWS_DOMAIN_NAME || envVars.AWS_DOMAIN_NAME || 'clock.taylormadetech.net', + baseDomainName: envVars.VITE_AWS_BASE_DOMAIN || envVars.AWS_BASE_DOMAIN || 'taylormadetech.net', + hostedZoneId: envVars.VITE_AWS_HOSTED_ZONE_ID || envVars.AWS_HOSTED_ZONE_ID || 'Z08476952AAJG5D55EAB6' + } } - }, - production: { - environment: 'production', - aws: { - domainName: process.env.AWS_DOMAIN_NAME || 'clock.taylormadetech.net', - baseDomainName: process.env.AWS_BASE_DOMAIN || 'taylormadetech.net', - hostedZoneId: process.env.AWS_HOSTED_ZONE_ID || 'Z08476952AAJG5D55EAB6' - } - } -}; - -export function getConfig(env: string = 'development'): DeploymentConfig { + }; return configs[env] || configs.development; } diff --git a/lib/clock-website-stack.ts b/lib/clock-website-stack.ts index 41b86e9..ba4935f 100644 --- a/lib/clock-website-stack.ts +++ b/lib/clock-website-stack.ts @@ -9,12 +9,17 @@ import * as route53Targets from 'aws-cdk-lib/aws-route53-targets'; import * as acm from 'aws-cdk-lib/aws-certificatemanager'; import { getConfig } from '../config/index.js'; +interface ClockWebsiteStackProps extends cdk.StackProps { + environment: string; + envVars: Record; +} + export class ClockWebsiteStack extends cdk.Stack { - constructor(scope: Construct, id: string, props?: cdk.StackProps) { + constructor(scope: Construct, id: string, props: ClockWebsiteStackProps) { super(scope, id, props); // Get configuration based on environment context parameter - const config = getConfig(this.node.tryGetContext('environment')); + const config = getConfig(props.environment, props.envVars); // Replace hardcoded values with config values const domainName = config.aws.domainName; diff --git a/package.json b/package.json index cfa63de..06cd304 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.0", "main": "dist/app.js", "scripts": { - "start": "vite dev", + "dev": "vite dev", "build": "vite build", "cdk": "cdk", "deploy": "npm run build && npx tsc && cdk deploy", diff --git a/src/index.html b/src/index.html index f3c550e..a63a2c9 100644 --- a/src/index.html +++ b/src/index.html @@ -8,6 +8,7 @@
+
diff --git a/src/script.ts b/src/script.ts index f0d9874..00a9e00 100644 --- a/src/script.ts +++ b/src/script.ts @@ -1,6 +1,9 @@ import './style.css'; // Import the CSS file +import { getConfig } from '../config'; const clockElement = document.getElementById('clock'); +const environmentMarker = document.getElementById('environment-marker'); +const config = getConfig(import.meta.env.VITE_ENVIRONMENT, import.meta.env); function updateClock(): void { const now = new Date(); @@ -11,6 +14,12 @@ function updateClock(): void { if (clockElement) { clockElement.textContent = `${hours}:${minutes}:${seconds}`; } + + if (environmentMarker && config.environment === 'development') { + environmentMarker.textContent = 'dev'; + } else if (environmentMarker) { + environmentMarker.textContent = ''; // Clear for production + } } // Update the clock immediately diff --git a/src/style.css b/src/style.css index b6282f5..71f99ba 100644 --- a/src/style.css +++ b/src/style.css @@ -23,4 +23,14 @@ body { } } +#environment-marker { + position: fixed; + bottom: 20px; + right: 20px; + font-size: 2em; /* Semi-large lettering */ + color: #0f0; /* Similar to clock color */ + text-shadow: 0 0 10px #0f0; /* Similar glow effect */ + z-index: 1000; +} + /* Added comment to trigger potential Vite update */ diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts new file mode 100644 index 0000000..655d493 --- /dev/null +++ b/src/vite-env.d.ts @@ -0,0 +1,17 @@ +/// + +interface ImportMetaEnv { + readonly VITE_ENVIRONMENT: string; + readonly VITE_AWS_DOMAIN_NAME: string; + readonly VITE_AWS_BASE_DOMAIN: string; + readonly VITE_AWS_HOSTED_ZONE_ID: string; + readonly BASE_URL: string; + readonly MODE: string; + readonly DEV: boolean; + readonly PROD: boolean; + readonly SSR: boolean; +} + +interface ImportMeta { + readonly env: ImportMetaEnv; +} diff --git a/vite.config.ts b/vite.config.ts index 6b9eae8..f1e9b3c 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,12 +1,24 @@ -import { defineConfig } from 'vite'; +import { defineConfig, loadEnv } from 'vite'; +import { getConfig } from './config'; -export default defineConfig({ - root: 'src', // Set the source directory as the root - build: { - outDir: '../dist', // Output build files to a 'dist' directory at the project root - emptyOutDir: true, // Empty the output directory on build - }, - server: { - open: true, // Automatically open the browser on server start - } +export default defineConfig(({ mode }) => { + const env = loadEnv(mode, process.cwd(), 'VITE_') as ImportMetaEnv; + const config = getConfig(env.VITE_ENVIRONMENT || 'development', env); + + return { + root: 'src', // Set the source directory as the root + build: { + outDir: '../dist', // Output build files to a 'dist' directory at the project root + emptyOutDir: true, // Empty the output directory on build + }, + server: { + open: true, // Automatically open the browser on server start + }, + define: { + 'import.meta.env.VITE_ENVIRONMENT': JSON.stringify(config.environment), + 'import.meta.env.VITE_AWS_DOMAIN_NAME': JSON.stringify(config.aws.domainName), + 'import.meta.env.VITE_AWS_BASE_DOMAIN': JSON.stringify(config.aws.baseDomainName), + 'import.meta.env.VITE_AWS_HOSTED_ZONE_ID': JSON.stringify(config.aws.hostedZoneId), + } + }; }); From e069c62941da95c7875406155d9468fbea3ea3b4 Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Wed, 28 May 2025 08:30:54 -0500 Subject: [PATCH 2/8] feat: Implement environment-aware DEV marker using Vite mode --- src/script.ts | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/script.ts b/src/script.ts index 00a9e00..0e7e717 100644 --- a/src/script.ts +++ b/src/script.ts @@ -1,9 +1,7 @@ import './style.css'; // Import the CSS file -import { getConfig } from '../config'; const clockElement = document.getElementById('clock'); const environmentMarker = document.getElementById('environment-marker'); -const config = getConfig(import.meta.env.VITE_ENVIRONMENT, import.meta.env); function updateClock(): void { const now = new Date(); @@ -15,10 +13,10 @@ function updateClock(): void { clockElement.textContent = `${hours}:${minutes}:${seconds}`; } - if (environmentMarker && config.environment === 'development') { - environmentMarker.textContent = 'dev'; + if (environmentMarker && import.meta.env.MODE === 'development') { + environmentMarker.textContent = 'DEV'; } else if (environmentMarker) { - environmentMarker.textContent = ''; // Clear for production + environmentMarker.textContent = ''; // Clear for other modes } } From 0f5824fcd27db029921f35d7ba7556afe0879e7d Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Wed, 28 May 2025 08:32:54 -0500 Subject: [PATCH 3/8] Feat: Enhance clock accessibility and update time format --- src/index.html | 2 +- src/script.ts | 10 ++++++++-- src/style.css | 3 ++- 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/index.html b/src/index.html index a63a2c9..8e94a4e 100644 --- a/src/index.html +++ b/src/index.html @@ -7,7 +7,7 @@ -
+
diff --git a/src/script.ts b/src/script.ts index 0e7e717..e6b1fa6 100644 --- a/src/script.ts +++ b/src/script.ts @@ -5,12 +5,18 @@ const environmentMarker = document.getElementById('environment-marker'); function updateClock(): void { const now = new Date(); - const hours = String(now.getHours()).padStart(2, '0'); + let hours24 = now.getHours(); const minutes = String(now.getMinutes()).padStart(2, '0'); const seconds = String(now.getSeconds()).padStart(2, '0'); + const ampm = hours24 >= 12 ? 'PM' : 'AM'; + + let hours12 = hours24 % 12; + hours12 = hours12 ? hours12 : 12; // Convert hour '0' (midnight) to '12' + + const hoursStr = String(hours12); // Hour without leading zero if (clockElement) { - clockElement.textContent = `${hours}:${minutes}:${seconds}`; + clockElement.textContent = `${hoursStr}:${minutes}:${seconds} ${ampm}`; } if (environmentMarker && import.meta.env.MODE === 'development') { diff --git a/src/style.css b/src/style.css index 71f99ba..4c39964 100644 --- a/src/style.css +++ b/src/style.css @@ -13,7 +13,8 @@ body { #clock { font-size: 8em; /* Large font size */ text-align: center; - text-shadow: 0 0 10px #0f0; /* Optional glow effect */ + font-weight: bold; /* Added for better readability */ + /* text-shadow: 0 0 10px #0f0; */ /* Removed for crispness */ } /* Basic responsiveness for smaller screens */ From 4d4ea66f628cee7a4784208e37e7d9452ae78d2a Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Sat, 31 May 2025 13:26:49 -0500 Subject: [PATCH 4/8] feat: Add GitHub Actions workflow and IAM user CloudFormation template --- .github/workflows/deploy.yml | 63 ++++++++++++++++++++++++ github-actions-iam-user.yml | 93 ++++++++++++++++++++++++++++++++++++ 2 files changed, 156 insertions(+) create mode 100644 .github/workflows/deploy.yml create mode 100644 github-actions-iam-user.yml diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml new file mode 100644 index 0000000..dffb379 --- /dev/null +++ b/.github/workflows/deploy.yml @@ -0,0 +1,63 @@ +name: Deploy to AWS + +on: + push: + branches: + - dev # Triggers the workflow on push events to the dev branch + +jobs: + deploy: + name: Deploy to Development + runs-on: ubuntu-latest + # environment: development # Optional: configure a GitHub environment named "development" in repo settings for protection rules and secrets. + # See: https://docs.github.com/en/actions/deployment/targeting-different-environments/using-environments-for-deployment + # If you uncomment this, ensure the "development" environment exists in your GitHub repository settings. + + permissions: + id-token: write # Required for OIDC if you choose to use it + contents: read + + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: '20' # Specify your Node.js version + + - name: Install dependencies + run: npm install + + - name: Run tests + run: npm test + + - name: Build Vite application + run: npm run build + + - name: Compile CDK TypeScript + run: npx tsc + + - name: Configure AWS Credentials + uses: aws-actions/configure-aws-credentials@v4 + with: + aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} + aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + aws-region: ${{ secrets.AWS_REGION }} # e.g., us-east-1 + + - name: Deploy CDK Stack (Development) + run: npm run cdk -- deploy --all -c environment=development --require-approval never + env: + # You might need to pass environment variables required by your CDK stack or config + # For example, if your config/index.ts reads from process.env for the 'development' environment: + # DEV_DOMAIN_NAME: ${{ secrets.DEV_DOMAIN_NAME }} + # DEV_BASE_DOMAIN_NAME: ${{ secrets.DEV_BASE_DOMAIN_NAME }} + # DEV_HOSTED_ZONE_ID: ${{ secrets.DEV_HOSTED_ZONE_ID }} + # Ensure these secrets are also configured in your GitHub repository settings if needed. + # The CDK stack gets config from getConfig(props.environment, props.envVars). + # Ensure your config/index.ts can resolve values for 'development' + # or pass them via -c context if needed, e.g., + # cdk deploy -c environment=development -c domainName=${{ secrets.DEV_DOMAIN_NAME }} ... + # This example assumes your config/index.ts handles 'development' + # without needing extra env vars here, or they are passed via CDK context from app.ts. + CI: true # Standard environment variable indicating a CI environment diff --git a/github-actions-iam-user.yml b/github-actions-iam-user.yml new file mode 100644 index 0000000..b228d59 --- /dev/null +++ b/github-actions-iam-user.yml @@ -0,0 +1,93 @@ +AWSTemplateFormatVersion: '2010-09-09' +Description: >- + Creates an IAM User, Policy, and Access Key for GitHub Actions to deploy AWS CDK stacks. + WARNING: Outputs AccessKeyId and SecretAccessKey. Secure these credentials immediately + and consider more secure authentication methods like OIDC. + +Parameters: + GitHubDeployUserName: + Type: String + Default: GitHubActionsDeployUser + Description: Name for the IAM user. + +Resources: + GitHubActionsUser: + Type: AWS::IAM::User + Properties: + UserName: !Ref GitHubDeployUserName + Policies: + - PolicyName: GitHubActionsDeployPolicy + PolicyDocument: + Version: '2012-10-17' + Statement: + - Effect: Allow # Permissions for CDK Toolkit and CloudFormation + Action: + - cloudformation:* + - s3:GetBucketLocation # Required by CDK for S3 assets + - s3:ListAllMyBuckets # Required by CDK for some operations + - ssm:GetParameter # For CDK context lookups from SSM + - iam:GetUser # To check current user identity + - iam:ListAccountAliases # For display purposes in CDK + - sts:GetCallerIdentity # For display purposes in CDK + - ecr:DescribeRepositories # If using ECR assets with CDK + Resource: "*" + - Effect: Allow # Permissions for CDK Bootstrap resources + Action: + - s3:* + Resource: + - !Sub "arn:aws:s3:::cdk-*-assets-${AWS::AccountId}-${AWS::Region}" + - !Sub "arn:aws:s3:::cdk-*-assets-${AWS::AccountId}-${AWS::Region}/*" + - Effect: Allow # Permissions for IAM roles created/managed by CDK + Action: + - iam:GetRole + - iam:GetInstanceProfile + - iam:CreateRole + - iam:DeleteRole + - iam:PutRolePolicy + - iam:AttachRolePolicy + - iam:DetachRolePolicy + - iam:DeleteRolePolicy + - iam:PassRole + - iam:TagRole + - iam:ListAttachedRolePolicies + - iam:ListRolePolicies + - iam:ListRoleTags + Resource: !Sub "arn:aws:iam::${AWS::AccountId}:role/cdk-*" + - Effect: Allow # Permissions for application-specific resources (ClockWebsiteStack) + Action: + - s3:* + Resource: + - !Sub "arn:aws:s3:::simple-clock-website-*-${AWS::AccountId}-${AWS::Region}" + - !Sub "arn:aws:s3:::simple-clock-website-*-${AWS::AccountId}-${AWS::Region}/*" + - Effect: Allow + Action: + - cloudfront:* + - route53:* + - acm:* + - logs:CreateLogGroup # For Lambda@Edge if used by CloudFront + - logs:CreateLogStream + - logs:PutLogEvents + - iam:CreateServiceLinkedRole # For services like CloudFront, Route53, ACM, etc. + Resource: "*" # These services often require broad permissions or create resources with unpredictable names. + # For stricter security, scope these down if possible after initial deployment. + + GitHubActionsUserAccessKey: + Type: AWS::IAM::AccessKey + Properties: + UserName: !Ref GitHubActionsUser + # WARNING: The SecretAccessKey will be visible in the AWS CloudFormation console + # and in API calls like DescribeStacks. Secure it immediately after creation. + +Outputs: + AccessKeyId: + Description: Access Key ID for the GitHub Actions IAM user. + Value: !Ref GitHubActionsUserAccessKey + SecretAccessKey: + Description: >- + Secret Access Key for the GitHub Actions IAM user. + IMPORTANT: Store this securely in GitHub Secrets and then consider removing this output + or the AccessKey resource from the template for enhanced security. + Value: !GetAtt GitHubActionsUserAccessKey.SecretAccessKey + IAMUserArn: + Description: ARN of the created IAM user. + Value: !GetAtt GitHubActionsUser.Arn From 9ab6444ce4750931c99ca4083a90f0bdc69a9da8 Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Sat, 31 May 2025 13:29:42 -0500 Subject: [PATCH 5/8] fix: Correct Jest config loading in ESM project --- jest.config.js => jest.config.cjs | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename jest.config.js => jest.config.cjs (100%) diff --git a/jest.config.js b/jest.config.cjs similarity index 100% rename from jest.config.js rename to jest.config.cjs From acdbfb17ebe05636401400a87a82f05a39728cfc Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Sat, 31 May 2025 13:31:34 -0500 Subject: [PATCH 6/8] fix: Add aws-cdk to devDependencies for CI --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 06cd304..db6fb11 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "@aws-cdk/aws-s3": "^1.203.0", "@aws-cdk/aws-s3-deployment": "^1.203.0", "@types/jest": "^29.5.14", + "aws-cdk": "^2.195.0", "aws-cdk-lib": "^2.195.0", "constructs": "^10.4.2", "jest": "^29.7.0", From 27ee1a6044fabeec45933832420d02672017440c Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Sat, 31 May 2025 13:40:40 -0500 Subject: [PATCH 7/8] feat: display current timezone under clock --- src/index.html | 5 ++++- src/script.ts | 6 ++++++ src/style.css | 17 +++++++++++++++++ 3 files changed, 27 insertions(+), 1 deletion(-) diff --git a/src/index.html b/src/index.html index 8e94a4e..66ace96 100644 --- a/src/index.html +++ b/src/index.html @@ -7,7 +7,10 @@ -
+
+
+
+
diff --git a/src/script.ts b/src/script.ts index e6b1fa6..aef5b00 100644 --- a/src/script.ts +++ b/src/script.ts @@ -1,6 +1,7 @@ import './style.css'; // Import the CSS file const clockElement = document.getElementById('clock'); +const timezoneElement = document.getElementById('timezone'); const environmentMarker = document.getElementById('environment-marker'); function updateClock(): void { @@ -14,11 +15,16 @@ function updateClock(): void { hours12 = hours12 ? hours12 : 12; // Convert hour '0' (midnight) to '12' const hoursStr = String(hours12); // Hour without leading zero + const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone; if (clockElement) { clockElement.textContent = `${hoursStr}:${minutes}:${seconds} ${ampm}`; } + if (timezoneElement) { + timezoneElement.textContent = timeZone.replace('_', ' '); + } + if (environmentMarker && import.meta.env.MODE === 'development') { environmentMarker.textContent = 'DEV'; } else if (environmentMarker) { diff --git a/src/style.css b/src/style.css index 4c39964..7fe462b 100644 --- a/src/style.css +++ b/src/style.css @@ -10,6 +10,13 @@ body { overflow: hidden; /* Prevent scrollbars */ } +#clock-container { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + #clock { font-size: 8em; /* Large font size */ text-align: center; @@ -17,11 +24,21 @@ body { /* text-shadow: 0 0 10px #0f0; */ /* Removed for crispness */ } +#timezone { + font-size: 2em; /* Smaller than the clock */ + text-align: center; + margin-top: 10px; /* Space below the clock */ + color: #0f0; /* Consistent with clock color */ +} + /* Basic responsiveness for smaller screens */ @media (max-width: 600px) { #clock { font-size: 4em; } + #timezone { + font-size: 1em; /* Adjust for smaller screens */ + } } #environment-marker { From 540afe6587b079a430494fd4578c148f8b6ace89 Mon Sep 17 00:00:00 2001 From: Hector Alvarez Date: Sat, 31 May 2025 14:19:45 -0500 Subject: [PATCH 8/8] feat: Add GitHub Action workflow for production deployments This commit introduces a new job to the GitHub Actions workflow: - 'deploy_prod' triggers on pull request merges to the 'main' branch. - It deploys the AWS CDK stack with the context 'environment=production'. - This allows for automated deployments to the production environment. --- .github/workflows/deploy.yml | 76 +++++++++++++++++++++++++++++------- 1 file changed, 61 insertions(+), 15 deletions(-) diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index dffb379..7844547 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -4,15 +4,17 @@ on: push: branches: - dev # Triggers the workflow on push events to the dev branch + pull_request: + types: [closed] + branches: + - main # Triggers on PR close to main jobs: - deploy: + deploy_dev: name: Deploy to Development + if: github.event_name == 'push' && github.ref == 'refs/heads/dev' # Ensure this job only runs for pushes to dev runs-on: ubuntu-latest - # environment: development # Optional: configure a GitHub environment named "development" in repo settings for protection rules and secrets. - # See: https://docs.github.com/en/actions/deployment/targeting-different-environments/using-environments-for-deployment - # If you uncomment this, ensure the "development" environment exists in your GitHub repository settings. - + # environment: development # Optional: configure a GitHub environment named "development" permissions: id-token: write # Required for OIDC if you choose to use it contents: read @@ -48,16 +50,60 @@ jobs: - name: Deploy CDK Stack (Development) run: npm run cdk -- deploy --all -c environment=development --require-approval never env: - # You might need to pass environment variables required by your CDK stack or config - # For example, if your config/index.ts reads from process.env for the 'development' environment: # DEV_DOMAIN_NAME: ${{ secrets.DEV_DOMAIN_NAME }} # DEV_BASE_DOMAIN_NAME: ${{ secrets.DEV_BASE_DOMAIN_NAME }} # DEV_HOSTED_ZONE_ID: ${{ secrets.DEV_HOSTED_ZONE_ID }} - # Ensure these secrets are also configured in your GitHub repository settings if needed. - # The CDK stack gets config from getConfig(props.environment, props.envVars). - # Ensure your config/index.ts can resolve values for 'development' - # or pass them via -c context if needed, e.g., - # cdk deploy -c environment=development -c domainName=${{ secrets.DEV_DOMAIN_NAME }} ... - # This example assumes your config/index.ts handles 'development' - # without needing extra env vars here, or they are passed via CDK context from app.ts. - CI: true # Standard environment variable indicating a CI environment + CI: true + + deploy_prod: + name: Deploy to Production + runs-on: ubuntu-latest + # environment: production # Optional: configure a GitHub environment named "production" + if: github.event_name == 'pull_request' && github.event.action == 'closed' && github.event.pull_request.merged == true && github.ref == 'refs/heads/main' + # The condition above ensures this job only runs when a PR is merged into the main branch. + # Note: github.ref in the context of a pull_request event for 'closed' points to the base branch (e.g., refs/heads/main). + + permissions: + id-token: write # Required for OIDC if you choose to use it + contents: read + + steps: + - name: Checkout code + uses: actions/checkout@v4 + with: + ref: main # Ensure we check out the main branch after merge + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: '20' # Specify your Node.js version + + - name: Install dependencies + run: npm install + + - name: Run tests + run: npm test # It's good practice to run tests before deploying to production + + - name: Build Vite application + run: npm run build + + - name: Compile CDK TypeScript + run: npx tsc + + - name: Configure AWS Credentials + uses: aws-actions/configure-aws-credentials@v4 + with: + aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} + aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + aws-region: ${{ secrets.AWS_REGION }} # Ensure this is your production region or use a specific secret like secrets.PROD_AWS_REGION + + - name: Deploy CDK Stack (Production) + run: npm run cdk -- deploy --all -c environment=production --require-approval never + env: + # Ensure your config/index.ts can resolve values for 'production' + # or pass them via -c context or environment variables if needed, e.g., + # PROD_DOMAIN_NAME: ${{ secrets.PROD_DOMAIN_NAME }} + # PROD_BASE_DOMAIN_NAME: ${{ secrets.PROD_BASE_DOMAIN_NAME }} + # PROD_HOSTED_ZONE_ID: ${{ secrets.PROD_HOSTED_ZONE_ID }} + # Ensure these secrets are configured in your GitHub repository settings if they are required by your CDK stack for production. + CI: true