{"id":31925102,"url":"https://github.com/igncp/demos","last_synced_at":"2025-10-14T00:27:07.809Z","repository":{"id":19110930,"uuid":"22339688","full_name":"igncp/demos","owner":"igncp","description":"Data visualization demos, rewritten and extended","archived":false,"fork":false,"pushed_at":"2022-06-01T21:31:11.000Z","size":86793,"stargazers_count":9,"open_issues_count":0,"forks_count":12,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-04-14T10:50:50.801Z","etag":null,"topics":["animejs","canvas","css","d3","dataviz","gatsby","jest","playwright","qunit","raphael","react","storybook","svg","three","threejs","typescript","webgl"],"latest_commit_sha":null,"homepage":"https://igncp.github.io/demos","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/igncp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-07-28T11:01:44.000Z","updated_at":"2022-06-26T13:54:33.000Z","dependencies_parsed_at":"2022-09-01T09:10:19.995Z","dependency_job_id":null,"html_url":"https://github.com/igncp/demos","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/igncp/demos","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igncp%2Fdemos","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igncp%2Fdemos/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igncp%2Fdemos/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igncp%2Fdemos/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/igncp","download_url":"https://codeload.github.com/igncp/demos/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igncp%2Fdemos/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279017357,"owners_count":26086052,"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","status":"online","status_checked_at":"2025-10-13T02:00:06.723Z","response_time":61,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["animejs","canvas","css","d3","dataviz","gatsby","jest","playwright","qunit","raphael","react","storybook","svg","three","threejs","typescript","webgl"],"created_at":"2025-10-14T00:26:57.050Z","updated_at":"2025-10-14T00:27:07.802Z","avatar_url":"https://github.com/igncp.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Demos\n\n[![Deploy to Github Pages](https://github.com/igncp/demos/actions/workflows/deploy-to-ghpages.yml/badge.svg)](https://github.com/igncp/demos/actions/workflows/deploy-to-ghpages.yml)\n\nShowcase of responsive data visualization demos.\n\nhttps://igncp.github.io/demos/\n\n## Summary\n\n- It uses [Gatsby](https://www.gatsbyjs.com/) with [React](https://reactjs.org/) to generate static HTML pages without the need for a server\n- The main libraries are [D3](https://d3js.org/) and [Three.js](https://threejs.org/), using [TypeScript](https://www.typescriptlang.org/) and [PostCSS](https://postcss.org/)\n- Each demo has links to the reference implementation, the raw data (normally in JSON, CSV or TSV), and related documentations\n- There are some demos using [SVG](https://en.wikipedia.org/wiki/Scalable_Vector_Graphics), [Canvas](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) and [WebGL](https://get.webgl.org/) in a [Storybook](https://storybook.js.org/) build:\n    - https://igncp.github.io/demos/storybook\n    - They explore mostly web UI APIs or libraries without focusing in building a complete visualization\n- TypeScript coverage report:\n    - https://igncp.github.io/demos/coverage-ts\n    - The coverage is relatively high and there is a minimum threshold of 95% for the whole project\n    - Type-checking is required in the CI so there are no TypeScript errors but in a few cases it uses `any`\n- Tests reports:\n    - [Unit and functional tests report](https://igncp.github.io/demos/jest-report) using [Jest](https://jestjs.io/) ([jest.config.js](./jest.config.js))\n    - [End-to-end tests report](https://igncp.github.io/demos/playwright-report) using [Playwright](https://playwright.dev) ([playwright.config.ts](./playwright.config.ts))\n    - [In-browser unit tests page](https://igncp.github.io/demos/testing) for learning some dependencies with [QUnit](https://qunitjs.com/) ([page](./src/pages/testing.tsx))\n- JS bundles analysis:\n    - https://igncp.github.io/demos/bundles-sizes-report.html\n- It has extensive tooling for the code, all run via [Github Actions](https://github.com/igncp/demos/actions):\n    - [ESLint](https://eslint.org/) config: [.eslintrc.js](./.eslintrc.js)\n    - [Prettier](https://prettier.io/) config: [.prettierrc](./.prettierrc)\n    - [stylelint](https://stylelint.io/) config: [stylelint.config.js](./stylelint.config.js)\n    - [ts-prune](https://github.com/nadeesha/ts-prune) script: [scripts/ts_prune.sh](scripts/ts_prune.sh)\n    - [typed-css-modules](https://github.com/Quramy/typed-css-modules) script: [scripts/ts_css.sh](scripts/ts_css.sh)\n- There is an [internal checklist](./research/charts-checklist.md) which aims to improve the quality and reusability of the charts\n    - New charts should follow it completely but older charts (pre-2021) are still being updated to comply with it\n    - The charts are in the process to become responsive\n- Version from 2016 using [CoffeeScript](https://coffeescript.org/) and [Sail.js](https://sailsjs.com/): \n    - http://igncp-demos.herokuapp.com/\n    - [Github Branch](https://github.com/igncp/demos/tree/2016-version)\n\n## Install\n\nYou need to have Node.js installed\n\n- Clone the repo\n- Inside the repo directory, run: `npm install`\n- To start the server `npm run develop`\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Figncp%2Fdemos","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Figncp%2Fdemos","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Figncp%2Fdemos/lists"}