{"id":17651761,"url":"https://github.com/diegovictor/github-profile-summary","last_synced_at":"2025-05-05T21:34:37.618Z","repository":{"id":35136622,"uuid":"210235075","full_name":"DiegoVictor/github-profile-summary","owner":"DiegoVictor","description":"A component to show user's github stats","archived":false,"fork":false,"pushed_at":"2025-01-02T23:48:21.000Z","size":2995,"stargazers_count":30,"open_issues_count":7,"forks_count":2,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-29T01:43:04.830Z","etag":null,"topics":["babel","component","eslint","github-api","javascript","jest","js","node","nodejs","npm","npm-package","package","react","reactjs","styled-components","tests"],"latest_commit_sha":null,"homepage":"https://ghps-demo.netlify.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/DiegoVictor.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-09-23T00:47:06.000Z","updated_at":"2025-01-02T23:48:25.000Z","dependencies_parsed_at":"2025-01-23T10:43:41.020Z","dependency_job_id":null,"html_url":"https://github.com/DiegoVictor/github-profile-summary","commit_stats":{"total_commits":130,"total_committers":2,"mean_commits":65.0,"dds":0.007692307692307665,"last_synced_commit":"a4791633b5b766afe7f77b7b1383d9fe8b8da8d7"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DiegoVictor%2Fgithub-profile-summary","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DiegoVictor%2Fgithub-profile-summary/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DiegoVictor%2Fgithub-profile-summary/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DiegoVictor%2Fgithub-profile-summary/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/DiegoVictor","download_url":"https://codeload.github.com/DiegoVictor/github-profile-summary/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246395594,"owners_count":20770242,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["babel","component","eslint","github-api","javascript","jest","js","node","nodejs","npm","npm-package","package","react","reactjs","styled-components","tests"],"created_at":"2024-10-23T11:43:30.703Z","updated_at":"2025-03-31T19:31:42.574Z","avatar_url":"https://github.com/DiegoVictor.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Github Profile Summary\n[![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/DiegoVictor/github-profile-summary/config.yml?logo=github\u0026style=flat-square)](https://github.com/DiegoVictor/github-profile-summary/actions)\n[![npm](https://img.shields.io/npm/v/@diegovictor/github-profile-summary?style=flat-square)](https://www.npmjs.com/package/@diegovictor/github-profile-summary)\n[![react](https://img.shields.io/badge/reactjs-18.1.0-61dafb?style=flat-square\u0026logo=react)](https://reactjs.org/)\n[![styled-components](https://img.shields.io/badge/styled_components-6.0.7-db7b86?style=flat-square\u0026logo=styled-components)](https://styled-components.com/)\n[![babel](https://img.shields.io/badge/babel-7.22.9-F9DC3E?style=flat-square\u0026logo=babel)](https://babeljs.io/)\n[![eslint](https://img.shields.io/badge/eslint-8.46.0-4b32c3?style=flat-square\u0026logo=eslint)](https://eslint.org/)\n[![prettier](https://img.shields.io/badge/prettier-3.0.1-F7B93E?style=flat-square\u0026logo=prettier)](https://prettier.io/)\n[![jest](https://img.shields.io/badge/jest-29.6.2-brightgreen?style=flat-square\u0026logo=jest)](https://jestjs.io/)\n[![coverage](https://img.shields.io/codecov/c/gh/DiegoVictor/github-profile-summary?logo=codecov\u0026style=flat-square)](https://codecov.io/gh/DiegoVictor/github-profile-summary)\n[![airbnb-style](https://flat.badgen.net/badge/style-guide/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n[![MIT License](https://img.shields.io/badge/license-MIT-green?style=flat-square)](https://raw.githubusercontent.com/DiegoVictor/github-profile-summary/main/LICENSE)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)\u003cbr\u003e\n\n![DiegoVictor](https://raw.githubusercontent.com/DiegoVictor/github-profile-summary/main/screenshots/demo.gif)\n\nUse this component to show a summary of your github stats with a cool design 😎\n\n# Installing\nJust run:\n```\nnpm install @diegovictor/github-profile-summary\n```\nOr simply:\n```\nyarn add @diegovictor/github-profile-summary\n```\n\n# Usage\nSo easy than make a lemonade:\n```js\nimport React from 'react';\nimport ReactDOM from \"react-dom/client\";\nimport { ProfileSummary } from '@diegovictor/github-profile-summary';\nimport data from \"./data.json\";\n\nconst root = ReactDOM.createRoot(document.getElementById(\"root\"));\nroot.render(\u003cProfileSummary data={data} /\u003e,);\n```\n\n## Structure\nThe `data` attribute must receive an object with the following structure:\n```js\n{\n  user: {\n    name: 'Diego Victor',\n    avatar_url: 'https://avatars3.githubusercontent.com/u/15165349?v=4',\n    login: 'DiegoVictor',\n    url: 'https://github.com/DiegoVictor',\n  },\n  languages: [\n    {\n      name: 'JS',\n      usage: '67%',\n      percent: 67,\n      color: '#f1e05a',\n    },\n    ...\n  ],\n  stats: [\n    {\n      key: 1,\n      title: 'Commit\\nAverage',\n      value: 59,\n      description: 'in 18 repos',\n    },\n    ...\n  ],\n}\n```\n\u003e The `stats` array must have only 3 items, any item after the third position will be ignored\n\nField|Format|Description\n---|---|---\n`user`|object| -\n`user.name`|string|Utilized as fallback to image in case of it not loads.\n`user.avatar_url`|string|Avatar's URL.\n`user.login`|string|Green button label.\n`user.url`|string|Link to open when the green button is clicked.\n`languages`|array| -\n`languages[].name`|string|Language name or alias.\n`languages[].usage`|string|Language label.\n`languages[].percent`|number|Language percent usage. Defines language area occupied.\n`languages[].color`|string|Language color (hexadecimal color code).\n`stats`|array| -\n`stats[].key`|string,number|Unique identifier.\n`stats[].title`|string|Text at the top of stats.\n`stats[].value`|number|The stat number.\n`stats[].description`|string|Text at the bottom of the stat.\n\n## Data\nWith in this package there is a script to calcule stats and language usage from a provided github's user, just run `scripts/main.js` passing the user github's username as parameter:\n```shell\n$ node scripts/main.js diegovictor\n```\n\u003e Github has a low limit of requests non authenticated, if the provided user have a lot of repositories probably the limit will be reached easyly, to avoid this problem [create a personal access token](https://docs.github.com/pt/github/authenticating-to-github/keeping-your-account-and-data-secure/creating-a-personal-access-token) to have a greater limit, then pass it as a second parameter to the script:\n```shell\n$ node scripts/main.js diegovictor ghp_p07LDQ1xUyRJ4dExb6U1YfVlEW1vgX2SKiFQ\n```\nA `stats.json` file will be create aside the script, just copy its content and pass it to component into `data` attribute.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdiegovictor%2Fgithub-profile-summary","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdiegovictor%2Fgithub-profile-summary","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdiegovictor%2Fgithub-profile-summary/lists"}