# ng-web-console

> [![All Contributors](https://img.shields.io/badge/all_contributors-2-orange.svg?style=flat-square)](#contributors-)

Latest version **1.2.0** (published 2023-11-14) · 0 weekly downloads

## Install

```sh
npm install ng-web-console
pnpm add ng-web-console
yarn add ng-web-console
bun add ng-web-console
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.0 |
| Published | 2023-11-14 |
| First published | 2023-11-03 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 60.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | kreuzerk |

## Links

- npm: https://www.npmjs.com/package/ng-web-console
- npm.io page: https://npm.io/package/ng-web-console

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^2.3.0

## Recent versions

- 1.2.0 (latest) — 2023-11-14
- 1.1.0 — 2023-11-06
- 1.0.1 — 2023-11-04
- 1.0.0 — 2023-11-03

## README

# NgWebConsole
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
[![All Contributors](https://img.shields.io/badge/all_contributors-2-orange.svg?style=flat-square)](#contributors-)
<!-- ALL-CONTRIBUTORS-BADGE:END -->

![](https://raw.githubusercontent.com/kreuzerk/ng-web-console/main/docs/logo.webp)
![](https://raw.githubusercontent.com/kreuzerk/ng-web-console/main/docs/preview.png)

> Display console.log statements in your web page.

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
**Table of Contents**  *generated with [DocToc](https://github.com/thlorenz/doctoc)*

- [NgWebConsole](#ngwebconsole)
  - [Installation](#installation)
  - [Usage](#usage)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->


## Installation

```bash
npm install ng-web-console
```

## Usage
1. Register the console providers:

```typescript
import { provideNgWebConsole} from "ng-web-console";

// inside your app module or app component
providers: [
    provideNgWebConsole()
]
```

2. Add the console component to the imports array of your module or component:

```typescript
import { NgWebConsoleComponent } from "ng-web-console";

// inside your app module or app component
imports: [
    NgWebConsoleComponent
]
```

3. Start using the console component in your template:

```html
<ng-web-console/>
```

4. Start logging:

```typescript
// use console.log somewhere in your codebase 
console.log("Hello World");
```

## Contributors ✨

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<table>
  <tbody>
    <tr>
      <td align="center" valign="top" width="14.28%"><a href="https://medium.com/@kevinkreuzer"><img src="https://avatars.githubusercontent.com/u/5468954?v=4?s=100" width="100px;" alt="Nivek"/><br /><sub><b>Nivek</b></sub></a><br /><a href="https://github.com/kreuzerk/ng-web-console/commits?author=kreuzerk" title="Code">💻</a> <a href="https://github.com/kreuzerk/ng-web-console/commits?author=kreuzerk" title="Documentation">📖</a> <a href="#example-kreuzerk" title="Examples">💡</a> <a href="#ideas-kreuzerk" title="Ideas, Planning, & Feedback">🤔</a> <a href="#infra-kreuzerk" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a> <a href="#maintenance-kreuzerk" title="Maintenance">🚧</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://www.linkedin.com/in/tayamba-mwanza/"><img src="https://avatars.githubusercontent.com/u/11971384?v=4?s=100" width="100px;" alt="Tayamba Mwanza"/><br /><sub><b>Tayamba Mwanza</b></sub></a><br /><a href="#ideas-tayambamwanza" title="Ideas, Planning, & Feedback">🤔</a></td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td align="center" size="13px" colspan="7">
        <img src="https://raw.githubusercontent.com/all-contributors/all-contributors-cli/1b8533af435da9854653492b1327a23a4dbd0a10/assets/logo-small.svg">
          <a href="https://all-contributors.js.org/docs/en/bot/usage">Add your contributions</a>
        </img>
      </td>
    </tr>
  </tfoot>
</table>

<!-- markdownlint-restore -->
<!-- prettier-ignore-end -->

<!-- ALL-CONTRIBUTORS-LIST:END -->

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

---
_Source: https://npm.io/package/ng-web-console · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._