https://github.com/bipoza/adorable-avatar

Automatic avatar generator for any web frontend! For Angular, React, Vue and HTML web components.
https://github.com/bipoza/adorable-avatar

angular hacktoberfest hacktoberfest2021 ionic ionic-framework react stencil stenciljs vue webcomponents

Last synced: 22 days ago
JSON representation

Automatic avatar generator for any web frontend! For Angular, React, Vue and HTML web components.

• Host: GitHub
• URL: https://github.com/bipoza/adorable-avatar
• Owner: bipoza
• Created: 2021-07-28T19:30:38.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-10-05T19:38:03.000Z (over 3 years ago)
• Last Synced: 2024-12-17T04:56:04.670Z (27 days ago)
• Topics: angular, hacktoberfest, hacktoberfest2021, ionic, ionic-framework, react, stencil, stenciljs, vue, webcomponents
• Language: TypeScript
• Homepage:
• Size: 780 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        

# Adorable Avatars component!

Automatic avatar generator for any web frontend! For Angular, React, Vue and HTML web components.

Based on the project https://github.com/itsthatguy/avatars-api-middleware this component has been created to be used directly on the frontend without the need to maintain a server.

![Example](./docs/example.png)

## How to use

### HTML [Example](https://codesandbox.io/s/adorable-avatar-core-html-pz8no?file=/index.html:259-274)

Via npm:

```bash

npm install @adorable-avatar/core

```

Via CDN:

```html

```

Use it!

```html

```

![User Example](./docs/user_example.png)

### Angular [Example](https://codesandbox.io/s/adorable-avatar-angular-angular-0yp0w?file=/src/app/app.component.html)

1. Install the package

```BASH

$ npm install @adorable-avatar/angular --save

```

2. Import the module

```TS

import { NgModule } from '@angular/core';

import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';

import { AdorableAvatarModule } from '@adorable-avatar/angular';

@NgModule({

  declarations: [

    AppComponent

  ],

  imports: [

    BrowserModule,

    AdorableAvatarModule

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

```

3. Use it!

```HTML

```

### React (WIP)

Install the package

```bash

npm install @adorable-avatar/react --save

```

Use it!

```javascript

import AdorableAvatar from '@adorable-avatar/react'

function App() {

  return 

}

```

  

## Documentation (WIP)

[Documentation](https://linktodocumentation)

  

## Contributing

Contributions are always welcome!

  

## Authors

- [@bipoza](https://www.github.com/bipoza)

  

## License

[MIT](https://choosealicense.com/licenses/mit/)