# github-social-image-generator

**Repository Path**: zyanggc/github-social-image-generator

## Basic Information

- **Project Name**: github-social-image-generator
- **Description**: :hammer:generate github social image online!
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-02-17
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: webui

**Tags**: None

## README

# Github 社交图在线生成工具

[English Readme](README.md)

![demo](demo/demo.gif)

目前(2019-10-11)互联网还找不到一个能在线生成 github 项目社交图的工具，为了满足自身需求和填补这块空白，我做了工具供大家使用。🌈🌈

访问地址: [https://works.yangerxiao.com/github-social-image-generator/](https://works.yangerxiao.com/github-social-image-generator/)
输入正确的仓库地址（比如：`https://github.com/zerosoul/chinese-colors`），剩下的就可以让这个工具来处理了。

## 在哪里使用生成的图片？

Github 仓库 >> 设置 👇

![setting](demo/github.setting.png)

社交图官方举例 👇

![example](demo/template.png)

## 界面

![star data loaded](demo/loaded.png)

## 特性

- 可选择精美的纹理图 🎉
- 可自定义背景色 🌈
- 可自定义编辑仓库信息 🗑
- 生成的图片可下载，尽情地分享吧！ 🖼
- 移动端友好 📱

![star data result](demo/result.png)

## 感谢

- [Github API v4](https://developer.github.com/v4/)
- [apollo graphql](https://apollographql.com/docs/react/)
- [create-react-app](https://github.com/facebook/create-react-app)
- [react.js](https://reactjs.org)
- [react-color](https://github.com/casesandberg/react-color/)
- [antd](https://ant.design)
- [styled-components](https://styled-components.com): CSS-IN-JS Best Practice
- eslint + prettier
- husky + commitlint
- 感谢伟大的开源世界

## 支持该项目

### 赞赏

![赞赏码](./src/assets/img/reward.jpg)