{"id":18757870,"url":"https://github.com/mvillafuertem/scalajs-react-world","last_synced_at":"2025-10-09T04:35:54.830Z","repository":{"id":39802409,"uuid":"294422253","full_name":"mvillafuertem/scalajs-react-world","owner":"mvillafuertem","description":"👌 Scala.js Real World Apps 📱 No More Hello World 🌍","archived":false,"fork":false,"pushed_at":"2022-08-30T15:47:33.000Z","size":31088,"stargazers_count":7,"open_issues_count":17,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-13T02:15:18.853Z","etag":null,"topics":["react","react-native","scalajs"],"latest_commit_sha":null,"homepage":"","language":"Scala","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/mvillafuertem.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":"2020-09-10T13:45:14.000Z","updated_at":"2025-01-14T14:28:30.000Z","dependencies_parsed_at":"2023-01-16T18:15:19.842Z","dependency_job_id":null,"html_url":"https://github.com/mvillafuertem/scalajs-react-world","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvillafuertem%2Fscalajs-react-world","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvillafuertem%2Fscalajs-react-world/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvillafuertem%2Fscalajs-react-world/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvillafuertem%2Fscalajs-react-world/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mvillafuertem","download_url":"https://codeload.github.com/mvillafuertem/scalajs-react-world/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248654106,"owners_count":21140237,"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":["react","react-native","scalajs"],"created_at":"2024-11-07T17:44:46.477Z","updated_at":"2025-10-09T04:35:49.791Z","avatar_url":"https://github.com/mvillafuertem.png","language":"Scala","funding_links":[],"categories":[],"sub_categories":[],"readme":":warning: PLEASE, DO NOT EDIT THIS FILE.\nIT IS AUTOGENERATE YOU SHOULD EDIT `modules/docs/src/main/mdoc/README.md`\nWITH THE COMMAND `sbt docs/mdoc`\n\n---\n\n\n\u003cp align=\"center\"\u003e\u003cimg width=\"200\" src=\"https://raw.githubusercontent.com/mvillafuertem/scalajs-react-world/master/reactjs-icon.svg\"/\u003e\u003c/p\u003e\n\u003ch1 align=\"center\"\u003eScala.js React World\u003c/h1\u003e\n\u003cdiv align=\"center\"\u003e\n\n[![scala-ci](https://github.com/mvillafuertem/scalajs-react-world/workflows/scalaci/badge.svg)](https://github.com/mvillafuertem/scalajs-react-world/actions?query=workflow%3A%22scalaci%22)\n[![scala.js](https://img.shields.io/badge/scala.js-1.3.1-red.svg?logo=scala\u0026logoColor=red)](https://www.scala-js.org)\n[![react](https://img.shields.io/badge/react-16.13.1-61DAFB.svg?logo=React)](https://reactjs.org)\n[![jdk](https://img.shields.io/badge/jdk-11.0.8-orange.svg?logo=java\u0026logoColor=white)](https://www.oracle.com/technetwork/java/javase/11all-relnotes-5013287.html)\n[![sbt](https://img.shields.io/badge/sbt-1.4.6-blue.svg?logo=sbt)](https://github.com/sbt/sbt/releases)\n[![scala-steward](https://img.shields.io/badge/Scala_Steward-helping-blue.svg?style=flat\u0026logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAQCAMAAAARSr4IAAAAVFBMVEUAAACHjojlOy5NWlrKzcYRKjGFjIbp293YycuLa3pYY2LSqql4f3pCUFTgSjNodYRmcXUsPD/NTTbjRS+2jomhgnzNc223cGvZS0HaSD0XLjbaSjElhIr+AAAAAXRSTlMAQObYZgAAAHlJREFUCNdNyosOwyAIhWHAQS1Vt7a77/3fcxxdmv0xwmckutAR1nkm4ggbyEcg/wWmlGLDAA3oL50xi6fk5ffZ3E2E3QfZDCcCN2YtbEWZt+Drc6u6rlqv7Uk0LdKqqr5rk2UCRXOk0vmQKGfc94nOJyQjouF9H/wCc9gECEYfONoAAAAASUVORK5CYII=)](https://github.com/scala-steward-org/scala-steward)\n\n\u003c/div\u003e\n\n\n## Real World Examples\n\n### [Calendar](https://mvillafuertem.github.io/scalajs-react-world/calendar/)\n\n[Calendar](https://mvillafuertem.github.io/scalajs-react-world/calendar/) is \ninspired by [microsoft graph training](https://github.com/microsoftgraph/msgraph-training-reactspa)\n\n```shell\n\nsbt calendar\n\n```\n\n### Chat\n\n#### Backend Development\n\n```shell script\n\nsbt \"project chat-backend; ~reStart\"\n\n```\n\n#### Frontend Development\n\n```shell script\n\nsbt chat-frontend\n\n```\n\n#### Docker \n\n```shell script\n\nsbt \"chat-release;chat-backend/docker:publishLocal\" \u0026\u0026 \\\ndocker run --rm -p 8080:8080 user/chat-backend:0.1.0\n\n```\n\n#### Production Build\n\n```shell script\n\nsbt chat-release\n\n```\n\nCreates an optimized Client bundle and adds it to the Server Library.\n\nThe whole distribution you can find here: `./modules/chat/chat-backend/target/universal/stage`.\n\nYou can start the server like this:\n\n* Mac / Linux: `./modules/chat/chat-backend/target/universal/stage/bin/chat-backend`\n* Windows: `./modules/chat/chat-backend/target/universal/stage/bin/chat-backend`\n\n\n\n### [Dashboard](https://mvillafuertem.github.io/scalajs-react-world/dashboard/)\n\n[Dashboard](https://mvillafuertem.github.io/scalajs-react-world/dashboard/) is \ninspired by [material-ui layout example](https://v3.material-ui.com/getting-started/page-layout-examples/dashboard/)\n\n### [Gif Finder](https://mvillafuertem.github.io/scalajs-react-world/gif-finder/)\n\n### [Heroes](https://mvillafuertem.github.io/scalajs-react-world/heroes/)\n\n### [Journal](https://mvillafuertem.github.io/scalajs-react-world/journal/)\n\n### [Laminar](https://mvillafuertem.github.io/scalajs-react-world/laminar/)\n\n\n### Counter Native\n\n```shell\n\nsudo gem install cocoapods\n\n```\n\nNote for Mac M1 users\n```shell\n\nsudo arch -x86_64 gem install ffi\n\ncd modules/counter-native/ios \u0026\u0026 arch -x86_64 pod install\n\n```\n\n```shell script\n\nsbt \"project counter-native; clean;~fastLinkJS\"\n\n```\n\nIn a separate terminal\n```shell\n\nyarn --cwd modules/counter-native/ ios\n\n```\n\n### Pokedex\n\n\n```shell script\n\nsbt \"project pokedex-native; clean;~fastLinkJS\"\n\n```\n\nIn a separate terminal\n```shell\n\nyarn react-native start\n\nyarn react-native run-ios\n\n```\n\n![pokedex](./modules/pokedex-native/pokedex.gif)\n\n\n## Quickstart New Project\n\n```shell\n\nexport APP_NAME=my-app\n\ncd modules\n\nyarn create react-app $APP_NAME --template typescript\n\ncd $APP_NAME \u0026\u0026 mkdir -p src/main/scala/io/mvillafuertem/$APP_NAME\n\nyarn add --dev snowpack\n\n```\n\n## Quickstart New Native Project\n\n```shell\n\nexport APP_NAME=my-app\n\ncd modules\n\nnpx react-native init $APP_NAME --template react-native-template-typescript\n\ncd $APP_NAME\n\n// Comment $APP_NAME/ios/Podfile\n// use_flipper!()\n\nnpx pod-install\n\n```\n\n## Libraries\n\nhttps://github.com/ScalablyTyped/Converter\n\nhttps://github.com/japgolly/scalajs-react\n\nhttps://github.com/shadaj/slinky\n\nhttps://github.com/zio/zio\n\n## Notes\n\nhttps://github.com/japgolly/scalajs-react/blob/master/doc/INTEROP.md\n\nhttps://staltz.com/unidirectional-user-interface-architectures.html\n\nhttps://stackoverflow.com/questions/25139257/terminology-what-is-a-glitch-in-functional-reactive-programming-rx\n\nhttps://stackoverflow.com/questions/1028250/what-is-functional-reactive-programming/28247944#28247944","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmvillafuertem%2Fscalajs-react-world","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmvillafuertem%2Fscalajs-react-world","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmvillafuertem%2Fscalajs-react-world/lists"}