Skip to content
My GitHub Profile My Twitter Profile

[GitHub Actions] Build and Deploy Angular App

Here you can see how to build and deploy your Angular app with GitHub Actions.

name: Name

# Controls when the workflow will run
on:
  # Triggers the workflow on push or pull request events but only for the "main" branch
  push:
    branches:
      - main
  pull_request:
    branches:
      - main
    types:
      - closed
  workflow_dispatch:

jobs:
  build:
    if: ${{ github.ref == 'refs/heads/main' }}
    name: Build and Deploy
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18.x]
    steps:
      - name: 🛒 Checkout
        uses: actions/checkout@v3
        
      - name: ✨ Cache node-modules
        uses: actions/cache@v3
        with:
          path: ~/.npm
          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-node-
            
      - name: ✨ Install Node ${{ matrix.node-version }}
        uses: actions/setup-node@v3
        with:
          node-version: ${{ matrix.node-version }}

      - name: 🚀 npm install and npm run build
        run: |
          npm install
          npm run build
        
      - name: 🔑 Install SSH Key
        run: |
          install -m 600 -D /dev/null ~/.ssh/id_rsa
          echo "${{ secrets.KEY }}" > ~/.ssh/id_rsa
          echo "${{ secrets.KNOWN_HOSTS }}" > ~/.ssh/known_hosts

      - name: 🚀 Deploy
        run: rsync -avzhe ssh 'dist/' ${{ secrets.REMOTE_DEST }}
        
      - name: 📤 Telegram Notification
        run: |
          curl -X POST \
           -H 'Content-Type: application/json' \
           -d '{"chat_id": "${{ secrets.TELEGRAM_TO }}", "text": "✅ Angular App Deployed", "disable_notification": false}' \
           https://api.telegram.org/bot${{ secrets.TELEGRAM_TOKEN }}/sendMessage