Site Analytics

PreviousENS Configuration NextVerify Smart Contracts

Last updated 1 year ago

Was this helpful?

Site Analytics

So you want to know what your users have been up to...

Fortunately, dAppling has an analytics package to make configuring your site analytics quick and easy!

Install dappling-analytics in your project

Add the as a module within your project's repository. This is a very simple package that tracks page views and unique users across your site.

Quickstart

Add the dappling-analytics package to your project

npm i dappling-analytics
yarn add dappling-analytics

Inject the Analytics component into your app by adding it to your project's root (make sure to import it from the react directory). This component injects a script into your app every time a page loads that tracks the page view and user information. The information is sent to and stored in dAppling's database and displayed in the Analytics tab of your project.

import { Analytics } from 'dappling-analytics/react'

Re-deploy your app to and see your garden growing.

Example

If you are using a Next.js project, import and add the Analytics component to your root.

import "./globals.css";
import type { Metadata } from "next";
import { Inter } from "next/font/google";
import { Analytics } from "dappling-analytics/react";

const inter = Inter({ subsets: ["latin"] });

export const metadata: Metadata = {
  title: "Create Next App",
  description: "Generated by create next app",
};

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body className={inter.className}>
        {children}
        <Analytics />
      </body>
    </html>
  );
}

Your site is now configured with site analytics and you can watch the views roll in!

Analytics Panel

PreviousENS Configuration NextVerify Smart Contracts

Last updated 1 year ago

Was this helpful?

import "./globals.css"; import type { Metadata } from "next"; import { Inter } from "next/font/google"; import { Analytics } from "dappling-analytics/react"; const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { title: "Create Next App", description: "Generated by create next app", }; export default function RootLayout({ children, }: { children: React.ReactNode; }) { return ( <html lang="en"> <body className={inter.className}> {children} <Analytics /> </body> </html> ); }