Activation

The Uniform tracker handles visitor classification. It is a component that runs on the visitor's device. As a result, the approach used to add the tracker to an application depends on the technology used to build the front-end.

Add Context to app

In Uniform, the Context object handles tracking visitor activity. Adding this object to your application enables tracking.

React

1. Add the following npm packages to your application:

   @uniformdev/context 
   @uniformdev/context-react
   About this step

   This adds references to the packages for React apps that need to use Context. For more information on these packages, see npm package reference.

2. Generate the manifest for your Uniform project.

3. Add the following code to your app component.

   /pages/_app.jsx

   import { 
     Context, 
   } from "@uniformdev/context";
   import { UniformContext } from "@uniformdev/context-react";
   import manifest from "../lib/uniform/contextManifest.json";
   
   const context = new Context({
   });
   
   function MyApp({
     Component,
     pageProps,
   }) {
     return (
       <Component {...pageProps} />
     );
   }
   
   export default MyApp;
   About this step

   This creates the context object that is used to configure how the tracker works. For more information about this component, see the Context type reference.

4. Add the following code:

   /pages/_app.jsx

   import { 
     Context, 
   } from "@uniformdev/context";
   import manifest from "../lib/uniform/contextManifest.json";
   
   const context = new Context({
     manifest,
   });
   
   ...

5. Add the following code:

   /pages/_app.jsx

   import { 
     Context, 
   } from "@uniformdev/context";
   import manifest from "../lib/uniform/contextManifest.json";
   
   const context = new Context({
     defaultConsent: true,
     manifest,
   });
   
   ...
   About this step

   For more information, see the compliance and consent capability.

6. Add the following code:

   /pages/_app.jsx

   import { 
     Context, 
   } from "@uniformdev/context";
   import { UniformContext } from "@uniformdev/context-react";
   import manifest from "../lib/uniform/contextManifest.json";
   
   const context = new Context({
     defaultConsent: true,
     manifest,
   });
   
   function MyApp({
     Component,
     pageProps,
   }) {
     return (
       <UniformContext context={context}>
         <Component {...pageProps} />
       </UniformContext>
     );
   }
   
   export default MyApp;
   About this step

   This creates a custom React context object that components in the app can use to access to the context. For more information about this component, see the Context component reference.

By adding the context to your app, you have activated the Uniform tracker. The tracker runs automatically when the app is loaded and when the route changes.

tip

If you want to be able to see the activity captured during the tracking process, you should enable Uniform dev tools.