SlideShare ist ein Scribd-Unternehmen logo
1 von 13
Downloaden Sie, um offline zu lesen
ネタじゃないScala.js	
@takezoen	
  
BizReach,	
  Inc
Scala.jsとは?	
  
h5p://www.scala-­‐js.org/	
•  AltJSの一種	
  
•  ScalaコードからJavaScriptを生成	
  
•  Scalaのコンパイラプラグインとして実装されて
いる	
  
•  ScalaとJavaScriptの相互運用が可能	
  
やってみよう	
•  Scala.js	
  Fiddle	
  
h5p://www.scala-­‐js-­‐fiddle.com/	
  
•  Play2	
  
$ activator new <project-name> play-scala-scalajs
Scalaとの連携	
•  Play	
  Framework	
  
–  h5p://qiita.com/suin/items/cb7e03af25e55c9f8765	
  
•  Skinny	
  Framework	
  
–  h5p://skinny-­‐framework.org/documentaRon/assets.html	
  
•  Scalatra	
  
–  h5ps://codebreak.com/blog/takezoe/page/
6b03555f639f90af7/	
  
sbtプラグインが提供されているので	
  
様々なフレームワークと連携して利用可能	
  
プロジェクト構成	
Playプロジェクト(サーバサイド)	
Scala.jsプロジェクト(クライアントサイド)	
Cross-­‐buildプロジェクト(クライアント・サーバ共通)	
Sbtのマルチプロジェクト形式	
  
JavaScriptとの連携	
•  jQuery	
  
–  h5ps://github.com/scala-­‐js/scala-­‐js-­‐jquery	
  
•  AngularJS	
  
–  h5ps://github.com/greencatsoU/scalajs-­‐angular	
  
–  h5ps://github.com/jokade/scalajs-­‐angulate	
  
•  React.js	
  
–  h5ps://github.com/japgolly/scalajs-­‐react	
  
主要なフレームワークについては連携用の	
  
ライブラリが存在する	
  
Scala.jsをJavaScriptから呼び出す	
@JSExport
object HelloWorld {
@JSExport
def main(): Unit = {
println("Hello world!")
}
}
HelloWorld().main();
JavaScriptから呼び出し
Scala.jsからJavaScriptを呼び出す	
def hello(name: String): Unit = {
js.Dynamic.global.alert(s"Hello ${name}!")
}
Scala.jsからJavaScriptを呼び出す	
// Scalaからアクセスするためのインターフェースを定義
object DOMGlobalScope extends js.GlobalScope {
def alert(message: String): Unit = js.native
}
// 定義したインターフェースを使ってJSを呼び出す
def hello(name: String): Unit = {
DOMGlobalScope.alert(s"Hello ${name}!")
}
JSのDOMインターフェースを提供するライブラリが用意されている	
  
h5p://scala-­‐js.github.io/scala-­‐js-­‐dom/	
  
Scala.jsのいいところ	
•  JavaScriptの代わりにScalaでコードが書ける	
  
•  生成されたJavaScriptの可読性が高く、動作も
比較的高速である	
  
•  サーバサイドと同じ開発環境が利用でき、
コードも共有できる	
  
•  ブラウザさえあればScalaで書いたコードを動
かすことができる
Scala.jsの微妙なところ	
•  コンパイルが遅い(お約束)	
  
•  生成されるJavaScriptのファイルサイズがまあ
まあ大きい	
  
$ ls -l
total 3184
drwxr-xr-x 3 takezoe staff 102 May 29 21:37 images
drwxr-xr-x 3 takezoe staff 102 May 29 21:37 javascripts
drwxr-xr-x 4 takezoe staff 136 May 30 02:43 lib
drwxr-xr-x 3 takezoe staff 102 May 29 21:37 scalajs
-rw-r--r-- 1 takezoe staff 864041 May 30 02:32 scalajsclient-fastopt.js
-rw-r--r-- 1 takezoe staff 758316 May 30 02:32 scalajsclient-fastopt.js.map
-rw-r--r-- 1 takezoe staff 120 May 30 03:38 scalajsclient-launcher.js
drwxr-xr-x 3 takezoe staff 102 May 30 02:23 shared
drwxr-xr-x 3 takezoe staff 102 May 29 21:37 stylesheets
新コンパイラを開発中	
Scala	
  Source	
TASTY	
Classfiles	
Minimized	
  
JavaScript	
NaRve	
  Code	
NaRve	
  Code	
scalac	
JDK	
  JIT	
 JS	
  JIT	
packaging	
  tool	
  /	
  linker	
TASTYという中間ファイルを作成し、	
  
そこからバイトコードやJSを生成する	
どうやら本気っぽい。	
  
出展:h5p://tototoshi.github.io/slides/tenka1altjs-­‐scalajs/	
  

Weitere ähnliche Inhalte

Was ist angesagt?

SIerでScalaを使うために私がしたこと
SIerでScalaを使うために私がしたことSIerでScalaを使うために私がしたこと
SIerでScalaを使うために私がしたこと
takezoe
 
Scala + Finagleの魅力
Scala + Finagleの魅力Scala + Finagleの魅力
Scala + Finagleの魅力
Kota Mizushima
 
AWS クックパッドの運用事例
AWS クックパッドの運用事例AWS クックパッドの運用事例
AWS クックパッドの運用事例
Satoshi Takada
 

Was ist angesagt? (20)

Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageekJava エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
 
多分モダンなWebアプリ開発
多分モダンなWebアプリ開発多分モダンなWebアプリ開発
多分モダンなWebアプリ開発
 
SIerでScalaを使うために私がしたこと
SIerでScalaを使うために私がしたことSIerでScalaを使うために私がしたこと
SIerでScalaを使うために私がしたこと
 
Single Command Deployのための gradle-aws-plugin講座
Single Command Deployのための gradle-aws-plugin講座Single Command Deployのための gradle-aws-plugin講座
Single Command Deployのための gradle-aws-plugin講座
 
サーバーレスで ガチ本番運用までやってるお話し
サーバーレスで ガチ本番運用までやってるお話しサーバーレスで ガチ本番運用までやってるお話し
サーバーレスで ガチ本番運用までやってるお話し
 
Swagger 入門
Swagger 入門Swagger 入門
Swagger 入門
 
頑張りすぎないScala
頑張りすぎないScala頑張りすぎないScala
頑張りすぎないScala
 
Servlet と Future の関わり方 #scala_ks
Servlet と Future の関わり方 #scala_ksServlet と Future の関わり方 #scala_ks
Servlet と Future の関わり方 #scala_ks
 
Scala + Finagleの魅力
Scala + Finagleの魅力Scala + Finagleの魅力
Scala + Finagleの魅力
 
2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション
2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション
2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション
 
Skinny Controllers, Skinny Models
Skinny Controllers, Skinny ModelsSkinny Controllers, Skinny Models
Skinny Controllers, Skinny Models
 
並行処理初心者のためのAkka入門
並行処理初心者のためのAkka入門並行処理初心者のためのAkka入門
並行処理初心者のためのAkka入門
 
サーバーレスの今とこれから
サーバーレスの今とこれからサーバーレスの今とこれから
サーバーレスの今とこれから
 
Serverless Framework 使ってる話(node.js)
Serverless Framework 使ってる話(node.js)Serverless Framework 使ってる話(node.js)
Serverless Framework 使ってる話(node.js)
 
プロビジョニングの今 ーフルマネージド・サービスを目指してー #cmdevio2016 #E
プロビジョニングの今 ーフルマネージド・サービスを目指してー  #cmdevio2016 #Eプロビジョニングの今 ーフルマネージド・サービスを目指してー  #cmdevio2016 #E
プロビジョニングの今 ーフルマネージド・サービスを目指してー #cmdevio2016 #E
 
Akka-Streams in Production
Akka-Streams in ProductionAkka-Streams in Production
Akka-Streams in Production
 
サーバレスアーキテクチャを実戦投入するにあたって知るべきこと
サーバレスアーキテクチャを実戦投入するにあたって知るべきことサーバレスアーキテクチャを実戦投入するにあたって知るべきこと
サーバレスアーキテクチャを実戦投入するにあたって知るべきこと
 
サーバサイドエンジニアが 1年間まじめにSPAやってみた
サーバサイドエンジニアが 1年間まじめにSPAやってみたサーバサイドエンジニアが 1年間まじめにSPAやってみた
サーバサイドエンジニアが 1年間まじめにSPAやってみた
 
AWS Lambda + Python資料 ver0.94 20160825
AWS Lambda + Python資料 ver0.94 20160825AWS Lambda + Python資料 ver0.94 20160825
AWS Lambda + Python資料 ver0.94 20160825
 
AWS クックパッドの運用事例
AWS クックパッドの運用事例AWS クックパッドの運用事例
AWS クックパッドの運用事例
 

Ähnlich wie ネタじゃないScala.js

Playbay Play 2.0 plugin イロハのイ
Playbay Play 2.0 plugin イロハのイPlaybay Play 2.0 plugin イロハのイ
Playbay Play 2.0 plugin イロハのイ
Kazuhiro Hara
 
Scala.jsはじめました!
Scala.jsはじめました!Scala.jsはじめました!
Scala.jsはじめました!
K Kinzal
 

Ähnlich wie ネタじゃないScala.js (20)

【LT】 怖くない恐怖のScala.js
【LT】 怖くない恐怖のScala.js【LT】 怖くない恐怖のScala.js
【LT】 怖くない恐怖のScala.js
 
とりあえず使えるSBT
とりあえず使えるSBTとりあえず使えるSBT
とりあえず使えるSBT
 
Asset Pipeline for Perl
Asset Pipeline for PerlAsset Pipeline for Perl
Asset Pipeline for Perl
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.js
 
Play framework 2.0のちょっとした紹介
Play framework 2.0のちょっとした紹介Play framework 2.0のちょっとした紹介
Play framework 2.0のちょっとした紹介
 
Playbay Play 2.0 plugin イロハのイ
Playbay Play 2.0 plugin イロハのイPlaybay Play 2.0 plugin イロハのイ
Playbay Play 2.0 plugin イロハのイ
 
Scala.jsはじめました!
Scala.jsはじめました!Scala.jsはじめました!
Scala.jsはじめました!
 
Scalaの現状と課題
Scalaの現状と課題Scalaの現状と課題
Scalaの現状と課題
 
ScalaでASICやFPGA用の回路を設計するChisel
ScalaでASICやFPGA用の回路を設計するChiselScalaでASICやFPGA用の回路を設計するChisel
ScalaでASICやFPGA用の回路を設計するChisel
 
成長を加速する minne の技術基盤戦略
成長を加速する minne の技術基盤戦略成長を加速する minne の技術基盤戦略
成長を加速する minne の技術基盤戦略
 
Seasar ユーザだったプログラマが目指す OSS の世界展開 #seasarcon
Seasar ユーザだったプログラマが目指す OSS の世界展開 #seasarconSeasar ユーザだったプログラマが目指す OSS の世界展開 #seasarcon
Seasar ユーザだったプログラマが目指す OSS の世界展開 #seasarcon
 
Skinny Framework で始めた Scala
Skinny Framework で始めた ScalaSkinny Framework で始めた Scala
Skinny Framework で始めた Scala
 
サンプルアプリケーションで学ぶApache Cassandraを使ったJavaアプリケーションの作り方
サンプルアプリケーションで学ぶApache Cassandraを使ったJavaアプリケーションの作り方サンプルアプリケーションで学ぶApache Cassandraを使ったJavaアプリケーションの作り方
サンプルアプリケーションで学ぶApache Cassandraを使ったJavaアプリケーションの作り方
 
Scalaでのプログラム開発
Scalaでのプログラム開発Scalaでのプログラム開発
Scalaでのプログラム開発
 
PlayFramework 2.0 Javaと WebSocketでつくる リアルタイムMVC Webアプリケーション
PlayFramework 2.0 Javaと WebSocketでつくる リアルタイムMVC WebアプリケーションPlayFramework 2.0 Javaと WebSocketでつくる リアルタイムMVC Webアプリケーション
PlayFramework 2.0 Javaと WebSocketでつくる リアルタイムMVC Webアプリケーション
 
Scala.js触ってみた
Scala.js触ってみたScala.js触ってみた
Scala.js触ってみた
 
Sbtのマルチプロジェクトはいいぞ
SbtのマルチプロジェクトはいいぞSbtのマルチプロジェクトはいいぞ
Sbtのマルチプロジェクトはいいぞ
 
scala+liftで遊ぼう
scala+liftで遊ぼうscala+liftで遊ぼう
scala+liftで遊ぼう
 
sbtマルチプロジェクトビルドの使いどころ
sbtマルチプロジェクトビルドの使いどころsbtマルチプロジェクトビルドの使いどころ
sbtマルチプロジェクトビルドの使いどころ
 
SwaggerとAPIのデザイン
SwaggerとAPIのデザインSwaggerとAPIのデザイン
SwaggerとAPIのデザイン
 

Mehr von takezoe

Journey of Migrating Millions of Queries on The Cloud
Journey of Migrating Millions of Queries on The CloudJourney of Migrating Millions of Queries on The Cloud
Journey of Migrating Millions of Queries on The Cloud
takezoe
 
GitBucket: Git Centric Software Development Platform by Scala
GitBucket:  Git Centric Software Development Platform by ScalaGitBucket:  Git Centric Software Development Platform by Scala
GitBucket: Git Centric Software Development Platform by Scala
takezoe
 
Scala製機械学習サーバ「Apache PredictionIO」
Scala製機械学習サーバ「Apache PredictionIO」Scala製機械学習サーバ「Apache PredictionIO」
Scala製機械学習サーバ「Apache PredictionIO」
takezoe
 
Tracing Microservices with Zipkin
Tracing Microservices with ZipkinTracing Microservices with Zipkin
Tracing Microservices with Zipkin
takezoe
 
Type-safe front-end development with Scala
Type-safe front-end development with ScalaType-safe front-end development with Scala
Type-safe front-end development with Scala
takezoe
 
GitBucket: The perfect Github clone by Scala
GitBucket: The perfect Github clone by ScalaGitBucket: The perfect Github clone by Scala
GitBucket: The perfect Github clone by Scala
takezoe
 
Play2実践tips集
Play2実践tips集Play2実践tips集
Play2実践tips集
takezoe
 

Mehr von takezoe (20)

Journey of Migrating Millions of Queries on The Cloud
Journey of Migrating Millions of Queries on The CloudJourney of Migrating Millions of Queries on The Cloud
Journey of Migrating Millions of Queries on The Cloud
 
GitBucket: Open source self-hosting Git server built by Scala
GitBucket: Open source self-hosting Git server built by ScalaGitBucket: Open source self-hosting Git server built by Scala
GitBucket: Open source self-hosting Git server built by Scala
 
Testing Distributed Query Engine as a Service
Testing Distributed Query Engine as a ServiceTesting Distributed Query Engine as a Service
Testing Distributed Query Engine as a Service
 
Revisit Dependency Injection in scala
Revisit Dependency Injection in scalaRevisit Dependency Injection in scala
Revisit Dependency Injection in scala
 
How to keep maintainability of long life Scala applications
How to keep maintainability of long life Scala applicationsHow to keep maintainability of long life Scala applications
How to keep maintainability of long life Scala applications
 
GitBucket: Git Centric Software Development Platform by Scala
GitBucket:  Git Centric Software Development Platform by ScalaGitBucket:  Git Centric Software Development Platform by Scala
GitBucket: Git Centric Software Development Platform by Scala
 
Non-Functional Programming in Scala
Non-Functional Programming in ScalaNon-Functional Programming in Scala
Non-Functional Programming in Scala
 
Scala警察のすすめ
Scala警察のすすめScala警察のすすめ
Scala警察のすすめ
 
Scala製機械学習サーバ「Apache PredictionIO」
Scala製機械学習サーバ「Apache PredictionIO」Scala製機械学習サーバ「Apache PredictionIO」
Scala製機械学習サーバ「Apache PredictionIO」
 
The best of AltJava is Xtend
The best of AltJava is XtendThe best of AltJava is Xtend
The best of AltJava is Xtend
 
Tracing Microservices with Zipkin
Tracing Microservices with ZipkinTracing Microservices with Zipkin
Tracing Microservices with Zipkin
 
Type-safe front-end development with Scala
Type-safe front-end development with ScalaType-safe front-end development with Scala
Type-safe front-end development with Scala
 
Scala Frameworks for Web Application 2016
Scala Frameworks for Web Application 2016Scala Frameworks for Web Application 2016
Scala Frameworks for Web Application 2016
 
Macro in Scala
Macro in ScalaMacro in Scala
Macro in Scala
 
Java9 and Project Jigsaw
Java9 and Project JigsawJava9 and Project Jigsaw
Java9 and Project Jigsaw
 
Reactive database access with Slick3
Reactive database access with Slick3Reactive database access with Slick3
Reactive database access with Slick3
 
markedj: The best of markdown processor on JVM
markedj: The best of markdown processor on JVMmarkedj: The best of markdown processor on JVM
markedj: The best of markdown processor on JVM
 
Excel方眼紙を支えるJava技術 2015
Excel方眼紙を支えるJava技術 2015Excel方眼紙を支えるJava技術 2015
Excel方眼紙を支えるJava技術 2015
 
GitBucket: The perfect Github clone by Scala
GitBucket: The perfect Github clone by ScalaGitBucket: The perfect Github clone by Scala
GitBucket: The perfect Github clone by Scala
 
Play2実践tips集
Play2実践tips集Play2実践tips集
Play2実践tips集
 

ネタじゃないScala.js