Forem: John NG

Easy-CRM, a productivity tool created with Kiro

John NG — Sun, 14 Sep 2025 17:39:02 +0000

Inspiration

Our team spent a lot of time in identifying contacts for inviting to our events, as our leads often were scattered across excels/csvs from various past events/sources. As such, we need a tool to consolidate them all and allow easy query/exporting.

What it does

A serverless web application that enables users to upload CSV/Excel files containing lead data in various formats. The system automatically standardizes the data using DeepSeek AI and provides a web interface for viewing, filtering, exporting, and querying lead.

Demo available!!!
https://demo-crm.cmpapp.top/
demo-user
DemoPass123!

Main Menu

Uploading

Key Features

File Upload & Processing: Drag-and-drop CSV/Excel upload with automatic format standardization
Real-Time Processing Status: Live status indicator showing upload and processing progress with cancellation support
Multi-Worksheet Excel Support: Automatically processes ALL worksheets in Excel files (not just the first one)
Duplicate Lead Handling: Automatic detection and handling of duplicate leads based on email addresses
Lead Management: Sortable, filterable table view with pagination for lead data
Phone Field Integration: Complete phone number support with validation, formatting, and clickable tel: links
Data Export: CSV export functionality with filter-aware data selection
Batch Processing: Scalable file processing architecture using SQS queues for large files
Secure Access: AWS Cognito authentication with JWT token validation

How I built it

Technology Stack

Backend: Python 3.13, AWS Lambda, DynamoDB, S3, SQS
Frontend: Vanilla HTML5, CSS, JavaScript with Tailwind CSS
Infrastructure: CloudFormation nested stacks
AI Integration: DeepSeek AI API for data standardization
Authentication: AWS Cognito (User Pool + Identity Pool)
CDN: CloudFront with SSL certificate

Architecture Diagram

Lesson learnt from using Kiro

The most challenging part with vibe coding is debugging the issues with Kiro. Later on I adopted the below approaches which dramatically reduce number issues arising:

During Project kickstart:

I provided the architecture in the "spec" session, such as how lambda should process the info, db schema, etc.
I always try to explain the whole logic and required features in detail, so that Kiro wont have to guess or over-engineered my solution.
Kiro generate the details on implementation and test cases, task by task.
Go through the tasks.

During implementation:
I always use steering to ensure that future vibe coding/spec will always follow certain amount of standard/convention. For example, I require Kiro to always use venv to prevent messing up my workspace and global env.

After getting a MVP:

For bug fix, i use 'Vibe' session as it's more simple and direct, and less costly.
For new feature/enhancement, I used "Spec" session, as new changes may affect whole architecture, and require through planning to reduce future bug fixes.

The above approaches enables Kiro to find the root issues much quicker, thus saving time and credits.

One notable mention on code generation is that Kiro helped me solved a race condition problem, which is due to concurrent lambda operations on a dynamoDB update. Kiro successfully investigated the root issue and able to implement atomic operations to ensure the program be race-free.

What I learned

While Kiro/vibe coding is powerful, it still require a user with substancial knowledge to guide it, or else the product wont be delivered once it got complex enough.

What's next for easy-crm

Will be adding querying on the leads with NLP to gain insights easily soon!

Feel free to leave your comments below!! Would love to discuss how we can gradually adopt vibe coding into production. Also feel free to connect me via:
LinkedIn:https://www.linkedin.com/in/john-nch-hk
GitHub: https://github.com/john-ng-hk

Vibe coding a simple STEM Game with Amazon Q CLI

John NG — Thu, 19 Jun 2025 04:48:00 +0000

Just recently saw this post and decided that it would be interesting to test out Amazon Q CLI capability by building a game, so here we go!

First, I started by finding a game idea. Well turns out my high school teacher friend has some students find understanding physic concepts difficult, like free body diagrams. So I created this game for her students to understand the concepts easier~

With the game idea in place, I then proceed to setup the development environment and get my hands dirty. For anyone interested, you can refer this guide to install Amazon Q CLI.

Basically Amazon Q CLI is like ChatGPT/Grok/DeepSeek but in the form of CLI, so it's quite easy to use as long as you are comfortable with CLI environment.

So with Amazon Q CLI ready, now is time for prompting! It's working better than I expected as it appears Q is using a reasoning model by default, though the response time could be quite long as a trade-off.

Therefore, after endless prompting and revising, i find the below tips that maybe usefull in facilitating effective prompting and reduce the back-and-forth between you and Q:

Define a prompting framework such that the Q know the context, the task, and the expected results
Ask Q to provide visual debugs can let the Q know how to fix issues more quickly
Ask Q to give a plan before coding, that way you know Q is thinking as you expected

With about 3 hours prompting and waiting, here's the final product!

game demo: https://fbd.cmpapp.top

GitHub: https://github.com/john-ng-hk/stem-fbd-game

That's all and thanks for reading, feel free to connect me on LinkedIn too~

[June 2025 UPDATED] Business Card Solution powered with AI

John NG — Sun, 16 Mar 2025 16:23:39 +0000

Building a Modern Business Card Scanner with AI: A Deep Dive into AWS and DeepSeek Integration

Hey there, fellow developers! 👋 Today, I'm excited to share my journey of building a modern business card scanner application that leverages AI to transform physical business cards into organized digital contacts. This project combines AWS services with the DeepSeek API to create a powerful networking tool.

🎯 The Problem

In today's digital age, we still exchange physical business cards, but managing them efficiently is a challenge:

Cards get lost or damaged
Manual data entry is time-consuming and error-prone
It's hard to analyze your professional network effectively
Finding specific contacts or seeing connections between companies is difficult

There are existing digital business card scanning solution in the market, but they are often:

expensive
not user friendly
only supports internal address book, no integration with device contacts
data stored in the providers' database, you don't own the data

💡 The Solution

I built an open-source web application that solves these problems by:

Using AI to extract information from business card images
Organizing contacts with rich metadata
Allows importing the contacts to your phone contacts in batch!
self-deployable solution, meaning you own and control your data!
Providing network analysis and visualization
Offering an AI-powered chat interface for querying your contact database

🏗️ Technical Architecture

The application is built on a modern serverless stack:

Key Components:

Frontend:
- Frontend hosted on S3 and enhanced with CloudFront CDN
- Interactive network visualization using D3.js
- Real-time chat interface
- Responsive design with Tailwind CSS
Backend:
- AWS Lambda for serverless compute
- Amazon Textract for OCR
- DeepSeek API for intelligent data extraction
- DynamoDB for contact storage
- S3 for image storage
Authentication:
- AWS Cognito for user management
- Secure API access with IAM roles

🔍 Key Features

Intelligent Card Scanning

Network Analysis

AI-Powered Chat Interface

🚀 Getting Started

Want to try it yourself?

Click this demo url
Sign in using the test credentials:
- Username: testUser
- Password: 12345678!
Navigate to the "Scan Cards" tab
Upload one or more business card images
View processed contacts in the "My Contacts" tab
Explore network insights in the "Network Analysis" tab

Want to deploy yourself? Check out the repo: https://github.com/john-ng-hk/Biz-card-scanner

🎨 User Experience

The application provides a seamless experience:

Upload business card images (single or batch)
AI automatically extracts and categorizes information
View your contacts in a modern, filterable interface
Explore network connections through interactive visualizations
Chat with AI to analyze your professional network
Easily export contacts as vcard files for your phone contacts

💰 Cost Estimation

AWS: Total 12 months cost = 15.00 USD AWS Pricing Calculator

DeepSeek API: minimum spend = 10RMB = 1.38 USD (1USD = 7.24 RMB)

Total Annual Cost = AWS+DeepSeek key = 15+1.38=16.38= around 16.5 USD

main assumptions:

Number of API Requests 1000 API requests each day x 20 working days = 20000 API requests per month
Number of scan card requests: 1 card each day x 30 days = 30 requests

🔮 Future Enhancements

I'm planning to add:

Maybe with https so that the can directly scan with device mobile (DONE! You can now directly scan with camera)
Better UI/UX and improve latency with AI chatbot.
The current serverless architecture is a "Lambdalith", which is great for quick development for PoC but does not scale well with more features coming in. So may need decouple this part in the future.

🤔 Key Learnings

Building this project taught me several valuable lessons:

Serverless architectures need really thoughtful timeout configurations (I had to increaset the integration timeout to 60000ms via service quota request this time...)
User experience is crucial for AI-powered application, I didnt expect most my dev time is on the frontend part.

🎁 Open Source

This project is open source! Feel free to:

Star the repository
Submit issues or feature requests
Contribute improvements
Fork and adapt for your needs

🔗 Resources

👋 Connect

I'd love to hear your thoughts and suggestions! Connect with me:

GitHub: [https://github.com/john-ng-hk]
LinkedIn: [https://www.linkedin.com/in/john-nch-hk/]

Let me know in the comments if you'd like to see more detailed posts about specific aspects of this project!

Business Card Solution powered with DeepSeek

John NG — Sun, 16 Mar 2025 15:21:44 +0000

Building a Modern Business Card Scanner with AI: A Deep Dive into AWS and DeepSeek Integration

🎯 The Problem

In today's digital age, we still exchange physical business cards, but managing them efficiently is a challenge:

Cards get lost or damaged
Manual data entry is time-consuming and error-prone
It's hard to analyze your professional network effectively
Finding specific contacts or seeing connections between companies is difficult

There are existing digital business card scanning solution in the market, but they are often:

expensive
not user friendly
only supports internal address book, no integration with device contacts
data stored in the providers' database, you don't own the data

💡 The Solution

I built a web application that solves these problems by:

Using AI to extract information from business card images
Organizing contacts with rich metadata
Allows importing the contacts to your phone contacts in batch!
self-deployable solution, meaning you own and control your data!
Providing network analysis and visualization
Offering an AI-powered chat interface for querying your contact database

🏗️ Technical Architecture

The application is built on a modern serverless stack:

Key Components:

Frontend:
- Single-page application hosted on S3
- Interactive network visualization using D3.js
- Real-time chat interface
- Responsive design with Tailwind CSS
Backend:
- AWS Lambda for serverless compute
- Amazon Textract for OCR
- DeepSeek API for intelligent data extraction
- DynamoDB for contact storage
- S3 for image storage
Authentication:
- AWS Cognito for user management
- Secure API access with IAM roles

🔍 Key Features

1. Intelligent Card Scanning

def parse_with_deepseek(raw_text):
    prompt = (
        "Extract the following information from the provided business card text: "
        "name, company, department, title, email, phone, address, website. "
        "Additionally, categorize the company's industry..."
    )
    # DeepSeek API integration for smart data extraction

2. Network Analysis

function updateNetworkVisualization() {
    // D3.js force-directed graph
    const simulation = d3.forceSimulation(nodes)
        .force("link", d3.forceLink(links).id(d => d.id))
        .force("charge", d3.forceManyBody())
        .force("center", d3.forceCenter(width / 2, height / 2));

3. AI-Powered Chat Interface

def handle_chat_message(event, cors_headers):
    """Handle chat messages using DeepSeek."""
    # Process natural language queries about your contacts
    # Generate insights and recommendations

🚀 Getting Started

Want to try it yourself? Here's how:

Clone the repository:

git clone <repository-url>
cd business-card-scanner

Install dependencies:

cd application
pip install -r requirements.txt

Configure AWS and DeepSeek:

Environment:
  Variables:
    DEEPSEEK_API_KEY: 'YOUR_API_KEY'

Deploy:

./deploy.sh

🎨 User Experience

The application provides a seamless experience:

Upload business card images (single or batch)
AI automatically extracts and categorizes information
View your contacts in a modern, filterable interface
Explore network connections through interactive visualizations
Chat with AI to analyze your professional network
Easily export contacts as vcard files for your phone contacts

💰 Cost Estimation

AWS: Total 12 months cost = 15.00 USD AWS Pricing Calculator

DeepSeek API: minimum spend = 10RMB = 1.38 USD (1USD = 7.24 RMB)

Total Annual Cost = AWS+DeepSeek key = 15+1.38=16.38= around 16.5 USD

main assumptions:

Number of API Requests 1000 API requests each day x 20 working days = 20000 API requests per month
Number of scan card requests: 1 card each day x 30 days = 30 requests

🔮 Future Enhancements

I'm planning to add:

Maybe with https so that the can directly scan with device mobile
Better UI/UX and improve latency with AI chatbot.
The current serverless architecture is a "Lambdalith", which is great for quick development for PoC but does not scale well with more features coming in. So may need decouple this part in the future.

🤔 Key Learnings

Building this project taught me several valuable lessons:

Serverless architectures need thoughtful timeout configurations
User experience is crucial for AI-powered application

🎁 Open Source

This project is open source! Feel free to:

Star the repository
Submit issues or feature requests
Contribute improvements
Fork and adapt for your needs

🔗 Resources

👋 Connect

I'd love to hear your thoughts and suggestions! Connect with me:

GitHub: [https://github.com/john-ng-hk]
LinkedIn: [https://www.linkedin.com/in/john-nch-hk/]

Let me know in the comments if you'd like to see more detailed posts about specific aspects of this project!

Cloud Billing Portal: Automated Billing Statement Generation for Cloud Services

John NG — Thu, 30 Jan 2025 10:22:05 +0000

Use case

Currently our team need to spend large amount of time in manually consolidating multiple cloud accounts' bills into one single statement for our clients. As such, I have developed an in-house statement generation tool on AWS to automate consolidation of cloud vendor bills into customizable billing statements, saving hours of effort to and reducing human errors.

Link to demo

Key Features

Provides a simple login system for authenticaiton and authorization
Consolidate cloud vendor's raw bills into a single PDF statement
Customizable PDF statement that allows input for address, ATTN, exchange rate, business logic, etc.

Solution Overview

The Cloud Billing Portal is a comprehensive AWS-based solution designed to simplify and automate the process of generating and managing cloud billing statements. This application provides a user-friendly interface for uploading billing data, processing it, and generating customized PDF billing statements.

The portal leverages various AWS services, including Lambda, API Gateway, S3, and Cognito, to create a secure and scalable billing management system. It offers features such as user authentication, file upload capabilities, and automated PDF generation based on uploaded billing data.

The following diagram depicts the architecture of this solution.

Installation and Deployment

Please refer to the GitHub repo for installation and deployment guide

Cost

Assumptions: 100 request per month to S3 and Lambda. 1 active user for signing into the portal

Monthly cost: 0.07 USD Yearly cost: 0.84 USD
No upfront cost.

Detailed estimation link: https://calculator.aws/#/estimate?id=73dac7b97d53a08857592a60c20f21541269b683

Limitations

Maximum payload

Maximum payload for Lambda is 6MB, so any amount of .csv which may lead produce a statement greater than 6MB will probably return 500 error.

Scaling strategies

The system scales well with the proposed fully serverless architecutre. However, to support more than 1,000 concurrent users, the default quota of Lambda it must be increased by Requesting a quota increase.

Cloud Vendor

Currently the portal only allows processing raw bills from Huawei Cloud. To allow input from other cloud vendors .csv, you will need to specify their respective csv format such as column names in /sam-CloudBillingPortal/myBillAcc.py.

Potential Improvements

Allow Sign-up Page redirect to cloud billing portal
Setup custom DNS domain name
Include WAF for better security
Implement loggings such as CloudWatch to track usage and errors.
Setup unit tests in the CI/CD pipeline.
Use HTTPS for better security

A simple short-lived URL shortener solution with AWS and GitHub actions

John NG — Sun, 15 Dec 2024 14:54:26 +0000

Use case

In cases where some large documents need be shared to client with URLs, these URLs are often lengthy, and use of free online URL shortener services like Bitly.com are prohibited due to confidentiality of documents. As such, I have designed a URL shortener with AWS to solve this problem for myself and team.

Link to demo URL Shortener
The following image shows the webpage of the URL shortener.

Features

Provides a simple web interface for users to submit long URLs and receive shortened versions of it
Generate customizable short URLs in the format: http://xxxxx.xxx/h2so4
Each short URL expires after 10 minutes after creation/accessed
Displays a custom error page for non-existing short URLs

Solution Component

AWS services

Amazon API Gateway
Amazon CloudFront
Amazon DynamoDB
Amazon EventBridge
Amazon S3
AWS CloudFormation
AWS Lambda
AWS WAF (Optional)

Others

Git
GitHub Actions
Python
HTML
CSS

Solution Overview

The core idea of this solution is using S3 as a redirection engine to redirect URLs based on the attached metadata. When the user enters a short URL, S3 automatically responds with a HTTP redirect to the long URL, see here )for more details.

However, the user need a way to interact with the S3 redirection engine. As such, a website that provide interactions based on client is needed. This is where our API gateway comes into the picture, which will be acting as a simple page for our users and allow them to submit request that will invoke our backend (Lambda functions) to store our shortened URLs into our S3 bucket.

Lastly, we will use Amazon CloudFront to wrap everything together with a simple domain name.

The following diagram depicts the architecture of this solution.

Deployment

For easiest deployment, you can just use the CloudFormation stack provided here to quickly launch all resources in your AWS account.

If you wish to set this up together with a CI/CD pipeline using GitHub actions, please refer to the README in my repo.

Cost

Assumptions: 100 short urls created per month, each viewed by 100 users. So 100x100 = 10,000 requests/month.

Monthly cost: 0.95 USD (without WAF) Yearly cost: 11.4 USD
No upfront cost.

Detailed estimation link: https://calculator.aws/#/estimate?id=0c0cd81bd97e9e112e7ddee985b873c0c34e0ef5

Limitations

Limitations on concurrent users

The limitation is 1,000 concurrent users with the current proposed setup. The bottleneck is Lambda, which is supporting only 1,000 concurrent concurrent executions with the defualt quota.

Scaling strategies

The URL Shortener scales well with the proposed fully serverless architecutre. However, to support more than 1,000 concurrent users, the default quota of Lambda it must be increased by Requesting a quota increase.

Potential Improvements

Redirect uesr back to homepage if a the link is invalid.
Setup custom DNS domain name to create a really short URL instead of using cloudfront domain.
Setup mechanisms like Captcha to deter bot attacks and spam on the service.
Setup access control such as Cognito to the portal for secure authentication.
Implement loggings such as CloudWatch to track usage and errors.
Setup unit tests in the CI/CD pipeline.

Reference

https://aws.amazon.com/blogs/compute/build-a-serverless-private-url-shortener/