JSPM

  • Created
  • Published
  • Downloads 879416
  • Score
    100M100P100Q195278F
  • License MIT

Package Exports

  • @segment/analytics-next

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@segment/analytics-next) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

analytics-next

Client Side Instrumentation Platform.

Get started

Using with Segment

  1. Create a javascript source at https://app.segment.com Segment automatically generates a JS snippet that you can add to your website. (for more information visit our documentation).

  2. Start tracking!

Using as an NPM package

  1. Install the package
yarn add @segment/analytics-next
  1. Import the package into your project and you're good to go (with working types)! Example react app:
import { Analytics, AnalyticsBrowser, Context } from '@segment/analytics-next'
import { useEffect, useState } from 'react'
import logo from './logo.svg'

function App() {
  const [analytics, setAnalytics] = useState<Analytics | undefined>(undefined)
  const [writeKey, setWriteKey] = useState('<YOUR_WRITE_KEY>')

  useEffect(() => {
    const loadAnalytics = async () => {
      let [response] = await AnalyticsBrowser.load({ writeKey })
      setAnalytics(response)
    }
    loadAnalytics()
  }, [writeKey])

  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          onClick={(e) => {
            e.preventDefault()
            analytics?.track('Hello world')
          }}
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Track
        </a>
      </header>
    </div>
  )
}

export default App

Development

$ git clone git@github.com:segmentio/analytics-next.git
$ cd analytics-next
$ make dev

Testing

The tests are written in Jest and can be run be using make test-unit Linting is done using ESLint and can be run using make lint.

Unit Testing

Please write small, and concise unit tests for every feature you work on.

$ make test-unit # runs all tests
$ yarn jest src/<path> # runs a specific test or tests in a folder