+ Website generated by DeepSeek from prompt: You are a skilled full-stack developer tasked with creating an MVP (Minimum Viable Product) of a Side Hustle Income Tracker web application. The goal is to build a functional prototype that allows users to sign up, authenticate via Google, track their daily income, categorize earnings, and view basic analytics. Key Requirements: Technology Stack: Frontend: Vite, React, TypeScript, Tailwind CSS, shadcn-ui Backend: NestJS framework. Database: PostgreSQL (use an ORM like TypeORM). Authentication: Implement Google OAuth integration for user sign-in. Use JWT for session handling. Deployment Setup: Assume we will eventually deploy on AWS, but for now, focus on local development and a containerized setup (Docker). Initial Features: User Authentication: Implement Google OAuth for sign-in. Store user information (e.g., email, display name) in the database upon first login. Income Entries: A form to add a new income entry with fields: amount, category, date, and optional notes. A simple backend endpoint to store income entries associated with the authenticated user. Categories: Ability for users to create and manage their own income categories (e.g., "Freelance", "E-commerce Sales"). Store categories in the database, linked to each user. Basic Analytics: A dashboard page displaying a summary of total income over the last 30 days. A simple chart (using Chart.js) to visualize daily income totals over time (mock data first, then integrate after entries are recorded). User Interface Requirements: Home/Dashboard Page: After login, show a summary card of total income this month. Include a line chart of the last 30 days’ income. Provide a button to add a new income entry. Income Entry Page: Form to input amount, select category, pick a date, and add optional notes. Upon submission, send data to backend and return to dashboard or show success message. Category Management Page: Simple list of categories with "Add New Category" form. Options to edit or delete categories. Header & Navigation: Show user’s name or avatar if available. Include links to Home, Categories, and Logout. Data Structures & API Endpoints: User: id, email, displayName, createdAt, updatedAt Category: id, userId, name, createdAt, updatedAt IncomeEntry: id, userId, categoryId, amount, date, notes, createdAt, updatedAt API Endpoints (initial set): POST /auth/google - Handle Google OAuth callback, issue JWT. GET /me - Returns authenticated user’s profile. GET /categories / POST /categories / PUT /categories/:id / DELETE /categories/:id GET /income (optionally with date filters) / POST /income / PUT /income/:id / DELETE /income/:id GET /analytics/summary - Returns summarized income data for the dashboard. Development Approach: Start by setting up the repository structure. Implement basic NestJS backend with authentication and dummy endpoints. Integrate PostgreSQL using TypeORM for models and migrations. Set up frontend with React and Vite, configure Tailwind CSS, and create placeholder pages. Add Google OAuth flow on frontend and backend. Connect frontend forms and charts to backend data. Use Docker Compose to define local development environment with a Postgres service and the Node.js services. What to Produce First: Scaffold the backend NestJS application with basic modules: AuthModule, UserModule, CategoryModule, IncomeModule. Implement Google OAuth logic and JWT token issuing. Set up database entities and run migrations. Scaffold the frontend React app, integrate Tailwind, and create placeholder pages for login, dashboard, and category management. Implement a basic login page that redirects users to Google OAuth, and then displays a dashboard with a static chart and a placeholder add-income form. Next Steps After MVP: Integrate dynamic data into charts. Improve the UI design and add responsive layouts. Add form validations and user-friendly error messages.
