Avatar-Maker - GitLite

KO | EN

gitlite — search

#react #ai #llm #golang #android #machine-learning #deep-learning #linux #java #windows #cli #kubernetes #pytorch #ios

Avatar-Maker

(★ 360)

Archived open-source Vue avatar editor with 360+ stars, SVG composition, randomized presets, and PNG export.

File Explorer

Download Latest Version (.zip)

- favicon.png
- index.html
- - footer.vue
  - options.vue
  - optionsColor.vue
  - save_image.vue
- App.vue
- main.js
.gitignore
LICENSE
package-lock.json
package.json
README.md

# Installation Guide

1. Get the code

git clone https://github.com/favrora/Avatar-Maker

Downloads the entire project code from GitHub to your computer.

cd Avatar-Maker

Moves into the project folder you just downloaded.

2. Node.js

Easy Recommended

Prerequisites

Git Needed to download the project code from GitHub.
Node.js Node.js must be installed to use npm. The LTS version is recommended.

$ npm install

Downloads and installs the libraries listed in package.json.

$ npm run serve

Type this command into your terminal and run it.

✅ After running the command, open the address shown in the terminal (usually something like http://localhost:3000) in your browser.

Pulled directly from this repo's README.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

<p align="left">
    <a href="https://github.com/favrora/Avatar-Maker/stargazers">
      <img alt="Stargazers" src="https://img.shields.io/github/stars/favrora/Avatar-Maker?color=blue">
    </a>
    <img alt="Contributors" src="https://img.shields.io/github/contributors/favrora/Avatar-Maker?color=blue">
    <img alt="License" src="https://img.shields.io/github/license/favrora/Avatar-Maker?color=blue">
    <img alt="Repository size" src="https://img.shields.io/github/repo-size/favrora/Avatar-Maker?color=blue">
</p>

# Avatar Maker

Collect your avatar from different parts. The code of this program is very easy, any developer will be able to understand the code. SVG is used to draw an avatar.

*Give a star to the repository, it will help us grow! Thanks!*

<a href="https://www.producthunt.com/posts/avatar-maker-2?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-avatar-maker-2" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=288616&theme=dark" alt="Avatar Maker - Create your own avatar | Product Hunt" style="width: 200px; height: 44px;" width="200" height="44" /></a> <a href="https://www.producthunt.com/posts/avatar-maker-2?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-avatar-maker-2" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-badge.svg?post_id=288616&theme=dark&period=daily" alt="Avatar Maker - Create your own avatar | Product Hunt" style="width: 200px; height: 44px;" width="200" height="44" /></a>

## Demo

[Demo version of the project](https://avatarx.netlify.app/)

## Preview

<img src="src/assets/img/preview.gif" width="600px">

## Development

Getting Start:
* Open a terminal. 
* Go to the folder where you want to copy the project. 
* Copy the project with this command:

```sh
    $ git clone https://github.com/favrora/Avatar-Maker.git
    ```

* Go to the project folder:

```sh
    $ cd avatar-maker
    ```

In order to run it locally you'll need to fetch some dependencies and a basic server setup.

* Install local dependencies:

```sh
    $ npm install
    ```

* Start the development server and open [`http://localhost:8080`](http://localhost:8080).

```sh
    $ npm run serve
    ```

## Open tasks

* [Align the avatar to the bottom for mobile devices.](https://github.com/favrora/Avatar-Maker/issues/9)
* [Add the ability to change color](https://github.com/favrora/Avatar-Maker/issues/14)
* [Add a female avatar](https://github.com/favrora/Avatar-Maker/issues/15)

## Completed tasks

* ~~Change random avatar without reloading the site.~~ | Done by [Bruno Neves](https://github.com/7br-uno) | 23.03.2021
* ~~Add function to download created avatar as a png image.~~ | Done by [Peter H.](https://github.com/PetFeld) | 01.03.2021
* ~~Create a demo site~~ | Done by [Andrew Kliskey](https://github.com/andrewkliskey) | 03.02.2021