Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Hello Kotlin Js
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
mattak
October 28, 2015
Programming
780
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Hello Kotlin Js
My first impression of kotlin js.
mattak
October 28, 2015
More Decks by mattak
See All by mattak
人間はどこまでさぼれるか? AIコーディングで人の関与を計測してみた
mattak
0
9
最近やった作業環境改善施策10個
mattak
0
310
UnixTime is Simple
mattak
0
270
おっさんが停滞しないために
mattak
32
18k
tech invest
mattak
1
370
Nodux - node base redux framework
mattak
0
1.6k
what_is_technical_investment
mattak
0
180
unitypackage distribution
mattak
0
890
Unity energy usage
mattak
0
990
Other Decks in Programming
See All in Programming
OSもどきOS
arkw
0
580
AI 時代のソフトウェア設計の学び方
masuda220
PRO
29
13k
JJUG CCC 2026 Spring: JSpecify で実現する Kotlin フレンドリーな Java API 設計
ternbusty
1
180
Snowflake Summitでの新機能 CoCo / CoWork / snowflake-summit-2026-overall-what-new-coco
tatsuhiro
1
160
Semantic Version 単位で戦略を柔軟に変えて、パッケージアップデートを自動化する
daitasu
1
270
TAKTでAI駆動開発の品質を設計する
j5ik2o
7
1.4k
LLMによるContent Moderationの本番運用の裏側と品質担保への挑戦
suikabar
3
720
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
4
1.4k
Creating Composable Callables in Contemporary C++
rollbear
0
150
ふつうのFeature Flag実践入門
irof
8
4.1k
依存関係から依存物へ―Dependencyという言葉の歴史をひも解く
j_lee
0
120
エンジニアと一緒にテストコードの設計と実装を改善した話
mototakatsu
0
210
Featured
See All Featured
Google's AI Overviews - The New Search
badams
0
1k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
750
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
270
Practical Orchestrator
shlominoach
191
11k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.6k
Un-Boring Meetings
codingconduct
0
320
Documentation Writing (for coders)
carmenintech
77
5.4k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.5k
Docker and Python
trallard
47
3.9k
エンジニアに許された特別な時間の終わり
watany
107
250k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.2k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
950
Transcript
Kotlin Js ͞ΘͬͯΈͨ (PUBOEBKT !NBUUBL
Kotlinʁ
ܕ҆શ, JVMݴޠ
Androidʹ͓͚Δ SwiftͬΆ͍ݴޠ Androidք۾ͩͱ Better Javaͳ։ൃݴޠͱͯ͠ɺྲྀߦΓग़ͯ͠Δ
Kotlin.jsͱʁ
JVMܥͷAlt JSݴޠͰ͢ - ੩的型付け - 型安全、Null安全 - Kotlinライブラリが使える - クライアント/サʔバʔがKotlinで書ける
- JetBrainsが作ってるのでEditorサポʔトが早い! ࢀߟIUUQZZZBOLCMPHTQPUKQLPUMJOBMUKTLPUMJOIUNM
type safeʹ html͕͔͚ͨΓ͢Δ ࢀߟ: https://kotlinlang.org/docs/reference/type-safe-builders.html
͍ํ - ύλʔϯ1. gradle -
1. SDKMan $ curl -s get.sdkman.io | bash
2. gradle install $ sdk use gradle 2.8
buildscript { ext.kotlin_version = '1.0.0-beta-1038' repositories { mavenCentral() } dependencies
{ classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version" } } apply plugin: "kotlin2js" repositories { mavenCentral() } dependencies { compile "org.jetbrains.kotlin:kotlin-js-library:$kotlin_version" } compileKotlin2Js.kotlinOptions.sourceMap = true compileKotlin2Js.kotlinOptions.outputFile = "${projectDir}/web/js/app.js" compileKotlin2Js.kotlinOptions.suppressWarnings = true compileKotlin2Js.kotlinOptions.verbose = true task copyJsFilesFromDependencies(dependsOn: build) { configurations.compile.each { File file -> copy { includeEmptyDirs = false from zipTree(file.absolutePath) into "${projectDir}/web/js/lib" include { fileTreeElement -> def path = fileTreeElement.path path.endsWith(".js") && (path.startsWith("META-INF/resources/") || !path.startsWith("META-INF/")) } } } }
buildscript { ext.kotlin_version = '1.0.0-beta-1038' repositories { mavenCentral() } dependencies
{ classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version" } } apply plugin: "kotlin2js" repositories { mavenCentral() } dependencies { compile "org.jetbrains.kotlin:kotlin-js-library:$kotlin_version" } compileKotlin2Js.kotlinOptions.sourceMap = true compileKotlin2Js.kotlinOptions.outputFile = "${projectDir}/web/js/app.js" compileKotlin2Js.kotlinOptions.suppressWarnings = true compileKotlin2Js.kotlinOptions.verbose = true task copyJsFilesFromDependencies(dependsOn: build) { configurations.compile.each { File file -> copy { includeEmptyDirs = false from zipTree(file.absolutePath) into "${projectDir}/web/js/lib" include { fileTreeElement -> def path = fileTreeElement.path path.endsWith(".js") && (path.startsWith("META-INF/resources/") || !path.startsWith("META-INF/")) } } } } 3. build.gradleॻ͘
4. ίʔυॻ͘
5. build͢Δ $ gradle clean build
ίʔυ͕ग़ྗ͞ΕΔ
σΟϨΫτϦߏ $ find . -type f . ├── build.gradle ├──
src │ └── main │ └── kotlin │ └── me │ └── mattak │ └── example │ └── kotlinjs │ └── main.kt └── web ├── index.html └── js ├── app.js ├── app.js.map └── lib ├── kotlin.js └── stdlib.meta.js
͍ํ - ύλʔϯ2. homebrew -
1. brew install $ brew install kotlin
2. ίʔυΛॻ͘
3. convert͢Δ $ kotlinc-js main.kt -output main.js
ίʔυ͕ग़ྗ͞ΕΔ
͍ํ - ύλʔϯ3. ΏͱΓΉ͚ -
try.kotlinlang.org
ͦͷଞಛ
Q. ϥϯλΠϜͷαΠζ ͱ͔େ͖͍ΜͰ͠ΐ͏ʁ
A. ͏Μ $ ls -lha web/js/lib/ total 1912 drwxr-xr-x 4
mattak staff 136B 10 27 17:39 . drwxr-xr-x 3 mattak staff 102B 10 27 17:39 .. -rw-r--r-- 1 mattak staff 804K 10 27 17:39 kotlin.js -rw-r--r-- 1 mattak staff 146K 10 27 17:39 stdlib.meta.js minifyͯ͠ͳ͍͚Ͳ jsͷϥΠϒϥϦͱͯ݁͠ߏαΠζͰ͔͍
Q. JavaͷϥΠϒϥϦ ͱ͔ݺͼग़ͤΔͷʁ
A. Ұ෦Αͼͩͤ·͢
Q. طଘͷJsͷϥΠϒ ϥϦͱ࿈ܞͰ͖Δͷʁ
A. native annotaionͰఆٛॻ͚ ͔ͭ͑ΔͬΆ͍ ࢀߟ: http://www.slideshare.net/mikeneck/kotlin-as-an-altjs/19
Q. ࣮༻తʁ
A. ͦΜͳ࣮༻త͡Όͳ͍͔ - js系の他の文化とあんまり親和してない - javaの資࢈もあんまり活きてない - Alt JSな型安全言語では、TypeScriptのほうが࣮用的かも
݁ - ݱঢ়ͩͱ͓ͪΌͰɺ࣮༻తͰͳ͍͔ - ͋ͱࠓnpm͔ΒཧͰ͖ͳ͍Α - type safe html builderͱ͔໘നͦ͏
αϯϓϧͱ͔ https://github.com/mattak/KotlinJsSample