LINEには、エンジニアが最新の技術動向を把握できるよう、海外で開催されるカンファレンスに会社負担で参加できる制度があります。 今回の記事では、その制度を利用して参加してきたプログラミング言語 Kotlin のカンファレンス「KotlinConf 2018」の様子をご報告します。
こんにちは。LINEメッセージングアプリの Android Client を担当している玉木（@r_ralph_h）です。 10月3日から5日にかけてオランダ・アムステルダムにて開催された KotlinConf 2018 に LINE からは総勢9名のエンジニアが参加しました。 この記事では、KotlinConf 2018 の前日ワークショップの内容や、興味深かったセッションについて紹介させていただきます。
KotlinConfとは
2017年に開催された KotlinConf 2017 では Coroutines や iOS サポートの発表など、Kotlin のこれからを表すような発表が行われたりしていました。 今回の Kotlin Conf 2018 はオランダのアムステルダムで開かれました。
前日ワークショップの紹介
KotlinConf 2018 では、10月4日から5日にかけてが通常のカンファレンス、10月3日がほぼ1日を使う追加の前日ワークショップという形でした。 前日ワークショップでは全部で5つのセッションがありました。このうち、「Building a Full Stack Web Application in Kotlin」というワークショップに参加したので、その中身について書きたいと思います。
Building a Full Stack Web Application in Kotlin
直訳すると「Kotlin でフルスタック Web アプリケーションを作ろう」というタイトルですが、普段は Android の開発がメインになっているということで Web 系の内容をチョイスしました。使用した技術としては、フロントエンド側を Kotlin/JS を使用した React.js の Web ページ、バックエンド側を Kotlin JVM と SpringBoot を使用した Web サーバーという構成でした。データベースはグラフ型のデータベースである Neo4j を使用しています。ワークショップでは、「DBと直接やり取りを行うフロントエンドを作る」「サーバー側を作る」「フロント側からサーバーのAPIを呼ぶようにする」3つのステップを経て最終形の Web アプリケーションを作る流れでした。3ステップともプロジェクトを1から作るのではなく、はじめに大まかな説明を聞き、用意されたプロジェクトを使用して開発を行うためスムーズに行うことができました。ここではフロント側で React.js を Kotlin とともに使用したときのサンプルを書きます。以下は新しい React Component を作成するときのコードになります。
class HogeComponent extends React.Component {
constructor(initialProps) {
super(initialProps);
this.state.huga = this.initialProps.huga;
}
componentWillReceiveProps(nextProps) {
this.state.huga = nextProps.huga
}
render() {
return (
<p>
{this.state.huga?.description}
</p>
);
}
}以下は、Kotlin で同じコードを作成した場合になります。
class HogeComponent(initialProps: HogeProps) : RComponent<HogeProps, HogeState>(initialProps) {
init {
state.huga = initialProps.huga
}
override fun componentWillReceiveProps(nextProps: HogeProps) {
state.huga = nextProps.huga
}
override fun RBuilder.render() {
p {
+"${state.huga?.description}"
}
}
} 大きな違いとしては、
- 静的型付けが行われるため、存在しないプロパティへの参照などもまず起きないようになります。
- render 関数内での DOM の作成部分が DSL を使用した形になっており、閉じタグなどのボイラープレートな部分を極力書かなくて済む。
といった点が上げられます。 また、この DSL 形式の DOM の記述はもちろん入れ子にすることもできるので
fun RBuilder.hoge(handler: RHandler<HogeProps>) = child(HogeDetail::class, handler)
override fun RBuilder.render() {
div(classes = "container") {
div(classes = "row") {
h2(classes = "col-8 text-center") { +"Hoge Application" }
}
div(classes = "row mt-1") {
div(classes = "col-9") {
// some thing
}
div(classes = "col-3") {
b { +"Hoge" }
hoge {
attrs {
huga = "Piyo"
}
}
}
}
}
}このような形で構造を作ることもできますし、拡張関数を定義して先程の Component を内部的に直接記述することもできます。
メインセッション
10月4日から5日にかけて行われたメインセッションの紹介です。 Keynote では大きな新しい発表というものは特になく、Kotlinが徐々に各方面で使われ始めているというものをしっかりと強調している感じでした。 （唯一大きなものといえば Coroutines が間もなく experimental が外れ、正式版になるという部分でした）
セッションは2日間で68セッションが開かれ、多くのセッションが Kotlin/Native・Kotlin/JS といったマルチプラットフォーム関連、もしくは Coroutines に触れていました。（Android 固有のものは3セッションと少なめでした） この記事では、その中で特に私が興味深かった「Effective multiplatform Kotlin development」について紹介します。
Effective multiplatform Kotlin development
KotlinConf のセッションの動画とスライドは全て公式サイトから閲覧できるようになっています。 「Effective multiplatform Kotlin development」のセッション動画とスライドはこちらになります。
https://www.youtube.com/watch?v=UyTBXEZ983g
https://resources.jetbrains.com/storage/products/kotlinconf2018/slides/7_Effective%20multiplatform%20development.pdf
このセッションでは、Kotlin をマルチプラットフォーム開発で使用する際にどのようにモジュールを分けるべきかについて話しています。 通常の開発では iOS, Android, Web そしてバックエンドといった全ての環境でバラバラにクラスを定義していたりしたものを解決できるという話になります。
全てのモジュールに存在するクラス、例えばモデルの定義などは全てのモジュールから参照できるcommonモジュールに クライアント側でのビジネスロジックといった部分や、View のインターフェイス定義はcommon-clientモジュールに といった形で共通部分をどんどん上に持っていける感じになっています。
ここまでであれば React Native や Xamarin といったマルチプラットフォームフレームワークと大差なく思えてしまいますが、Kotlin でのマルチプラットフォームの大きな魅力は例えば iOS だけ Swift で開発するということが可能であるという点です。
詳しい構造や詳細なサンプルはセッション主の方の Github にて公開されているのでぜひご覧ください。
https://github.com/MarcinMoskala/KotlinMultiPlatformExample
https://github.com/MarcinMoskala/KotAcademyPortal
終わりに
海外カンファレンスは初めてでしたが、ワークショップ中など、つたない英語をなんとか聞き取ってもらえたりと温かみに触れ合えた3日間でした。