Expense Tracker (Part 5/5): Frontend

Series links: Part 1/5 – Introduction Part 2/5 – Database Planning Part 3/5 – AWS Setup Part 4/5 – Backend APIs Part 5/5 – Frontend (you are here) What A small, fast web app that helps you add transactions with bills and later search/export them. Why Quick to use on phone or laptop. No heavy frameworks needed; it’s plain HTML/CSS/JS so you can host it anywhere. How Get the code Frontend source: https://github.com/sagarnayak/expense-tracking-public Pages you’ll see ...

August 11, 2025 · 2 min · 275 words · Me

Deploy Html to S3

What You can push you static html files with its related assets to AWS s3 directly from github action whenever you push files to github. How You will need an IAM user from aws with access to s3 and cloudfront ( if you are goign to use cloudfront ). and a s3 bucket to put things into. name: Deploy to S3 on: push: branches: - master jobs: deploy: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v4 with: submodules: false - name: Sync S3 bucket uses: jakejarvis/s3-sync-action@master with: args: --delete env: AWS_S3_BUCKET: your-bucket-name AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} AWS_REGION: 'us-west-1' SOURCE_DIR: '.' - name: Invalidate CloudFront uses: chetan/invalidate-cloudfront-action@v2 env: DISTRIBUTION: your-cf-id PATHS: "/*" AWS_REGION: "us-east-1" AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} in the above code if you are not using a cloudfront distribution to serve the s3 do not use the Invalidate CloudFront step.

November 5, 2024 · 1 min · 149 words · Me