Setting Google Analytics with react, redux, material-ui etc.

maruware — Wed, 14 Mar 2018 11:45:16 +0000

Installation

yarn add react-ga

Code

Initialize

import ReactGA from 'react-ga'
ReactGA.initialize('UA-000000-01')

Bind react-router

export const history = createHistory()
history.listen((location, action) => {
  ReactGA.set({ page: location.pathname })
  ReactGA.pageview(location.pathname)
})

Record material-ui/Popover

import React from 'react'
import ReactGA from 'react-ga'
import Popover from 'material-ui/Popover'

export default ({name, ...rest}) => {
  return (
    <Popover
      onEntered={() => ReactGA.modalview(name)}
      {...rest}
    />
  )
}

Record material-ui/Dialog

import React from 'react'
import ReactGA from 'react-ga'
import Dialog from 'material-ui/Dialog'

export default ({name, ...rest}) => {
  return (
    <Dialog
      onEntered={() => ReactGA.modalview(name)}
      {...rest}
    />
  )
}

DEV Community: maruware

Setting Google Analytics with react, redux, material-ui etc.

Installation

Code

Initialize

Bind react-router

Record material-ui/Popover

Record material-ui/Dialog