@nivalit/web-logger-react v1.1.0

Web Logger React Context

Small React package to create a facade that communicates with WebLogger service. Provides useLogger hook that allow user to send diagnostic data and map them to GELF format.

🧭 Usage

npm --save @nivalit/web-logger-react

Add Provider to your app root component:

function App() {
  return (
    <LoggerProvider
      type="EXTERNAL"
      options={{ host: "https://logger.acme.com:9000", logLevel: "WARNING" }}
    >
      <h1>Web Logger</h1>
    </LoggerProvider>
  );
}

Use in any your component by context hook:

function Children() {

  logger = useLogger()

  const createPost = (id: string) => {
    try {
      logger.debug(`Post - Create new with id=${id}`)
      ...
    } catch(e) {
      logger.error(`Post - Failed to create post with id=${id}`, e.stack)
    }
  }
}

You can open the Index.tsx file to see how it can be implemented

💻 Developer environment

Use src directory to test how LoggerContext works. Finally the lib directory is compiled and packed to es and umd formats.

📑 Documentation

LoggerProvider

useLogger