Mathjax javascript librry setup

Scala.js Notebook

Introduction

My objective is to have a true “write once, run anywhere environment based on Scala. Given the most ubiquitous end-user environment is not the jvm, but rather javascript, the natural answer is to use Scala.js. By making use of JQuery Mobile, and Cordova (or Phone Gap), its possible to write applications with a front end GUI using Scala that will on in any browser, and as native applications on a range of devices.

Installation and Setup

Install Scala.js

There are 3 ways to set up a Scala.js project:

  1. By hand
  2. Using TypeSafe Activator
  3. Using giter8

Using giter8

Install giter8

If you have not done so already, you will need to install sbt Follow the install instructions in the sbt tutorial

I’m using a Mac, and use Homebrew so for me its as simple as:

1
$ brew update && brew install sbt

Follow the instructions at: Githib-n8han-giter8:

1
$ brew install giter8

Use Giter8 to set up the example project

Next cd to a directory where you keep your projects. Giter8 will create the sample project in a subdirectory

Now use g8 template at Github-sebnozzi-scala-js.g8:

1
$ g8 sebnozzi/scala-js.g8

You will be asked for:

  1. Version,
  2. Organization,
  3. Name,
  4. Package Name (simply accept the default value as it is derived from the previously entered Organization and Name) and
  5. Class Name (simply accept the default value as it is derived from the previously entered Name)

Next cd into the project directory and run sbt

1
2
$ cd cd scalajsdemo
$ sbt

and wait while sbt sets up all the dependencies

Setup

To set up the Scala.js SBT pplugin:

  • in project/plugins.sbt add addSbtPlugin("org.scala-lang.modules.scalajs" % "scalajs-sbt-plugin" % "0.5.5")
  • in build.sbt add scalaJSSettings

We also want to use a few other SBT plugins:

  • uTest
    • in project/plugins.sbt add: addSbtPlugin("com.lihaoyi" % "utest-js-plugin" % "0.1.8")
    • in build.sbt add:
      • libraryDependencies += "com.lihaoyi" %% "utest" % "0.1.8"
      • utest.jsrunner.Plugin.utestJsSettings
      • testFrameworks += new TestFramework("utest.runner.JvmFramework")
  • sbt-idea - I use IntelliJ Idea, and want to be able to generate Idea project files from my SBT project configuration
    • in project/plugins.sbt add `addSbtPlugin(“com.github.mpeltonen” % “sbt-idea” % “1.6.0”)

We also want to use the following Scala libraries:

  • scala-js-DOM
    • in build.sbt add: libraryDependencies += "org.scala-lang.modules.scalajs" %%% "scalajs-dom" % "0.6"
  • scala-js-jquery
    • in build.sbt add: libraryDependencies += "org.scala-lang.modules.scalajs" %%% "scalajs-jquery" % "0.6"
  • ScalaTags:
    • in build.sbt add libraryDependencies += "com.scalatags" %%% "scalatags" % "0.3.8"
  • scala.rx
    • in build.sbt add libraryDependencies += "com.scalarx" %% "scalarx" % "0.2.5"

We need to set up any Javascript libraries we are using:

  • JQuery
  • JQuery Mobile
  • Font Awesome
  • // ScalaJSKeys.jsDependencies += “org.webjars” % “jquery” % “1.11.1” / “jquery.js”
  • // ScalaJSKeys.jsDependencies += “org.webjars” % “jquery-mobile” % “1.4.2” / “jquery.mobile.js”

Scala.js SBT Plugin Commands

See Scala.js sbt Plugin for details of the SBT Plugin

To set up the plugin:

  • in project/plugins.sbt add addSbtPlugin("org.scala-lang.modules.scalajs" % "scalajs-sbt-plugin" % "0.5.3")
  • in build.sbt add scalaJSSettings

SBT Commands:

  • fastOptJS - Compiles the project with fast optimization
  • fullOptJS - Compiles the project, and does a full optimization with the Google Closure Compiler
  • run - runs the app, with either node (if requiresDOM is false), or phantomjs (if requiresDOM is true). Note that you will need to separately install node and/or phantonjs.

Notes

References

  • Scala.js - The main web site for Scala.js All the documentation is here
  • Scala.js Github - The Github site for Scala.js. Has the sources for scala-js-dom, scala-js-jquery, and scala-js-pickling, as well as Scala.js itself, and the tutorial
  • Li Haoyi Github - Haoyi is the world’s most prolific and creative use of Scala.js. He has several really useful libraries:
    • ScalaTags - A very easy to use DSL for creating HTML using Scala
    • Scala.js Workbench - An SBT plug-in to provide real-time interaction with a browser while developing Scala.js programs
    • uTest - A small test framework that works with Scala.js
    • Scala.Rx - A very nice library for functional reactive programming that works with Scala.js
    • Plus a lot of games written in Scala.js
  • Scala-JS-Fiddle - Another application by Haoyi, that allows you to play with with Scala.js code interactvely in a browser.

Comments