hackthecreditcards.com – Project Plan
Overview
This project is a dual-purpose initiative:
- For Users (Customers):
A free web application where users can manage their credit card history and receive smart recommendations to maximize card benefits.
- For the Developer (Engineer):
A hands-on opportunity to explore modern full-stack development, practice using AI tools, and prepare reusable components/templates for technical interviews.
Goals
Customer-Facing Goals
- Let users register and manage credit cards.
- Notify users when to open/close cards based on "unofficial but well-known" rules.
- Track signup bonuses, eligibility, and internal/external card issuer rules.
- 100% free to use.
Developer-Facing Goals
- Practice full-stack architecture with modern tools (React, .NET Web API, EF Core).
- Use AI tools (v0.dev, Claude, ChatGPT) for UI, planning, and backend logic.
- Prepare a clean template for future coding interviews or take-home assessments.
Tech Stack
- Frontend: React, Tailwind, v0.dev (for prototyping)
- Backend: .NET Web API, Entity Framework Core
- Database: PostgreSQL (or SQLite for local dev)
- Authentication: Clerk, Auth0, or custom
- Deployment: Vercel (frontend), Render or Azure (backend)
- Notifications: Email (Resend, Postmark), optional push
- AI Tools: ChatGPT, Claude, v0.dev
Project Roadmap
Phase 1 – Planning & Setup (Week 1)
- Define MVP feature list and user flow
- Finalize tech stack and architecture
- Initialize GitHub repos for frontend/backend
- Generate initial UI with v0.dev
- Scaffold .NET Web API and DB schema
Phase 2 – MVP Build (Weeks 2–3)
- Build core features: add/view/edit credit cards
- Implement user registration/login
- Connect frontend to backend
- Deploy dev versions of both apps
Phase 3 – Advanced Features (Weeks 4–5)
- Create logic for bonus qualification and rule-based notifications
- Build rule engine (eligibility checks, benefit optimizations)
- Integrate email/push notification system
- Optional: user-sourced rule suggestions
Phase 4 – Interview Prep & DevOps (Week 6)
- Extract reusable project template (React + .NET boilerplate)
- Write full documentation and README
- Deploy production version of app
- Run mock interviews or assessments using the app codebase
Draft Database Schema
Table | Key Fields |
Users | id, email, password_hash, created_at |
CreditCards | id, user_id, card_name, issuer, open_date, close_date, status |
CardRules | id, issuer, rule_type, description, requirements |
Notifications | id, user_id, message, type, sent_at, is_read |
AI Use Cases
Tool | Usage |
v0.dev | Generate initial UI screens |
ChatGPT/Claude | API design, planning help, backend rule engine logic |
LLMs | Generate CRUD code, refactor, create test cases, write docs |
Deliverables
- Deployed web app for users (free)
- Reusable template for React + .NET interviews
- GitHub project with full documentation
- Optional blog post or video walkthrough
Milestones Summary
Week | Milestone |
1 | Setup complete, UI prototyped |
2–3 | MVP (card tracking, auth, dashboard) complete |
4–5 | Rule engine and notifications implemented |
6 | Template created, project deployed, interview-ready |