Add: Workflows to Minify HTML, CSS, and JS and Push to Deployment Branch

[Zingzy]

Description

Implement a GitHub Actions workflow to automatically minify HTML, CSS, and JavaScript files and push the optimized code to a deployment branch. This will improve the performance of the web application by reducing the size of the files that need to be downloaded by the user's browser.

Tasks

• [ ] Set Up Node.js Environment

  • Configure the GitHub Actions workflow to set up a Node.js environment.
  • Ensure the correct version of Node.js is used.

• [ ] Install Minification Tools

  • Install necessary tools for minifying HTML, CSS, and JavaScript files (html-minifier, cssnano, uglify-js).
  • Ensure the tools are properly configured.

• [ ] Minify HTML Files

  • Use html-minifier to minify HTML files.
  • Ensure the minification process preserves the functionality and appearance of the HTML.

• [ ] Minify CSS Files

  • Use cssnano to minify CSS files.
  • Ensure the minification process preserves the functionality and appearance of the CSS.

• [ ] Minify JS Files

  • Use uglify-js to minify JavaScript files.
  • Ensure the minification process preserves the functionality and behavior of the JavaScript.

• [ ] Commit and Push Changes

  • Commit the minified files to a new branch called deployment.
  • Push the changes to the deployment branch on GitHub.

• [ ] Testing

  • Add steps to run tests before minifying files to ensure that the minification process does not introduce any errors.
  • Perform integration tests to ensure the workflow works seamlessly with the existing system.

[Zingzy]

name: Minify and Deploy

on:
  push:
    branches:
      - main

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
    - name: Checkout code
      uses: actions/checkout@v2

    - name: Set up Node.js
      uses: actions/setup-node@v2
      with:
        node-version: '14'

    - name: Install dependencies
      run: npm install html-minifier cssnano uglify-js

    - name: Minify HTML
      run: |
        find . -name "*.html" -exec html-minifier --collapse-whitespace --remove-comments --minify-css true --minify-js true -o {} {} \;

    - name: Minify CSS
      run: |
        find . -name "*.css" -exec cssnano {} {} \;

    - name: Minify JS
      run: |
        find . -name "*.js" -exec uglifyjs --compress --mangle -o {} -- {} \;

    - name: Commit and push changes
      run: |
        git config --global user.name 'github-actions'
        git config --global user.email 'github-actions@github.com'
        git checkout -b deployment
        git add .
        git commit -m "Minify HTML, CSS, and JS files"
        git push --force --set-upstream origin deployment
      env:
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

Possible Workflow (Untested)