AWS Logo
Menu
Building a Full-Stack Budget Tracker Application with Amazon Q CLI

Building a Full-Stack Budget Tracker Application with Amazon Q CLI

An Iterative Approach

Published May 11, 2025

Introduction

In today's fast-paced development world, AI coding assistants like Amazon Q are revolutionizing how we build applications. However, many developers initially approach these tools with unrealistic expectations, hoping that a single prompt will generate a complete, production-ready application. The reality is much more nuanced and, ultimately, more powerful.
This blog post documents my journey of building a complete Budget Tracker application using Amazon Q, highlighting the iterative approach that leads to success. Rather than asking for everything at once, I'll show how breaking down the development process into logical steps and providing specific, targeted prompts yields superior results.

The Project: Simple Budget Tracker

Our goal was to create a comprehensive expense tracking application with:
  • A Flask REST API backend
  • A responsive HTML/CSS/JavaScript frontend
  • Docker containerization for deployment
  • Comprehensive testing capabilities
The final application allows users to add, update, and delete expenses, view summaries by category, filter by date ranges, and visualize spending patterns.

General Amazon Q CLI Requirements

  1. AWS Account
    • Active AWS account with appropriate permissions
    • AWS CLI configured with valid credentials
  2. Amazon Q Access
    • Amazon Q Developer subscription or appropriate access level
    • Permissions to use Amazon Q features
  3. CLI Installation – Ensure you have Python 3.9+Install the AWS CLI
  1. CLI Configuration
    Configure AWS credentials if not already done: aws configure
    Verify Amazon Q CLI installation: q --version

The Iterative Development Process

Step 1: Requirements Analysis with BDD

My Prompt:
Create a behavior-driven development (BDD) specification for a simple budget tracker application that allows users to track expenses.
This initial prompt focused solely on defining the requirements in a structured format. Rather than asking for a complete application, I started by establishing what the application should do.
Response Snippet:
This BDD specification provided a clear roadmap for the application's functionality, which guided subsequent development steps.

Step 2: Test-Driven Development Approach

My Prompt:
Create a test-driven development approach for implementing the budget tracker based on the BDD specification.
With requirements in hand, I moved to establishing a testing strategy before writing any implementation code.
Response Sample Snippet:

Step 3: Core Implementation

My Prompt:
Implement the core BudgetTracker class based on the test cases, with functionality for adding, updating, and deleting expenses, as well as getting summaries and balances.
Only after defining requirements and tests did I ask for the actual implementation.
Response Snippet:

Step 4: Flask API Development

My Prompt:
Create a Flask REST API using the BudgetTracker class with endpoints: POST /expense, GET /balance, and GET /summary. Store the code under src/app.py.
With the core functionality in place, I moved to creating the API layer.
Response Snippet:
Full Code Generated:

Step 5: API Testing with Postman

My Prompt:
Create a Postman Collection to validate all usecase and store the response testing_api/postmancollection.json.
To ensure the API worked correctly, I created a comprehensive testing suite.
Response Snippet:

Step 6: Frontend Development

My Prompt:
Create a Flask REST API using the BudgetTracker class with endpoints: POST /expense, GET /balance, and GET /summary. Store the code under src/app.py. Add a nice HTML interface to display the Expense Tracker application.
Next, I focused on creating a user-friendly interface for the application.
Response Snippet:

Step 7: Containerization with Docker

My Prompt:
Write a Dockerfile to containerize this Flask application.
To make deployment easier, I containerized the application.
Response Snippet:

Debugging and Fixing Issues

Throughout the development process, we encountered several issues that required iterative problem-solving:

Issue 1: Module Import Error in Docker

When trying to run the containerized application, we encountered:
Prompt for Fix:
Solution:
This fix ensured that the module could be imported both when running locally with python src/app.py and when running in the Docker container.

Front End UI

Lessons Learned

1. Break Down Complex Tasks

Instead of asking Amazon Q to "build a budget tracking application," we broke the task into logical components:
  • Requirements analysis
  • Test development
  • Core functionality
  • API layer
  • Frontend
  • Containerization

2. Provide Context and Feedback

Each prompt built upon previous responses, providing context and feedback:
  • "This works, now let's add..."
  • "There's an issue with X, can you fix it by..."
  • "Let's enhance this by adding..."

3. Iterate Based on Results

When issues arose, we didn't start from scratch but instead provided specific feedback to refine the solution:
  • "The Docker build is failing because of module imports"
  • "The API returns a 403 error"

4. Maintain a Clear Vision

Throughout the process, we maintained a clear vision of the end product while being flexible about implementation details.

Conclusion

Building a full-stack application with Amazon Q is not about finding the perfect one-line prompt that magically generates everything. It's about breaking down the development process into logical steps, providing specific guidance at each stage, and iterating based on results.
This approach mirrors traditional software development methodologies but accelerates them dramatically. By working iteratively with Amazon Q, we were able to build a complete Budget Tracker application with a fraction of the effort that would have been required with traditional coding.
The key insight is that Amazon Q is not a replacement for developers but a powerful tool that amplifies their capabilities. By understanding how to effectively collaborate with AI coding assistants through iterative prompting, developers can achieve remarkable results in record time.

Youtube Video for Step by Step Explanation

 

Comments