background preloader

Scala.js

Facebook Twitter

Sebastian Nozzi. In this recipe you’ll learn how to: Create a basic Scala.js project… with a custom name… and package structure As an example, we’ll set-up a project for a “countdown” application.

Sebastian Nozzi

Cloning the sample application We’ll start by cloning the sample-application provided by Sébastien Doeraene. Assuming “git” is installed in your machine, you need to clone this project: Rename the resulting directory “scala-js-example” to “countdown-example”. Changing the project name Look at the directory structure. Name := "Countdown Example" I am using a string with a space on purpose to handle this more “tricky” case. Changing the Packages Renaming the packages might be easier to accomplish from within an IDE than directly manipulating directories. In this case you should generate the IDE project first, and then import it (using the SBT plugins for either Eclipse or IntelliJ). After having imported the project to your IDE, do the following: For Eclipse, watch out for Scala-IDE bugs. Package com.sebnozzi.countdown to:

Customizing the example application. Problem You cloned the example application, but would like to have custom package and class names.

Customizing the example application

For this recipe we'll assume that your organization is com.mycompany and your project is called My Cool Project. Solution Changing the project name. Quick Sbt tutorial. Sliding-Puzzle with Scala.js. JavaFX Version This sliding-puzzle started being an experiment to learn the basics of JavaFX.

Sliding-Puzzle with Scala.js

So the first version was desktop-only: But at the same time I already had heard of Scala.js, so I took care to make the code modular, separating game-logic from the UI as much as possible. JavaScript UI During the last DevFest I tried to implement the Scala.js frontend in the course of one afternoon. My initial approach was to start from a JavaScript prototype of the UI, and try to glue it with the existing Scala game-logic later. Separating the image into tilesevent-handling of mouse-clicksmoving tiles with animationhiding/showing tiles with animationre-calculating the tiles upon puzzle-size change But due to “lack of time” (actually, because of other projects) I left this for a while… Connecting with Scala.js A couple of days ago, I continued my journey and started to glue the existing Scala.js code with the UI prototype written in JavaScript.

I learned some valuable lessons along the way, like: Sliding Puzzle. Scala.js: write in Scala for the browser by Sébastien Doeraene - That`s all for today! Scala.js and ReactJS - Matthias Nehlsen. In this article I will present a simple reactive web application using Scala.js and ReactJS on the client side.

Scala.js and ReactJS - Matthias Nehlsen

It is based on sse-chat, an application I initially wrote for demonstrating the use of AngularJS with Play Framework. I then rewrote the client for an article about using ReactJS on the client side. In the latest version now, there is an additional client that connects to the same server and utilizes Scala.js to build the web client. I recently gave a talk about this at Ping Conference in Budapest, check it out if you’re interested. I discovered ReactJS through David Nolen’s blog and his excellent OM library which combines ReactJS with ClojureScript. Great question, I am glad you asked.

If you work with Scala on the server side, you will be familiar with its powerful collection library. Here is the new client in action. The server side has stayed the same with the different clients. Application state is represented by a Scala Case Class. Next there is the InterOp file: