ucoder-insight

v1.1.1

Published

18 days ago

A privacy-first, cookie-free, and lightweight web analytics SDK for React, Next.js, Vanilla JavaScript, and SPA applications. Developer-friendly and easy to integrate.

0High
0Medium
0Low

soumyadip_maity

analytics web-analytics tracking react-analytics nextjs-analytics privacy-first cookie-free events-tracker performance-monitoring web-vitals spa-analytics sdk ucoder ucoder-insight

Features

Lightweight & Fast - Minimal bundle size with zero dependencies
Real-time Analytics - Track user behavior, events, and custom metrics
Privacy-First - GDPR compliant with built-in consent management
Custom Events - Track anything from clicks to complex user journeys
Cross-Platform - Works seamlessly on web, mobile, and desktop
Framework Agnostic - Works with React, Vue, Angular, Next.js, and vanilla JS
Easy Integration - Get started in under 2 minutes
Advanced Insights - User sessions, funnels, retention, and more
Geo-location - Automatic location detection and tracking
Bot Detection - Filters out bot traffic automatically

Installation

npm

npm install ucoder-insight

yarn

yarn add ucoder-insight

pnpm

pnpm add ucoder-insight

CDN

<script src="https://cdn.jsdelivr.net/npm/ucoder-insight@latest/dist/index.global.js"></script>

Quick Start

1. Get Your API Key

2. Initialize the SDK

JavaScript / TypeScript

import { initUcoderInsight } from "ucoder-insight";

initUcoderInsight("YOUR_TRACKING_ID", {
  notTrackPath: ["/privacy", "/terms", "/admin/*"], // all pages under /admin will be ignored
});

React

import { useEffect } from "react";
import { initUcoderInsight } from "ucoder-insight";

function App() {
  useEffect(() => {
    initUcoderInsight("YOUR_TRACKING_ID", {
      notTrackPath: ["/privacy", "/terms", "/admin/*"], // all pages under /admin will be ignored
    });
  }, []);

  return <div>Your App</div>;
}

Next.js (App Router)

Create a client component for analytics first:

// app/components/Analytics.tsx
"use client";
import { useEffect } from "react";
import { initUcoderInsight } from "ucoder-insight";

export default function Analytics() {
  useEffect(() => {
    initUcoderInsight("YOUR_TRACKING_ID", {
      notTrackPath: ["/privacy", "/terms", "/admin/*"],
      debug: process.env.NODE_ENV !== "production", // Optional: helps in local dev
    });
  }, []);

  return null;
}

Then include it in your root layout:

// app/layout.tsx
import Analytics from "./components/Analytics";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Analytics />
      </body>
    </html>
  );
}

Vue 3

// main.js
import { createApp } from "vue";
import { initUcoderInsight } from "ucoder-insight";
import App from "./App.vue";

initUcoderInsight("YOUR_TRACKING_ID", {
  notTrackPath: ["/privacy", "/terms", "/admin/*"], // all pages under /admin will be ignored
});

createApp(App).mount("#app");

Vanilla JavaScript

<!DOCTYPE html>
<html>
  <head>
    <script src="https://cdn.jsdelivr.net/npm/ucoder-insight@latest/dist/index.global.js"></script>
  </head>
  <body>
    <script>
      UcoderInsight.init("YOUR_TRACKING_ID", {
        notTrackPath: ["/privacy", "/terms", "/admin/*"], // all pages under /admin will be ignored
      });
    </script>
  </body>
</html>

Usage

Track Custom Events

import { trackCustomEvent } from "ucoder-insight";

// Simple event
trackCustomEvent("button_click");

// Event with properties
trackCustomEvent({
  event_name: "email_input_clicked",
  action_category: "interaction",
  object_id: "email_input_field",
  status: "success",
});

Dashboard Features

Visit insights.ucoder.in to access:

Real-user Analytics - Track real users
User Segments - Create custom user segments
Retention - Analyze user retention rates
Geo Analytics - Location-based insights
Device Breakdown - Browser, OS, device stats
Custom Reports - Build your own reports

Contributing

Contributions are welcome! Please read our Contributing Guide first.

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

Changelog

See https://insights.ucoder.in/docs/changelog for release history.

Bug Reports

Found a bug? Please open an issue on GitHub with:

Clear description of the issue
Steps to reproduce
Expected vs actual behavior
Browser/environment details
Code examples (if applicable)

Support

Documentation
Email: [email protected]

License

MIT License - see LICENSE file for details.

Acknowledgments

Built with ❤️ by the UCoder team
Inspired by modern analytics tools
Thanks to all contributors!