https://github.com/soapdog/webcomponent-ui-avatar

A web component for ui-avatars.com
https://github.com/soapdog/webcomponent-ui-avatar

Last synced: 3 months ago
JSON representation

A web component for ui-avatars.com

• Host: GitHub
• URL: https://github.com/soapdog/webcomponent-ui-avatar
• Owner: soapdog
• License: mit
• Created: 2017-10-11T01:09:08.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-10-11T02:34:01.000Z (over 7 years ago)
• Last Synced: 2024-04-15T03:28:54.509Z (9 months ago)
• Language: TypeScript
• Size: 151 KB
• Stars: 7
• Watchers: 3
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: readme.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-stenciljs - UI Avatar

README

        
# UI Avatar Web Component 😍

This is a pure web component with no dependencies for [ui avatars](https://ui-avatar.com). It is built using [StencilJS](https://stenciljs.com).

### Example usage:

```

  

  

  

  

  

```

Generates:

![sample avatars](https://i.imgur.com/Ivi5IiH.png)

## Getting Started

Setup and first run:

```bash

npm install

npm start

```

To watch for file changes during develop, run:

```bash

npm run dev

```

To build the component for production, run:

```bash

npm run build

```

To run the unit tests for the components, run:

```bash

npm test

```

Need help with Stencil? Check out our docs [here](https://stenciljs.com/docs/my-first-component).

## Using this component

### Script tag

- [Publish to NPM](https://docs.npmjs.com/getting-started/publishing-npm-packages)

- Put a script tag similar to this `` in the head of your index.html

- Then you can use the element anywhere in your template, JSX, html etc

### Node Modules

- Run `npm install my-name --save`

- Put a script tag similar to this `