Skip to content

πŸ’° Financer - A modern full-stack personal finance management platform with AI-powered insights, real-time stock analysis, and comprehensive expense tracking. Built with React 19, FastAPI, Firebase, and Google Gemini AI.

Notifications You must be signed in to change notification settings

Anish-2005/Financer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

48 Commits
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ’° Financer - Complete Personal Finance Management Suite

Financer Logo

React FastAPI Firebase Google AI License

A modern, full-stack financial management application that combines cutting-edge technology with intuitive design to revolutionize personal finance management.

πŸš€ Live Demo β€’ πŸ“– Documentation β€’ πŸ› Report Bug β€’ ✨ Request Feature


🌟 Overview

Financer is a comprehensive financial management platform that empowers users to take control of their financial future. Built with modern technologies and AI integration, it provides real-time market data, intelligent insights, and powerful tools for expense tracking, investment analysis, and financial planning.

🎯 Mission Statement

To democratize financial literacy and empower individuals with the tools and insights needed to make informed financial decisions through technology and AI.

✨ Key Features

πŸ’Έ Smart Expense Management

  • Real-time Tracking: Instant expense categorization and tracking
  • Visual Analytics: Interactive charts showing spending patterns
  • Budget Planning: Set and monitor budget goals with alerts
  • Recurring Expenses: Automatic detection and management
  • Export Reports: Generate detailed financial reports

πŸ“ˆ Advanced Stock Analysis

  • Live Market Data: Real-time NSE stock prices and updates
  • Technical Analysis: Advanced charting with technical indicators
  • Performance Metrics: Comprehensive stock performance analysis
  • Market Trends: AI-powered trend analysis and predictions
  • Watchlist Management: Custom stock watchlists with alerts

πŸ”„ Portfolio Optimization

  • Asset Allocation: Visualize and optimize portfolio distribution
  • Performance Tracking: Monitor portfolio returns and growth
  • Risk Assessment: AI-powered risk analysis and recommendations
  • Rebalancing Alerts: Smart notifications for portfolio adjustments
  • Diversification Analysis: Sector and geographic diversification insights

🏦 Fixed Deposit Calculator

  • Interest Calculations: Accurate FD maturity calculations
  • Comparison Tools: Compare FD rates across different banks
  • Investment Planning: Optimize FD investments for maximum returns
  • Tax Implications: Calculate tax-adjusted returns

πŸ€– AI Financial Advisor

  • Personalized Advice: Google Gemini-powered financial guidance
  • Market Insights: AI analysis of market conditions and opportunities
  • Investment Recommendations: Tailored investment suggestions
  • Risk Profiling: Intelligent risk assessment and management
  • Financial Goals: AI-assisted goal setting and tracking

πŸ” Enterprise-Grade Security

  • Firebase Authentication: Multi-factor authentication support
  • Data Encryption: End-to-end encryption for sensitive data
  • Secure API: JWT-based secure API communications
  • Privacy Protection: GDPR-compliant data handling
  • Audit Trails: Comprehensive activity logging

πŸ—οΈ Architecture & Project Structure

πŸ“ Repository Structure

Google-Solutions/
β”œβ”€β”€ 🎨 financer/                    # React Frontend Application
β”‚   β”œβ”€β”€ πŸ“„ src/
β”‚   β”‚   β”œβ”€β”€ πŸ“‘ pages/              # Application routes & views
β”‚   β”‚   β”‚   β”œβ”€β”€ LandingPage.jsx    # Welcome & onboarding
β”‚   β”‚   β”‚   β”œβ”€β”€ HomePage.jsx       # Main dashboard
β”‚   β”‚   β”‚   β”œβ”€β”€ AuthPage.jsx       # Authentication flows
β”‚   β”‚   β”‚   β”œβ”€β”€ ExpensesPage.jsx   # Expense management
β”‚   β”‚   β”‚   β”œβ”€β”€ StocksPage.jsx     # Stock market analysis
β”‚   β”‚   β”‚   β”œβ”€β”€ ComparisonsPage.jsx # Stock comparison tools
β”‚   β”‚   β”‚   β”œβ”€β”€ PortfoliosPage.jsx # Portfolio management
β”‚   β”‚   β”‚   β”œβ”€β”€ FDPage.jsx         # Fixed deposit calculator
β”‚   β”‚   β”‚   └── ChatbotPage.jsx    # AI financial advisor
β”‚   β”‚   β”œβ”€β”€ 🎭 components/         # Reusable UI components
β”‚   β”‚   β”œβ”€β”€ πŸ–ΌοΈ assets/             # Static assets & images
β”‚   β”‚   β”œβ”€β”€ 🎨 styles/             # CSS modules & themes
β”‚   β”‚   └── πŸ”§ utils/              # Helper functions & utilities
β”‚   β”œβ”€β”€ 🌐 public/                 # Public assets & manifest
β”‚   β”œβ”€β”€ πŸ“¦ package.json            # Dependencies & scripts
β”‚   β”œβ”€β”€ ⚑ vite.config.js          # Vite configuration
β”‚   └── πŸ“š README.md               # Frontend documentation
β”‚
β”œβ”€β”€ βš™οΈ financer-backend/            # FastAPI Backend Service
β”‚   β”œβ”€β”€ πŸš€ main.py                 # FastAPI application entry
β”‚   β”œβ”€β”€ πŸ“Š models.py               # Pydantic data models
β”‚   β”œβ”€β”€ πŸ“ˆ nse_data.py             # NSE data integration
β”‚   β”œβ”€β”€ πŸ§ͺ test.py                 # Testing utilities
β”‚   β”œβ”€β”€ πŸ“¦ requirements.txt        # Python dependencies
β”‚   β”œβ”€β”€ 🚒 vercel.json             # Deployment configuration
β”‚   └── πŸ“š README.md               # Backend documentation
β”‚
β”œβ”€β”€ πŸ“„ README.md                    # Main project documentation
└── πŸ“œ LICENSE                      # MIT license file

πŸ”„ System Architecture

graph TB
    subgraph "Frontend Layer"
        A[React Frontend] --> B[Vite Dev Server]
        A --> C[Firebase Auth]
        A --> D[React Router]
    end
    
    subgraph "Backend Layer"
        E[FastAPI Server] --> F[Firebase Admin]
        E --> G[Google AI API]
        E --> H[NSE Data API]
    end
    
    subgraph "External Services"
        I[Firebase Auth]
        J[Google Gemini AI]
        K[NSE Stock Exchange]
        L[Vercel Hosting]
    end
    
    A <--> E
    C <--> I
    G <--> J
    H <--> K
    E --> L
Loading

🎯 Core Components

Frontend Architecture

  • Component-Based Design: Modular, reusable React components
  • State Management: React hooks and context for state handling
  • Responsive Design: Mobile-first, adaptive layouts
  • Performance Optimization: Code splitting and lazy loading
  • Real-time Updates: WebSocket connections for live data

Backend Architecture

  • RESTful API Design: Clean, intuitive API endpoints
  • Microservices Pattern: Modular service architecture
  • Database Integration: Firebase Firestore for data persistence
  • External API Integration: NSE and Google AI service connections
  • Security Layer: JWT authentication and request validation

πŸ› οΈ Technology Stack

🎨 Frontend Technologies

Technology Version Purpose Why We Chose It
React 19.0.0 UI Library Latest features, concurrent rendering, better performance
Vite 6.2.0 Build Tool Lightning-fast HMR, optimized builds, modern ES modules
React Router DOM 7.4.0 Routing Declarative routing, code splitting, nested routes
Framer Motion 12.6.2 Animations Smooth animations, gesture support, layout animations
Recharts 2.15.1 Data Visualization React-native charts, responsive, customizable
Chart.js 5.3.0 Advanced Charts Extensive chart types, plugins, animations
Heroicons 2.2.0 Icons Beautiful SVG icons, React components, consistent design
CSS Modules - Styling Scoped styles, maintainable CSS, no conflicts

βš™οΈ Backend Technologies

Technology Purpose Benefits
FastAPI Web Framework High performance, automatic API docs, type hints
Python 3.8+ Programming Language Rich ecosystem, AI/ML libraries, readable code
Uvicorn ASGI Server Fast, lightweight, WebSocket support
Pydantic Data Validation Type safety, automatic validation, serialization
Firebase Admin Authentication Secure auth, user management, real-time database
Google Generative AI AI Integration Advanced language models, financial insights
Requests HTTP Client Simple API calls, robust error handling
Python-dotenv Configuration Environment variable management

☁️ Cloud & Infrastructure

Service Purpose Benefits
Vercel Frontend Hosting Global CDN, automatic deployments, edge functions
Vercel Backend Hosting Serverless functions, auto-scaling, zero config
Firebase Authentication Multi-provider auth, security rules, real-time sync
Firebase Firestore Database NoSQL, real-time updates, offline support
Google Cloud AI Services Gemini AI, natural language processing
NSE API Market Data Real-time stock prices, historical data

πŸ”§ Development Tools

  • ESLint: Code quality and consistency
  • Prettier: Code formatting
  • Git: Version control
  • VS Code: Development environment
  • PostCSS: CSS processing
  • Babel: JavaScript transpilation

πŸš€ Quick Start Guide

πŸ“‹ Prerequisites

Before you begin, ensure you have the following installed:

Requirement Version Download Link Verification Command
Node.js 18.0+ nodejs.org node --version
Python 3.8+ python.org python --version
Git Latest git-scm.com git --version
Firebase CLI Latest npm install -g firebase-tools firebase --version

πŸ”‘ Required API Keys & Services

  1. Firebase Project Setup

    • Go to Firebase Console
    • Create a new project
    • Enable Authentication (Email/Password, Google)
    • Generate service account key
    • Enable Firestore Database
  2. Google AI API Key

  3. NSE Data Access

    • Ensure you have proper data access agreements
    • Configure rate limiting as per API guidelines

⚑ Installation & Setup

1️⃣ Clone Repository

# Clone the repository
git clone https://github.com/Anish-2005/Google-Solutions.git
cd Google-Solutions

2️⃣ Frontend Setup

# Navigate to frontend directory
cd financer

# Install dependencies
npm install

# Create environment file
cp .env.example .env

# Configure environment variables (see Configuration section)
# Edit .env with your Firebase and API configurations

# Start development server
npm run dev

🌐 Frontend will be available at: http://localhost:5173

3️⃣ Backend Setup

# Open new terminal and navigate to backend
cd financer-backend

# Create virtual environment (recommended)
python -m venv financer-env

# Activate virtual environment
# Windows:
financer-env\Scripts\activate
# macOS/Linux:
source financer-env/bin/activate

# Install Python dependencies
pip install -r requirements.txt

# Create environment file
cp .env.example .env

# Configure environment variables (see Configuration section)
# Edit .env with your Firebase and Google AI configurations

# Start FastAPI server
uvicorn main:app --reload

πŸš€ Backend API will be available at: http://localhost:8000 πŸ“š API Documentation: http://localhost:8000/docs

4️⃣ Verify Installation

# Test frontend
curl http://localhost:5173

# Test backend health
curl http://localhost:8000/health

# Test API documentation
open http://localhost:8000/docs

πŸ”§ Development Workflow

  1. Start Both Services

    # Terminal 1 - Frontend
    cd financer && npm run dev
    
    # Terminal 2 - Backend
    cd financer-backend && uvicorn main:app --reload
  2. Make Changes

    • Frontend changes auto-reload with Vite HMR
    • Backend changes auto-reload with Uvicorn
    • Database changes reflect in real-time
  3. Testing

    # Frontend linting
    npm run lint
    
    # Backend testing
    python test.py

πŸš€ Available Scripts

Frontend Scripts

npm run dev          # Start development server
npm run build        # Build for production
npm run preview      # Preview production build
npm run lint         # Run ESLint
npm run lint:fix     # Fix ESLint issues

Backend Scripts

uvicorn main:app --reload              # Development server
uvicorn main:app --host 0.0.0.0       # Production server
python -m pytest                       # Run tests
python -m pytest --cov                # Run tests with coverage

οΏ½ Application Features & Pages

🏠 Landing Page

Click to expand

Purpose: First impression and user onboarding

  • Hero Section: Compelling value proposition with animated graphics
  • Feature Highlights: Interactive showcase of key capabilities
  • Social Proof: Testimonials and usage statistics
  • Call-to-Action: Clear sign-up/login prompts
  • Responsive Design: Optimized for all device sizes

Key Components:

  • Animated hero banner with Framer Motion
  • Feature cards with hover effects
  • Progressive web app installation prompt
  • Newsletter subscription

πŸ” Authentication Page

Click to expand

Purpose: Secure user registration and login

  • Multi-Provider Auth: Email/password and Google OAuth
  • Form Validation: Real-time validation with helpful error messages
  • Password Security: Strength indicators and requirements
  • Forgot Password: Secure password reset flow
  • Terms & Privacy: Legal compliance integration

Security Features:

  • Firebase Authentication integration
  • Rate limiting for login attempts
  • Secure session management
  • Two-factor authentication ready

🏑 Home Dashboard

Click to expand

Purpose: Central hub for all financial activities

  • Financial Overview: Net worth, monthly income/expenses
  • Quick Actions: Fast access to frequently used features
  • Recent Activity: Transaction history and updates
  • Performance Metrics: Investment gains, savings rate
  • Goal Progress: Visual progress tracking for financial goals

Interactive Elements:

  • Customizable dashboard widgets
  • Real-time data updates
  • Drag-and-drop layout customization
  • Export functionality for reports

πŸ’Έ Expense Tracking

Click to expand

Purpose: Comprehensive expense management and analysis

  • Expense Entry: Quick add with photo receipt scanning
  • Categorization: Smart auto-categorization with manual override
  • Budget Management: Set budgets with overspend alerts
  • Analytics Dashboard: Spending patterns and trends
  • Recurring Expenses: Automatic tracking of subscriptions

Advanced Features:

  • Receipt OCR for automatic expense entry
  • Category-wise spending analysis
  • Monthly/yearly comparison charts
  • Export to accounting software
  • Bill reminders and notifications

πŸ“ˆ Stock Analysis

Click to expand

Purpose: Real-time stock market data and analysis

  • Live Prices: Real-time NSE stock prices and updates
  • Interactive Charts: Candlestick charts with technical indicators
  • Company Information: Detailed company profiles and financials
  • Market News: Latest news affecting stock prices
  • Watchlist: Personal stock monitoring lists

Technical Analysis Tools:

  • Moving averages (SMA, EMA)
  • RSI, MACD, Bollinger Bands
  • Volume analysis
  • Support and resistance levels
  • Price alerts and notifications

πŸ”„ Stock Comparisons

Click to expand

Purpose: Side-by-side analysis of multiple stocks

  • Multi-Stock Charts: Compare up to 5 stocks simultaneously
  • Performance Metrics: Returns, volatility, ratios comparison
  • Sector Analysis: Industry-wise performance comparison
  • Risk Assessment: Beta, standard deviation analysis
  • Investment Scoring: AI-powered investment ratings

Comparison Features:

  • Customizable comparison parameters
  • Historical performance analysis
  • Peer comparison within sectors
  • Export comparison reports
  • Save comparison sets

πŸ’Ό Portfolio Management

Click to expand

Purpose: Comprehensive investment portfolio tracking

  • Portfolio Overview: Asset allocation and performance summary
  • Holdings Management: Add, edit, remove investments
  • Performance Tracking: Returns calculation with benchmarks
  • Rebalancing: Suggestions for optimal asset allocation
  • Tax Optimization: Tax-loss harvesting opportunities

Portfolio Analytics:

  • Risk-return analysis
  • Correlation analysis between holdings
  • Diversification metrics
  • Performance attribution
  • Monte Carlo simulations

🏦 Fixed Deposit Calculator

Click to expand

Purpose: FD planning and comparison tools

  • Maturity Calculator: Accurate interest calculations
  • Bank Comparison: Compare FD rates across banks
  • Ladder Strategy: Create FD laddering plans
  • Tax Calculation: Post-tax returns calculation
  • Inflation Adjustment: Real returns after inflation

Advanced FD Features:

  • Compound interest calculations
  • Quarterly/monthly payout options
  • Senior citizen rate comparisons
  • Penalty calculations for early withdrawal
  • Optimal tenure recommendations

πŸ€– AI Financial Advisor

Click to expand

Purpose: Personalized financial guidance using AI

  • Intelligent Chat: Natural language financial conversations
  • Personalized Advice: Tailored recommendations based on profile
  • Market Insights: AI analysis of market conditions
  • Goal Planning: Strategic financial goal setting
  • Risk Assessment: Personalized risk tolerance evaluation

AI Capabilities:

  • Google Gemini integration for advanced reasoning
  • Context-aware responses based on user data
  • Multi-language support
  • Voice input and output
  • Integration with portfolio data for personalized advice

πŸ“Š Analytics & Reports

Click to expand

Purpose: Comprehensive financial reporting and insights

  • Income Statements: Detailed income and expense reports
  • Net Worth Tracking: Assets and liabilities over time
  • Investment Performance: Portfolio returns and benchmarks
  • Tax Reports: Tax-related summaries and documents
  • Custom Reports: User-defined report generation

Export Options:

  • PDF reports with charts
  • Excel/CSV data export
  • Email scheduled reports
  • Print-friendly formats
  • API access for third-party tools

πŸ”§ Configuration Guide

πŸ“± Frontend Environment Variables

Create .env file in the financer/ directory:

# Firebase Configuration
VITE_FIREBASE_API_KEY=AIzaSyXXXXXXXXXXXXXXXXXXXXXXXXXX
VITE_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com
VITE_FIREBASE_PROJECT_ID=your-project-id
VITE_FIREBASE_STORAGE_BUCKET=your-project.appspot.com
VITE_FIREBASE_MESSAGING_SENDER_ID=123456789012
VITE_FIREBASE_APP_ID=1:123456789012:web:abcdef123456
VITE_FIREBASE_MEASUREMENT_ID=G-XXXXXXXXXX

# API Configuration
VITE_API_BASE_URL=http://localhost:8000
VITE_API_TIMEOUT=30000

# Feature Flags
VITE_ENABLE_ANALYTICS=true
VITE_ENABLE_CHAT=true
VITE_ENABLE_NOTIFICATIONS=true

# Development Settings
VITE_DEBUG_MODE=true
VITE_LOG_LEVEL=info

βš™οΈ Backend Environment Variables

Create .env file in the financer-backend/ directory:

# Firebase Configuration
FIREBASE_API_KEY=AIzaSyXXXXXXXXXXXXXXXXXXXXXXXXXX
FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com
FIREBASE_PROJECT_ID=your-project-id
FIREBASE_STORAGE_BUCKET=your-project.appspot.com
FIREBASE_MESSAGING_SENDER_ID=123456789012
FIREBASE_APP_ID=1:123456789012:web:abcdef123456
FIREBASE_MEASUREMENT_ID=G-XXXXXXXXXX

# Firebase Service Account (Single line JSON string)
FIREBASE_CREDENTIALS_JSON={"type":"service_account","project_id":"your-project","private_key_id":"abc123",...}

# Google AI Configuration
GOOGLE_API_KEY=AIzaSyXXXXXXXXXXXXXXXXXXXXXXXXXX

# Database Configuration
DATABASE_URL=postgresql://user:pass@localhost/financer
REDIS_URL=redis://localhost:6379

# Security Settings
JWT_SECRET_KEY=your-super-secret-jwt-key-here
JWT_ALGORITHM=HS256
JWT_EXPIRATION_HOURS=24

# API Rate Limiting
RATE_LIMIT_PER_MINUTE=100
RATE_LIMIT_PER_HOUR=1000

# External APIs
NSE_API_BASE_URL=https://www.nseindia.com
NSE_API_DELAY=1  # Seconds between requests

# Development Settings
DEBUG=true
LOG_LEVEL=INFO
CORS_ORIGINS=["http://localhost:5173","http://localhost:3000"]

πŸ”₯ Firebase Setup Guide

Step 1: Create Firebase Project

  1. Go to Firebase Console
  2. Click "Add project"
  3. Enter project name: financer-app
  4. Enable Google Analytics (optional)
  5. Create project

Step 2: Configure Authentication

  1. In Firebase Console, go to Authentication β†’ Sign-in method
  2. Enable Email/Password authentication
  3. Enable Google authentication (optional)
  4. Configure authorized domains

Step 3: Setup Firestore Database

  1. Go to Firestore Database
  2. Click "Create database"
  3. Choose Start in test mode (for development)
  4. Select closest region

Step 4: Generate Service Account

  1. Go to Project Settings β†’ Service Accounts
  2. Click "Generate new private key"
  3. Download JSON file
  4. Convert to single-line string for environment variable

Step 5: Get Web App Config

  1. Go to Project Settings β†’ General
  2. Scroll to "Your apps" section
  3. Click "Web" app icon
  4. Register app with nickname: financer-web
  5. Copy configuration values

πŸ€– Google AI Configuration

Step 1: Get API Key

  1. Visit Google AI Studio
  2. Sign in with Google account
  3. Create new API key
  4. Restrict key to specific APIs (Gemini Pro)

Step 2: Configure Quotas

  1. Go to Google Cloud Console
  2. Enable Generative AI API
  3. Configure quotas and billing
  4. Set up monitoring and alerts

πŸ“Š NSE Data Configuration

Legal Considerations

  • Ensure compliance with NSE data usage policies
  • Implement proper rate limiting
  • Add appropriate disclaimers
  • Consider data licensing agreements

Rate Limiting Setup

# Example rate limiting configuration
NSE_RATE_LIMITS = {
    "requests_per_second": 1,
    "requests_per_minute": 30,
    "requests_per_hour": 1000,
    "max_retries": 3,
    "backoff_factor": 2
}

πŸš€ Production Configuration

Environment-Specific Settings

Development

DEBUG=true
LOG_LEVEL=DEBUG
CORS_ORIGINS=["http://localhost:5173"]

Staging

DEBUG=false
LOG_LEVEL=INFO
CORS_ORIGINS=["https://staging.financer.app"]

Production

DEBUG=false
LOG_LEVEL=WARNING
CORS_ORIGINS=["https://financer.app"]
ENABLE_MONITORING=true
ENABLE_ANALYTICS=true

πŸ”’ Security Best Practices

  1. Environment Variables

    • Never commit .env files to version control
    • Use different keys for different environments
    • Rotate keys regularly
  2. Firebase Security

    • Configure Firestore security rules
    • Enable App Check for production
    • Monitor authentication anomalies
  3. API Security

    • Implement rate limiting
    • Use HTTPS in production
    • Validate all inputs
    • Implement proper error handling

πŸ“‹ Configuration Validation

Frontend Validation

# Check if all required env vars are set
npm run check-env

# Validate Firebase connection
npm run test-firebase

Backend Validation

# Validate configuration
python -c "from main import app; print('Configuration valid!')"

# Test external connections
python test.py --check-connections

πŸš€ Deployment Guide

🌐 Frontend Deployment (Vercel)

Automatic Deployment

  1. Connect Repository

    # Push your code to GitHub
    git add .
    git commit -m "Ready for deployment"
    git push origin main
  2. Vercel Setup

    • Go to Vercel Dashboard
    • Click "New Project"
    • Import your GitHub repository
    • Configure project settings:
      Framework Preset: Vite
      Root Directory: ./financer
      Build Command: npm run build
      Output Directory: dist
      
  3. Environment Variables Add all VITE_* variables in Vercel dashboard:

    • Go to Project Settings β†’ Environment Variables
    • Add each variable from your .env file
    • Ensure all environments (Production, Preview, Development) have the required variables

Manual Deployment

# Build the project
cd financer
npm run build

# Install Vercel CLI
npm i -g vercel

# Deploy
vercel --prod

βš™οΈ Backend Deployment (Vercel)

Serverless Function Setup

The backend is configured for Vercel serverless deployment with vercel.json:

{
  "version": 2,
  "builds": [
    {
      "src": "main.py",
      "use": "@vercel/python",
      "config": {
        "maxLambdaSize": "50mb"
      }
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "main.py"
    }
  ],
  "env": {
    "PYTHON_VERSION": "3.9"
  }
}

Deployment Steps

  1. Prepare Backend

    cd financer-backend
    
    # Ensure all dependencies are in requirements.txt
    pip freeze > requirements.txt
  2. Deploy to Vercel

    # Deploy backend
    vercel --prod
    
    # Note the deployment URL for frontend configuration
  3. Configure Environment Variables

    • Add all backend environment variables in Vercel dashboard
    • Ensure FIREBASE_CREDENTIALS_JSON is properly formatted
    • Test deployment with health check endpoint

🐳 Docker Deployment

Frontend Dockerfile

# Build stage
FROM node:18-alpine as build
WORKDIR /app
COPY package*.json ./
RUN npm ci --only=production
COPY . .
RUN npm run build

# Production stage
FROM nginx:alpine
COPY --from=build /app/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/nginx.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Backend Dockerfile

FROM python:3.9-slim

WORKDIR /app

COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

COPY . .

EXPOSE 8000

CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"]

Docker Compose

version: '3.8'

services:
  frontend:
    build: ./financer
    ports:
      - "3000:80"
    environment:
      - VITE_API_BASE_URL=http://localhost:8000
    depends_on:
      - backend

  backend:
    build: ./financer-backend
    ports:
      - "8000:8000"
    environment:
      - FIREBASE_API_KEY=${FIREBASE_API_KEY}
      - GOOGLE_API_KEY=${GOOGLE_API_KEY}
    volumes:
      - ./financer-backend/.env:/app/.env

  redis:
    image: redis:alpine
    ports:
      - "6379:6379"

☁️ Alternative Deployment Options

AWS Deployment

  1. Frontend (S3 + CloudFront)

    # Build and deploy to S3
    npm run build
    aws s3 sync dist/ s3://your-bucket-name --delete
    aws cloudfront create-invalidation --distribution-id YOUR_ID --paths "/*"
  2. Backend (AWS Lambda)

    # Using Serverless Framework
    npm install -g serverless
    serverless create --template aws-python3 --path financer-api
    # Configure serverless.yml and deploy
    serverless deploy

Google Cloud Platform

  1. Frontend (Firebase Hosting)

    npm install -g firebase-tools
    firebase login
    firebase init hosting
    firebase deploy
  2. Backend (Cloud Run)

    # Build and push container
    gcloud builds submit --tag gcr.io/PROJECT_ID/financer-api
    gcloud run deploy --image gcr.io/PROJECT_ID/financer-api --platform managed

Heroku Deployment

# Create Heroku apps
heroku create financer-frontend
heroku create financer-backend

# Deploy backend
cd financer-backend
git subtree push --prefix=financer-backend heroku main

# Deploy frontend (using buildpack)
cd financer
heroku buildpacks:set mars/create-react-app
git subtree push --prefix=financer heroku main

πŸ” Monitoring & Analytics

Production Monitoring

// Frontend monitoring
import { analytics } from './firebase-config';
import { logEvent } from 'firebase/analytics';

// Track user actions
logEvent(analytics, 'page_view', {
  page_title: 'Dashboard',
  page_location: window.location.href
});

Backend Monitoring

# Add monitoring endpoints
@app.get("/health")
async def health_check():
    return {
        "status": "healthy",
        "timestamp": datetime.utcnow(),
        "version": "1.0.0"
    }

@app.get("/metrics")
async def metrics():
    return {
        "requests_total": request_counter,
        "response_time_avg": avg_response_time,
        "active_users": active_user_count
    }

πŸ”§ Post-Deployment Configuration

Domain Setup

  1. Custom Domain

    • Purchase domain from registrar
    • Configure DNS records to point to deployment
    • Set up SSL certificates (usually automatic)
  2. Subdomain Structure

    https://financer.app              # Frontend
    https://api.financer.app          # Backend API
    https://admin.financer.app        # Admin panel (future)
    

Performance Optimization

  1. CDN Configuration

    • Enable global CDN for static assets
    • Configure caching headers
    • Optimize image delivery
  2. Database Optimization

    • Set up database indexes
    • Configure connection pooling
    • Enable query caching

Security Configuration

  1. HTTPS Enforcement

    // Redirect HTTP to HTTPS
    if (location.protocol !== 'https:' && location.hostname !== 'localhost') {
      location.replace(`https:${location.href.substring(location.protocol.length)}`);
    }
  2. Security Headers

    # Add security headers
    @app.middleware("http")
    async def add_security_headers(request: Request, call_next):
        response = await call_next(request)
        response.headers["X-Content-Type-Options"] = "nosniff"
        response.headers["X-Frame-Options"] = "DENY"
        response.headers["X-XSS-Protection"] = "1; mode=block"
        return response

πŸ“Š Deployment Checklist

Pre-Deployment

  • All environment variables configured
  • Database migrations completed
  • Security configurations in place
  • Performance optimizations applied
  • Error tracking configured
  • Monitoring dashboards set up

Post-Deployment

  • Health checks passing
  • All features working correctly
  • Performance metrics within targets
  • Security scans completed
  • Backup systems operational
  • Monitoring alerts configured

🀝 Contributing Guidelines

We welcome contributions from the community! Here's how you can help make Financer even better.

🌟 Ways to Contribute

  • πŸ› Bug Reports: Help us identify and fix issues
  • ✨ Feature Requests: Suggest new features and improvements
  • πŸ“ Documentation: Improve documentation and guides
  • πŸ”§ Code Contributions: Submit pull requests with fixes and features
  • 🎨 UI/UX Improvements: Enhance user experience and design
  • πŸ§ͺ Testing: Write tests and improve test coverage
  • 🌍 Localization: Help translate the app to other languages

πŸš€ Getting Started

1️⃣ Fork and Clone

# Fork the repository on GitHub
# Then clone your fork
git clone https://github.com/YOUR_USERNAME/Google-Solutions.git
cd Google-Solutions

# Add upstream remote
git remote add upstream https://github.com/Anish-2005/Google-Solutions.git

2️⃣ Create Feature Branch

# Create and checkout feature branch
git checkout -b feature/your-feature-name

# Or for bug fixes
git checkout -b bugfix/issue-description

3️⃣ Set Up Development Environment

# Install dependencies for both frontend and backend
cd financer && npm install
cd ../financer-backend && pip install -r requirements.txt

# Copy environment files
cp .env.example .env  # Configure with your keys

πŸ“‹ Development Standards

Code Style & Formatting

Frontend (React/JavaScript)

# Use ESLint and Prettier
npm run lint          # Check for linting errors
npm run lint:fix      # Auto-fix linting issues
npm run format        # Format code with Prettier

Backend (Python)

# Use Black and Flake8
black .               # Format Python code
flake8 .             # Check for style issues
mypy .               # Type checking

Commit Message Convention

We follow Conventional Commits:

# Format: <type>[optional scope]: <description>

# Examples:
feat: add expense categorization feature
fix: resolve authentication timeout issue
docs: update API documentation
style: format code with prettier
refactor: optimize stock data fetching
test: add unit tests for portfolio calculations
chore: update dependencies

Commit Types:

  • feat: New features
  • fix: Bug fixes
  • docs: Documentation changes
  • style: Code formatting (no functional changes)
  • refactor: Code refactoring
  • test: Adding or updating tests
  • chore: Maintenance tasks

Pull Request Guidelines

  1. Before Submitting

    • Code follows project style guidelines
    • All tests pass locally
    • Documentation updated if needed
    • No console errors or warnings
    • Performance impact considered
  2. PR Title Format

    [Type] Brief description of changes
    
    Examples:
    [Feature] Add dark mode support
    [Fix] Resolve stock price update bug
    [Docs] Update deployment guide
    
  3. PR Description Template

    ## Description
    Brief description of what this PR does.
    
    ## Type of Change
    - [ ] Bug fix (non-breaking change which fixes an issue)
    - [ ] New feature (non-breaking change which adds functionality)
    - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
    - [ ] Documentation update
    
    ## Testing
    - [ ] Unit tests pass
    - [ ] Integration tests pass
    - [ ] Manual testing completed
    
    ## Screenshots (if applicable)
    Add screenshots to help explain your changes.
    
    ## Checklist
    - [ ] My code follows the style guidelines
    - [ ] I have performed a self-review
    - [ ] I have commented my code where necessary
    - [ ] I have updated the documentation
    - [ ] My changes generate no new warnings

πŸ§ͺ Testing Requirements

Frontend Testing

# Run all tests
npm test

# Run tests with coverage
npm run test:coverage

# Run tests in watch mode
npm run test:watch

Testing Standards:

  • Write unit tests for utility functions
  • Add integration tests for components
  • Test user interactions and flows
  • Maintain >80% code coverage

Backend Testing

# Run tests
python -m pytest

# Run with coverage
python -m pytest --cov=.

# Run specific test file
python -m pytest tests/test_auth.py

Testing Standards:

  • Test all API endpoints
  • Mock external services
  • Test error scenarios
  • Validate input/output schemas

πŸ› Bug Reports

Use the bug report template:

**Bug Description**
A clear description of what the bug is.

**Steps to Reproduce**
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

**Expected Behavior**
What you expected to happen.

**Screenshots**
Add screenshots if applicable.

**Environment:**
- OS: [e.g. Windows 10]
- Browser: [e.g. Chrome 91]
- Version: [e.g. 1.0.0]

**Additional Context**
Any other context about the problem.

✨ Feature Requests

Use the feature request template:

**Feature Description**
A clear description of what you want to happen.

**Problem Statement**
What problem does this solve?

**Proposed Solution**
Describe your proposed solution.

**Alternatives Considered**
Other solutions you've considered.

**Additional Context**
Screenshots, mockups, or other context.

πŸ—οΈ Development Workflow

1️⃣ Issue Assignment

  • Comment on issues you'd like to work on
  • Wait for assignment before starting work
  • Ask questions if requirements are unclear

2️⃣ Development Process

# Keep your fork updated
git fetch upstream
git checkout main
git merge upstream/main

# Create feature branch
git checkout -b feature/awesome-feature

# Make your changes
# ... code, test, commit ...

# Push to your fork
git push origin feature/awesome-feature

# Create Pull Request on GitHub

3️⃣ Code Review Process

  • All PRs require at least one review
  • Address review feedback promptly
  • Maintain discussion in PR comments
  • Update documentation if needed

🎯 Areas for Contribution

High Priority

  • Mobile responsiveness improvements
  • Performance optimizations
  • Accessibility enhancements
  • Test coverage improvements
  • Error handling and user feedback

Medium Priority

  • Additional chart types for data visualization
  • More stock analysis indicators
  • Portfolio optimization algorithms
  • Internationalization (i18n)
  • Dark mode implementation

Future Features

  • Mobile app development
  • Advanced AI features
  • Social trading features
  • Integration with more data sources
  • Advanced portfolio analytics

πŸ‘₯ Community Guidelines

Code of Conduct

  • Be respectful and inclusive
  • Help others learn and grow
  • Provide constructive feedback
  • Focus on what's best for the community
  • Show empathy towards other contributors

Communication Channels

  • GitHub Issues: Bug reports, feature requests
  • GitHub Discussions: General questions, ideas
  • Pull Requests: Code reviews, technical discussions

πŸ† Recognition

Contributors Wall

All contributors will be recognized in:

  • README.md contributors section
  • Project documentation
  • Release notes for significant contributions
  • Special badges for regular contributors

Types of Recognition

  • πŸ₯‡ Gold Contributors: Major features or significant improvements
  • πŸ₯ˆ Silver Contributors: Multiple quality contributions
  • πŸ₯‰ Bronze Contributors: First-time or smaller contributions
  • πŸ› Bug Hunters: Excellent bug reports and fixes
  • πŸ“ Documentation Heroes: Significant documentation improvements

πŸ“š Resources for Contributors

Learning Resources

Development Tools

Thank you for contributing to Financer! Together, we're building the future of personal finance management. πŸš€

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.

οΏ½ License Summary

The MIT License is a permissive license that allows you to:

βœ… Use - Use the software for any purpose
βœ… Modify - Make changes to the source code
βœ… Distribute - Share the original or modified software
βœ… Private Use - Use the software privately
βœ… Commercial Use - Use the software for commercial purposes

Requirements:

  • Include the original license and copyright notice

Limitations:

  • No warranty or liability from the authors

οΏ½πŸ‘¨β€πŸ’» Author & Team

🌟 Project Creator

Anish

🀝 Contributors

Made with contrib.rocks.

πŸ† Special Thanks

  • πŸ₯‡ Major Contributors: (Contributors with 10+ commits)
  • πŸ₯ˆ Active Contributors: (Contributors with 5+ commits)
  • πŸ₯‰ Community Contributors: (First-time contributors)
  • πŸ› Bug Hunters: (Excellent bug reports and fixes)
  • πŸ“ Documentation Heroes: (Significant documentation improvements)

πŸ’‘ Inspiration & Credits

This project was inspired by the need for accessible, intelligent financial tools. Special thanks to:

  • Firebase Team for robust authentication and database services
  • Google AI Team for powerful Gemini AI capabilities
  • FastAPI Community for excellent documentation and support
  • React Team for continuous innovation in frontend development
  • Open Source Community for countless libraries and tools

πŸ™ Acknowledgments

πŸ”§ Technology Partners

πŸ“š Educational Resources

🎨 Design & Assets

πŸ§ͺ Testing & Quality

  • Jest - JavaScript testing framework
  • PyTest - Python testing framework
  • ESLint - JavaScript linting
  • Prettier - Code formatting

🌟 Star History

Star History Chart

πŸ“ˆ Project Stats

GitHub repo size GitHub code size in bytes GitHub commit activity GitHub last commit GitHub contributors

πŸ”— Related Projects

πŸ’¬ Community & Support

πŸ†˜ Getting Help

  1. πŸ“– Documentation: Check the comprehensive docs in this README
  2. πŸ› Issues: Report bugs or request features via GitHub Issues
  3. πŸ’‘ Discussions: Join community discussions for questions and ideas
  4. πŸ“§ Direct Contact: Reach out to the maintainer for urgent matters

🀝 Community Guidelines

  • Be respectful and constructive in all interactions
  • Help others learn and grow in the community
  • Share knowledge and best practices
  • Follow the code of conduct in all communications

πŸ“’ Stay Updated

  • ⭐ Star this repository to show support
  • πŸ‘€ Watch to get notified of updates
  • 🍴 Fork to contribute or customize
  • πŸ“± Follow @Anish-2005 for updates

πŸš€ Ready to Transform Your Financial Future?

Get Started Now β€’ View Demo β€’ Join Community

Built with ❀️ by Anish and the open source community

"Empowering financial decisions through technology and AI"


Footer Image

About

πŸ’° Financer - A modern full-stack personal finance management platform with AI-powered insights, real-time stock analysis, and comprehensive expense tracking. Built with React 19, FastAPI, Firebase, and Google Gemini AI.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •