{"id":17869243,"url":"https://github.com/Progressive-Insurance/oculr-ngx","last_synced_at":"2025-03-21T11:32:17.620Z","repository":{"id":37928984,"uuid":"413610442","full_name":"Progressive-Insurance/oculr-ngx","owner":"Progressive-Insurance","description":"An analytics library that makes collecting data in an Angular app simple.","archived":false,"fork":false,"pushed_at":"2024-09-26T15:34:15.000Z","size":2157,"stargazers_count":8,"open_issues_count":7,"forks_count":2,"subscribers_count":6,"default_branch":"main","last_synced_at":"2024-09-26T15:39:13.938Z","etag":null,"topics":["analytics","angular","library"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Progressive-Insurance.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":"CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-10-04T23:16:52.000Z","updated_at":"2024-09-26T15:32:36.000Z","dependencies_parsed_at":"2024-05-02T15:58:57.973Z","dependency_job_id":"8dbbf52e-c679-4852-984d-b26dd3573bf6","html_url":"https://github.com/Progressive-Insurance/oculr-ngx","commit_stats":{"total_commits":159,"total_committers":6,"mean_commits":26.5,"dds":0.5849056603773585,"last_synced_commit":"6aa6cc1491bc5af1c81fc8b17f13d161d82e9be5"},"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Progressive-Insurance%2Foculr-ngx","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Progressive-Insurance%2Foculr-ngx/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Progressive-Insurance%2Foculr-ngx/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Progressive-Insurance%2Foculr-ngx/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Progressive-Insurance","download_url":"https://codeload.github.com/Progressive-Insurance/oculr-ngx/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221814842,"owners_count":16885071,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["analytics","angular","library"],"created_at":"2024-10-28T10:01:13.430Z","updated_at":"2024-10-28T10:02:33.062Z","avatar_url":"https://github.com/Progressive-Insurance.png","language":"TypeScript","funding_links":[],"categories":["Development Utilities"],"sub_categories":["Analytics"],"readme":"# oculr-ngx\n\nAn analytics library that makes collecting data in an Angular app simple.\n\n![build workflow](https://github.com/progressive-insurance/oculr-ngx/actions/workflows/build.yml/badge.svg) ![publish workflow](https://github.com/progressive-insurance/oculr-ngx/actions/workflows/publish.yml/badge.svg)\n\n## What does it do?\n\nOculr is an Angular library that helps you capture analytic events occurring in your app. The following features give you insight into what your users are doing in your app and how your app is handling data and errors in the background.\n\n- [Page views](docs/page-views.md)\n- [API calls](docs/http-interceptor.md)\n- [Errors](docs/app-error-event.md)\n- [Content display](docs/display-directive.md)\n- [Button and link interactions](docs/click-directive.md)\n- [Form control interactions](docs/change-directive.md)\n- [Sensitive information control interactions](docs/focus-directive.md)\n- [General app events](docs/app-event.md)\n\n## How can it help?\n\nOculr helps you know what you don't know.\n\nAre your users finding the content you want them to? Are they getting stuck on a page or question? Is your app making redundant calls to an API? Is a feature not working leading to a subpar experience? These are just some of the questions Oculr can help answer.\n\n## Where does the data go?\n\nWhere you want it.\n\nOculr can point to any destination that you want to use for tracking analytic data. By default it comes with a couple [preconfigured options](docs/init-and-config.md#available-destinations) for HTTP APIs and the console. Oculr also features the ability to [shape the data](docs/init-and-config.md#using-your-own-custom-event-object) based on your needs before being sent to an API.\n\n## Quick start\n\nInstall Oculr.\n\n```console\nnpm install oculr-ngx --save\n```\n\nImport Oculr to your app's Angular `AppModule`.\n\n```typescript\nimport { OculrAngularModule } from 'oculr-ngx';\n\n@NgModule({\n  imports: [OculrAngularModule.forRoot()],\n})\nexport class AppModule {}\n```\n\nConfigure Oculr during app initialization in `AppModule`.\n\n```typescript\nimport { ConfigurationService, Destinations } from 'oculr-ngx';\n\n@NgModule({\n  providers: [\n    {\n      provide: APP_INITIALIZER,\n      useFactory: initializeAppFactory,\n      deps: [ConfigurationService],\n      multi: true,\n    },\n  ],\n})\nexport class AppModule {}\n\nfunction initializeAppFactory(oculrConfigService: ConfigurationService): () =\u003e Observable\u003cboolean\u003e {\n  oculrConfigService.loadAppConfig({\n    logHttpTraffic: true,\n    destinations: [\n      {\n        name: Destinations.Console,\n        sendCustomEvents: false,\n      },\n    ],\n  });\n  return () =\u003e of(true);\n}\n```\n\nThen add the `oculrClick` directive to any button in your app.\n\n```html\n\u003cbutton id=\"continue\" oculrClick\u003eContinue\u003c/button\u003e\n```\n\nRun your app and you will see an analytic event get logged to your console when clicking the button.\n\nNow that it's working you will likely want it to do more then log a single click to your console. Please check out our [Full API](docs/README.md) for more hands-on details to get the most out of Oculr.\n\n## Documentation\n\n- [Full API](docs/README.md)\n- [Configuration](docs/init-and-config.md)\n- [Directives](docs/README.md#Directives)\n- [Services](docs/README.md#Services)\n\n## Updates\n\n- [Check out our improvements](CHANGELOG.md)\n- [See our latest release](https://github.com/progressive-insurance/oculr-ngx/releases/latest)\n\n## Contributing\n\n### Want to help?\n\nWe're excited about your interest in the project. Have an idea, want to contribute some code, found a bug, expand some documentation? Awesome! Check out our [contribution guide](CONTRIBUTING.md) and then take a look at our [issues](https://github.com/progressive-insurance/oculr-ngx/issues) and [discussions](https://github.com/progressive-insurance/oculr-ngx/discussions). We recommend issues that have been labeled as `help wanted` or `good first issue`.\n\n### Local setup\n\nLocal setup and a quick few steps.\n\n```node\ngit clone https://github.com/progressive-insurance/oculr-ngx\ncd oculr-ngx\nnpm install\nnpm run test\n```\n\nWe recommend the following extensions to make the contribution process as seamless as possible.\n\n- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)\n- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)\n\n### Code of conduct\n\nHelp us make this project open and inclusive. Please follow our [Code of Conduct](CODE_OF_CONDUCT.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FProgressive-Insurance%2Foculr-ngx","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FProgressive-Insurance%2Foculr-ngx","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FProgressive-Insurance%2Foculr-ngx/lists"}