⚠️ PLEASE, DO NOT EDIT THIS FILE. IT IS AUTOGENERATE YOU SHOULD EDIT modules/docs/src/main/mdoc/README.md WITH THE COMMAND sbt docs/mdoc

---

Scala.js React World

Real World Examples

Calendar

Calendar is inspired by microsoft graph training

sbt calendar

Chat

Backend Development

sbt "project chat-backend; ~reStart"

Frontend Development

sbt chat-frontend

Docker

sbt "chat-release;chat-backend/docker:publishLocal" && \
docker run --rm -p 8080:8080 user/chat-backend:0.1.0

Production Build

sbt chat-release

Creates an optimized Client bundle and adds it to the Server Library.

The whole distribution you can find here: ./modules/chat/chat-backend/target/universal/stage.

You can start the server like this:

• Mac / Linux: ./modules/chat/chat-backend/target/universal/stage/bin/chat-backend
• Windows: ./modules/chat/chat-backend/target/universal/stage/bin/chat-backend

Dashboard

Dashboard is inspired by material-ui layout example

Gif Finder

Heroes

Journal

Laminar

Counter Native

sudo gem install cocoapods

Note for Mac M1 users

sudo arch -x86_64 gem install ffi

cd modules/counter-native/ios && arch -x86_64 pod install

sbt "project counter-native; clean;~fastLinkJS"

In a separate terminal

yarn --cwd modules/counter-native/ ios

Pokedex

sbt "project pokedex-native; clean;~fastLinkJS"

In a separate terminal

yarn react-native start

yarn react-native run-ios

Quickstart New Project

export APP_NAME=my-app

cd modules

yarn create react-app $APP_NAME --template typescript

cd $APP_NAME && mkdir -p src/main/scala/io/mvillafuertem/$APP_NAME

yarn add --dev snowpack

Quickstart New Native Project

export APP_NAME=my-app

cd modules

npx react-native init $APP_NAME --template react-native-template-typescript

cd $APP_NAME

// Comment $APP_NAME/ios/Podfile
// use_flipper!()

npx pod-install

Libraries

https://github.com/ScalablyTyped/Converter

https://github.com/japgolly/scalajs-react

https://github.com/shadaj/slinky

https://github.com/zio/zio

Notes

https://github.com/japgolly/scalajs-react/blob/master/doc/INTEROP.md

https://staltz.com/unidirectional-user-interface-architectures.html

https://stackoverflow.com/questions/25139257/terminology-what-is-a-glitch-in-functional-reactive-programming-rx

https://stackoverflow.com/questions/1028250/what-is-functional-reactive-programming/28247944#28247944