{"id":14964055,"url":"https://github.com/scalablytyped/demos","last_synced_at":"2025-09-30T19:31:07.192Z","repository":{"id":48630008,"uuid":"145993422","full_name":"ScalablyTyped/Demos","owner":"ScalablyTyped","description":"Demos for ScalablyTyped ","archived":false,"fork":false,"pushed_at":"2024-01-28T18:19:56.000Z","size":27226,"stargazers_count":48,"open_issues_count":1,"forks_count":11,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-07T05:06:56.650Z","etag":null,"topics":["angular","chartjs","d3","definitelytyped","demo","electron","expressjs","google-maps","jquery","jquery-ui","leafletjs","lodash","p5js","phaserjs","scala","scala-js","scalablytyped","scalajs","scalajs-bundler","typescript"],"latest_commit_sha":null,"homepage":null,"language":"Scala","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/ScalablyTyped.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":"2018-08-24T13:13:42.000Z","updated_at":"2025-03-18T07:57:40.000Z","dependencies_parsed_at":"2024-01-28T19:40:37.467Z","dependency_job_id":null,"html_url":"https://github.com/ScalablyTyped/Demos","commit_stats":{"total_commits":150,"total_committers":5,"mean_commits":30.0,"dds":0.1466666666666666,"last_synced_commit":"558213f6e21e6afbc6f015e06d053038f3a4e66f"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ScalablyTyped/Demos","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScalablyTyped%2FDemos","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScalablyTyped%2FDemos/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScalablyTyped%2FDemos/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScalablyTyped%2FDemos/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ScalablyTyped","download_url":"https://codeload.github.com/ScalablyTyped/Demos/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ScalablyTyped%2FDemos/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":277746958,"owners_count":25870057,"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-09-30T02:00:09.208Z","response_time":75,"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":["angular","chartjs","d3","definitelytyped","demo","electron","expressjs","google-maps","jquery","jquery-ui","leafletjs","lodash","p5js","phaserjs","scala","scala-js","scalablytyped","scalajs","scalajs-bundler","typescript"],"created_at":"2024-09-24T13:32:31.537Z","updated_at":"2025-09-30T19:31:06.023Z","avatar_url":"https://github.com/ScalablyTyped.png","language":"Scala","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Demos for ScalablyTyped\n\nThis is a collection of tiny demo projects to show off how we can use javascript libraries from scala.js\n\n## React demos\n\nAll react demos are now moved to separate repositories by the react library they use.\nSee slinky demos [here](https://github.com/ScalablyTyped/SlinkyTypedDemos)\n\n## Browser demos \n\n### d3 \n[Demo](https://scalablytyped.github.io/Demos/d3/)\n\nIt uses d3 to generate a rather fancy spinning globe. Demo is converted from [here](https://bl.ocks.org/animateddata/1f6522d3fcec29c01e7f4a5894e1fd94)\n\n`sbt\u003e d3/start` starts a webpack-dev-server at http://localhost:8001 .\n\n### google-maps\n[Demo](https://scalablytyped.github.io/Demos/google-maps/)\n\nThe demo loads the google maps javascript as distributed by google (see [index.html](./google-maps/assets/index.html) ).\nIt's very simple usage, it just shows the location of a few beaches.\n\n`sbt\u003e google-maps/start` starts a webpack-dev-server at http://localhost:8002 .\n\n### jquery\n[Demo](https://scalablytyped.github.io/Demos/jquery/)\n\nThis demo shows how to interact with old-style javascript.\nJqueryui is a global library (as in, not a module), so you'll see the code touches an object to include it.\nIt also extends jquery with more functionality, so you'll see an explicit cast to tell the compiler about this. \nThis is poor mans interface augmentation (a mechanism by which typescript does this automatically)\n\n#### Libraries used\n\n- jquery\n- jqueryui\n\n`sbt\u003e jquery/start` starts a webpack-dev-server at http://localhost:8003 .\n\n### Vue\n[Demo](https://scalablytyped.github.io/Demos/vue/)\n\nThis demo showcases a pretty simple todo app (stolen and adapted from [scalajs-vue](https://github.com/fancellu/scalajs-vue/)).\nSome templating is done in [index.html](./vue/assets/index.html), while a bunch of stuff is done in Scala.\n\nFrom its design it's pretty clear that Vue was designed by javascript people.\nTrying to obtain type safety in this mess will probably never be worth it, \nbut at least now you can try! :)\n`sbt\u003e vue/start` starts a webpack-dev-server at http://localhost:8004 .\n\n\n### Three.js\n[Demo](https://scalablytyped.github.io/Demos/three/)\n\nA fancy animation of a horse, stolen from [three.js demos](https://github.com/mrdoob/three.js/blob/master/examples/webgl_morphtargets_horse.html).\n`sbt\u003e three/start` starts a webpack-dev-server at http://localhost:8005 .\n\n### Reveal.js\n[Demo](https://scalablytyped.github.io/Demos/reveal/)\n\nWrite your talks in scala.js! This uses highlight.js and reveal.js along with\n scalajs-react. adapted from [scala-reveal-js](https://github.com/pheymann/scala-reveal-js),\n`sbt\u003e reveal/start` starts a webpack-dev-server at http://localhost:8006 .\n\n### Chart.js\n[Demo](https://scalablytyped.github.io/Demos/chart/)\n\nSimple charting using canvas elements. Shows off how to work with the DOM as well\n as how to use chart.js. Heavily adapted from the [retyped demo](https://github.com/Retyped/Demos/tree/master/ChartJsDemo),\n`sbt\u003e chart/start` starts a webpack-dev-server at http://localhost:8007 .\n\n### Angular 8 \n[Demo](https://scalablytyped.github.io/Demos/angular/)\n\nLet's be nice and say that Angular is a reasonable alternative for creating a frontend app.\nIf you agree, now is your chance to use it with Scala.js.\n\nAdapted from [sherpal's prototype](https://github.com/sherpal/AngularScalaPOC).\n`sbt\u003e angular/start` starts a webpack-dev-server at http://localhost:8008 .\n\n### P5\n[Demo](https://scalablytyped.github.io/Demos/p5/index.html)\n\nDemo adapted from [documentation](https://p5js.org/examples/instance-mode-instantiation.html)\n`sbt\u003e p5/start` starts a webpack-dev-server at http://localhost:8009 .\n\n### Leaflet\n[Demo](https://scalablytyped.github.io/Demos/leaflet/index.html)\n\nDemo adapted from [scalajs-leaflet](https://github.com/fancellu/scalajs-leaflet/blob/master/example/src/main/scala/example/QuickStartLeaflet.scala)\n`sbt\u003e leaflet/start` starts a webpack-dev-server at http://localhost:8010 .\n \n\n### Onsenui \n[Demo](https://scalablytyped.github.io/Demos/onsenui/index.html)\nAdapted from [documentation](https://onsen.io/v2/guide/jquery/)\n \n`sbt\u003e onsenui/start` starts a webpack-dev-server at http://localhost:8011 .\n\n### phaser \n[Demo](https://scalablytyped.github.io/Demos/phaser/index.html)\nAdapted from [animation/create-from-sprite-config example](http://phaser.io/examples/v3/view/animation/create-from-sprite-config)\n \n`sbt\u003e phaser/start` starts a webpack-dev-server at http://localhost:8012 .\n\n### Pixi\n[Demo](https://scalablytyped.github.io/Demos/pixi/index.html) \nThis is the translation of some of the [examples](https://pixijs.io/examples) into Scala.\n\n[Pixi.js](https://pixijs.io) is a library to render blazingly fast 2D animations on Canvas, using WebGL under the hood.\n\n`sbt\u003e pixi/start` starts a webpack-dev-server at http://localhost:8013 .\n\nYou will be presented with a menu that has the same structure as the examples from the Pixi website.\n \n## Electron\nImplements the backend/mainprocess part of an Electron app in Scala.js,\n though it would be easy to do the frontend as well (in another module).\n\nStart the project like this:\n\n```\nsbt\u003eelectron/run\n``` \n\nAgain adapted from [sherpal's work](https://github.com/sherpal/Scala.js-Electron-App-Example).\n\n## Node demos\n\n### lodash\nThis is a very simple app which uses a few functions from lodash.\n`sbt\u003e lodash/run` runs the demo in node.\n\n### node-express\nThis demo is a HTTP endpoint written in express, which runs on node. \nAdapted from [this](https://github.com/BrianDGLS/express-ts)\n\n`sbt\u003e node-express/run` will start it.\n\nYou'll need for instance `curl` to test it:\n```bash\n\u003e curl http://localhost:3000/welcome\n#Hello, World!\n\n\u003e curl http://localhost:3000/welcome/foo\n# Hello, foo!\n```\n\n### typescript\n\n`sbt\u003e typescript/run` runs the typescript compiler on two files (one of which is meant to fail).\nIt accepts parameters to specify other files if you want to play around.\n\n### cypress\n\n`sbt\u003e cypress/run` runs a basic test\n\n## Your demo here! :)\nPull requests most welcome!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscalablytyped%2Fdemos","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fscalablytyped%2Fdemos","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscalablytyped%2Fdemos/lists"}