{"library":"logrocket","title":"LogRocket JavaScript SDK","description":"LogRocket's JavaScript SDK, currently at version 12.1.0, provides a comprehensive solution for front-end monitoring, session replay, and product analytics. It allows development and product teams to reproduce user issues by replaying sessions pixel-perfectly, alongside integrated technical context such as console logs, network requests, and Redux state changes. This SDK differentiates itself by its strong focus on engineering-grade debugging, offering detailed diagnostic insights into client-side errors and performance issues. While a fixed release cadence isn't explicitly published, the package undergoes regular updates with new features and improvements. A key feature is its ability to automatically detect user frustration signals like rage clicks and dead clicks, and its robust data privacy features include default obfuscation of sensitive information, with configurable options for granular control over what data is collected and sent to the servers. It integrates with various tools like Sentry, Jira, and Google Analytics to streamline developer workflows and provide a holistic view of user experience.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install logrocket"],"cli":null},"imports":["import LogRocket from 'logrocket';","import LogRocket from 'logrocket';\nLogRocket.init('YOUR_APP_ID');","import LogRocket from 'logrocket';\nLogRocket.identify('user-id', { name: 'John Doe', email: 'john.doe@example.com' });","import LogRocket from 'logrocket';\nimport { createStore, applyMiddleware } from 'redux';\nimport { reduxMiddleware } from '@logrocket/redux';\n\nconst store = createStore(rootReducer, applyMiddleware(LogRocket.reduxMiddleware));"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import LogRocket from 'logrocket';\nimport { reduxMiddleware } from '@logrocket/redux';\nimport { createStore, applyMiddleware, combineReducers } from 'redux';\n\ninterface AppState {\n  counter: number;\n  message: string;\n}\n\nconst counterReducer = (state = 0, action: { type: string }) => {\n  switch (action.type) {\n    case 'INCREMENT': return state + 1;\n    case 'DECREMENT': return state - 1;\n    default: return state;\n  }\n};\n\nconst messageReducer = (state = '', action: { type: string, payload?: string }) => {\n  switch (action.type) {\n    case 'SET_MESSAGE': return action.payload || '';\n    default: return state;\n  }\n};\n\nconst rootReducer = combineReducers<AppState>({\n  counter: counterReducer,\n  message: messageReducer\n});\n\n// Replace with your actual LogRocket App ID\nconst LOGROCKET_APP_ID = process.env.LOGROCKET_APP_ID || 'your/app-id';\n\n// Initialize LogRocket\nLogRocket.init(LOGROCKET_APP_ID, {\n  // Optional: Configure specific options\n  console: {\n    isEnabled: true,\n    shouldAggregateConsoleErrors: true,\n  },\n  network: {\n    isEnabled: true,\n    requestSanitizer: (request) => {\n      // Redact sensitive headers, e.g., Authorization\n      if (request.headers?.Authorization) {\n        request.headers.Authorization = 'Bearer [Redacted]';\n      }\n      return request;\n    },\n  },\n  dom: {\n    // Optional: Redact elements containing sensitive data\n    // For example, an element with data-lr-hide will not be recorded\n    baseHref: '/', // Specify if your app uses a base href\n  }\n});\n\n// Identify the user after initialization\nLogRocket.identify('unique-user-id-123', {\n  name: 'Jane Doe',\n  email: 'jane.doe@example.com',\n  subscriptionType: 'premium',\n  // Custom user traits for filtering sessions\n  'user-type': 'admin'\n});\n\n// Integrate Redux middleware (must be after LogRocket.init)\nconst store = createStore(rootReducer, applyMiddleware(reduxMiddleware));\n\n// Simulate some actions\nstore.dispatch({ type: 'INCREMENT' });\nstore.dispatch({ type: 'INCREMENT' });\nstore.dispatch({ type: 'SET_MESSAGE', payload: 'User clicked increment twice' });\n\ntry {\n  throw new Error('This is a test error to see in LogRocket!');\n} catch (error) {\n  LogRocket.error(error);\n}\n\nconsole.log('LogRocket initialized and user identified. Check your dashboard for the session.');\n\n// Example of sending a custom event\nLogRocket.track('Product View', { productId: 'ABC-123', category: 'Electronics' });\n\n// This is client-side code, typically run in a browser environment.\n// Ensure to include your actual LogRocket App ID from your project settings.\n","lang":"typescript","description":"This quickstart demonstrates how to initialize LogRocket, identify a user with custom traits, integrate the Redux middleware, and manually log errors and track custom events. It highlights privacy configuration for network requests.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}