zio-scalajs's Introduction

Simple ZIO ScalaJS Skeleton

Here's an app skeleton that brings together the following frameworks:

Features:

Code hotswapping
Static server

Scripts

`npm install`

Install Dependencies.

`npm test`

Run unit tests.

`npm run build:dev`

Compile the app for development.

`npm start`

Serves all HTML/JS/CSS and watches all changes to build/*.js.

Note: UI is running at http://0.0.0.0:8080//.

`npm run build`

Compile the app and make it ready for production deployment.

Directory Structure

.
├── node_modules
├── project
├── public
├── src
├── LICENSE
├── .scalafmt.conf
├── build.sbt
├── package-lock.json
├── package.json
├── sbt
├── webpack.config.js
└── README.md

node_modules/: Contains all Nodejs modules.
project/: Defines Scala build properties.
public/: Contains index.html template.
LICENSE: MIT License.
.scalafmt.conf: Code formatter config for Scala.
build.sbt: Defines Scala build.
package-lock.json: MIT License.
package.json - Configures JS dependencies and scripts.
sbt - SBT runner.
webpack.config.js - Bundles JS and builds index.html.

JS Facades

Global libraries

Add the CDN script to public/index.html:

Example using JQuery library:

<script
  src="https://code.jquery.com/jquery-3.6.0.js"
  integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
  crossorigin="anonymous"></script>

@js.native
@JSGlobal("jQuery")
object JQuery extends js.Object {
  def apply(x: String): JQuery = js.native
}

NPM module

Example using MomentJS:

npm i moment

@js.native
trait Moment extends js.Object {
  def apply(): Moment = js.native
}

@js.native
@JSImport("moment", "moment")
object Moment extends Moment

Recommend Projects