📈 Web Analytics

A lightweight, privacy-focused web analytics tracking server built with Node.js and PostgreSQL. Track website visits, analyze user behavior, and generate beautiful SVG charts - all without compromising user privacy.

✨ Features

• Real-time Visit Tracking: Capture page visits with detailed metadata
• Multi-site Support: Track analytics for multiple websites from a single instance
• Beautiful SVG Charts: Generate dynamic spline charts with neon-glow effects
• Comprehensive Analytics:
  • Visits over time
  • Top pages analysis
  • Site-by-site breakdown
  • Unique visitor tracking
  • Referrer tracking
• Privacy-Focused: IP address tracking with minimal data collection
• RESTful API: Easy integration with any frontend
• PostgreSQL Backend: Reliable and scalable data storage
• CORS Enabled: Cross-origin resource sharing support
• Render.com Ready: Pre-configured deployment setup

🚀 Quick Start

Prerequisites

• Node.js 16+
• PostgreSQL database
• npm or yarn

Installation

1. Clone the repository:

git clone https://github.com/Mohinth-32/Web-Analytics.git
cd Web-Analytics

2. Install dependencies:

npm install

3. Create a .env file in the root directory:

DATABASE_URL=postgresql://username:password@host:port/database
PORT=3000

4. Set up your PostgreSQL database with the required schema:

CREATE TABLE site_visits (
  id SERIAL PRIMARY KEY,
  site VARCHAR(255) NOT NULL,
  page VARCHAR(500) NOT NULL,
  referrer VARCHAR(500),
  user_agent TEXT,
  ip_address VARCHAR(45),
  screen VARCHAR(50),
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

-- Create indexes for better query performance
CREATE INDEX idx_site_visits_created_at ON site_visits(created_at);
CREATE INDEX idx_site_visits_site ON site_visits(site);
CREATE INDEX idx_site_visits_page ON site_visits(page);

5. Start the server:

npm start

The server will run on http://localhost:3000

📡 API Endpoints

Health Check

GET /

Returns server status

Track Visit

POST /track
Content-Type: application/json

{
  "site": "example.com",
  "page": "/home",
  "referrer": "https://google.com",
  "userAgent": "Mozilla/5.0...",
  "screen": "1920x1080"
}

Analytics Endpoints

Get Visits Over Time

GET /analytics/visits-over-time?site=example.com&days=30

Returns daily visit counts for the specified period.

Query Parameters:

• site (optional): Filter by specific site
• days (optional, default: 30): Number of days to analyze

Get Visits by Site

GET /analytics/by-site?days=30

Returns visit counts grouped by site.

Query Parameters:

• days (optional, default: 30): Number of days to analyze

Get SVG Chart

GET /analytics/by-site/svg?days=30

Returns a beautiful SVG spline chart showing visits by site.

Query Parameters:

• days (optional, default: 30): Number of days to visualize

Features:

• Neon green color scheme
• Smooth spline curves
• Dynamic scaling
• Labeled data points

Get Top Pages

GET /analytics/top-pages?site=example.com&days=30&limit=10

Returns the most visited pages.

Query Parameters:

• site (optional): Filter by specific site
• days (optional, default: 30): Number of days to analyze
• limit (optional, default: 10, max: 1000): Maximum number of results

Get All Visits

GET /analytics/visits?site=example.com&page=/home&days=30&limit=100&offset=0

Returns detailed visit records with pagination.

Query Parameters:

• site (optional): Filter by specific site
• page (optional): Filter by specific page
• days (optional, default: 30): Number of days to analyze
• limit (optional, default: 100, max: 1000): Results per page
• offset (optional, default: 0): Pagination offset

Get Summary Statistics

GET /analytics/summary?site=example.com&days=30

Returns aggregated statistics.

Response:

{
  "total_visits": "1234",
  "total_sites": "5",
  "total_pages": "42",
  "unique_visitors": "890"
}

🔧 Integration Example

JavaScript Snippet

Add this to your website to track page visits:

<script>
  // Track page view
  fetch('https://your-analytics-server.com/track', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      site: window.location.hostname,
      page: window.location.pathname,
      referrer: document.referrer,
      userAgent: navigator.userAgent,
      screen: `${window.screen.width}x${window.screen.height}`
    })
  }).catch(err => console.error('Analytics error:', err));
</script>

React Hook Example

import { useEffect } from 'react';

const useAnalytics = () => {
  useEffect(() => {
    const trackPageView = async () => {
      try {
        await fetch('https://your-analytics-server.com/track', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({
            site: window.location.hostname,
            page: window.location.pathname,
            referrer: document.referrer,
            userAgent: navigator.userAgent,
            screen: `${window.screen.width}x${window.screen.height}`
          })
        });
      } catch (error) {
        console.error('Analytics tracking failed:', error);
      }
    };

    trackPageView();
  }, []);
};

export default useAnalytics;

🌐 Deployment

Deploy to Render.com

This project includes a render.yaml configuration file for easy deployment:

1. Push your code to GitHub
2. Connect your repository to Render.com
3. Render will automatically detect the render.yaml file
4. Set the DATABASE_URL environment variable in Render dashboard
5. Deploy!

Environment Variables

Required environment variables:

• DATABASE_URL: PostgreSQL connection string
• PORT: Server port (automatically set by most hosting platforms)

🛠️ Tech Stack

• Node.js: Runtime environment
• Express: Web framework
• PostgreSQL: Database
• Postgres.js: PostgreSQL client
• CORS: Cross-origin resource sharing
• dotenv: Environment variable management

📊 Database Schema

Table: site_visits
┌──────────────┬──────────────┬─────────────┐
│ Column       │ Type         │ Constraints │
├──────────────┼──────────────┼─────────────┤
│ id           │ SERIAL       │ PRIMARY KEY │
│ site         │ VARCHAR(255) │ NOT NULL    │
│ page         │ VARCHAR(500) │ NOT NULL    │
│ referrer     │ VARCHAR(500) │             │
│ user_agent   │ TEXT         │             │
│ ip_address   │ VARCHAR(45)  │             │
│ screen       │ VARCHAR(50)  │             │
│ created_at   │ TIMESTAMP    │ DEFAULT NOW │
└──────────────┴──────────────┴─────────────┘