Tweet
Tweet

Slide 1

Slide 1 text

Kotlin/JSͰReactΞϓϦΛ࡞ͬͯΈͨ גࣜձࣾICS ৿ా উॣ ྩ࿨ݩ೥8݄27೔

Slide 2

Slide 2 text

ࣗݾ঺հ ৿ా উॣ (΋Γͨ ·͞ͱ͠) @texdeath લ৬: Ϡϑʔגࣜձࣾ → ݱ৬: גࣜձࣾICS ϑϩϯτΤϯυΤϯδχΞ ීஈ͸React / Vue / Node.js ͋ͨΓΛॻ͍͍ͯ·͢

Slide 3

Slide 3 text

What is Kotlin/JS?

Slide 4

Slide 4 text

KotlinͷίʔυΛJSʹίϯύΠϧ͢Δ KotlinΛJavaScriptͷจ๏Ͱॻ͚Δ ⭕ ❌

Slide 5

Slide 5 text

Kotlin/JSͱ͸ɾɾɾ • KotlinͷϞμϯͳจ๏ΛϑϩϯτΤϯυଆͰ࢖͑Δʂ • ϑϩϯτΤϯυΛKotlinʹدͤΔ͜ͱͰɺ҆શͰ؆ܿʹॻ͚Δ ϝϦοτΛڗडͰ͖Δ • ܕਪ࿦ɾNull҆શɾwhenɾdata classͳͲ • Kotlinࣗମ͕ϚϧνϓϥοτϑΥʔϜݴޠͰ૬ޓӡ༻ੑ͕͋Δ • ReactͷKotlinϥούʔ͕ఏڙ͞Ε͍ͯΔͷͰɺٕज़બఆ΋ָ

Slide 6

Slide 6 text

Kotlin/JSͱ͸ɾɾɾ • KotlinͷϞμϯͳจ๏ΛϑϩϯτΤϯυଆͰ࢖͑Δʂ • ϑϩϯτΤϯυΛKotlinʹدͤΔ͜ͱͰɺ҆શͰ؆ܿʹॻ͚Δ ϝϦοτΛڗडͰ͖Δ • ܕਪ࿦ɾNull҆શɾwhenɾdata classͳͲ • Kotlinࣗମ͕ϚϧνϓϥοτϑΥʔϜݴޠͰ૬ޓӡ༻ੑ͕͋Δ • ReactͷKotlinϥούʔ͕ఏڙ͞Ε͍ͯΔͷͰɺٕज़બఆ΋ָ

Slide 7

Slide 7 text

Kotlin/JSͱ͸ɾɾɾ • KotlinͷϞμϯͳจ๏ΛϑϩϯτΤϯυଆͰ࢖͑Δʂ • ϑϩϯτΤϯυΛKotlinʹدͤΔ͜ͱͰɺ҆શͰ؆ܿʹॻ͚Δ ϝϦοτΛڗडͰ͖Δ • ܕਪ࿦ɾNull҆શɾwhenɾdata classͳͲ • Kotlinࣗମ͕ϚϧνϓϥοτϑΥʔϜݴޠͰ૬ޓӡ༻ੑ͕͋Δ • ReactͷKotlinϥούʔ͕ఏڙ͞Ε͍ͯΔͷͰɺٕज़બఆ΋ָ

Slide 8

Slide 8 text

Sandbox https://try.kotlinlang.org/

Slide 9

Slide 9 text

ఆٛ͞ΕͨKotlinΦϒδΣΫτͷ֬ೝ mainؔ਺ͷΤΫεϙʔτͱݺͼग़͠ ಗ໊ؔ਺શମ͕࣮ߦ͞ΕΔ

Slide 10

Slide 10 text

• create-react-kotlin-app͕Ұ൪ָ • JetBrains͕ϞδϡʔϧͷϥούʔΛग़ͯ͘͠Ε͍ͯΔ • react-routerɺreduxɺwebpackɺstyled-componentͳͲ • KotlinͰॻ͘ϝϦοτΛ่ͣ͞ʹΞϓϦέʔγϣϯͷઃܭ͕Մೳ • ิ׬΋όονϦ • JSͷϞδϡʔϧ΋ΠϯϙʔτͰ͖ΔͷͰɺखܰʹ৮ΕΔ Kotlin/JSͰReactΛѻ͏

Slide 11

Slide 11 text

JetBrains͕ఏڙ͍ͯ͠ΔɺKotlinͰϥοϓͨ͠create-react-app create-react-kotlin-app

Slide 12

Slide 12 text

create-react-kotlin-appΛ࢖ͬͯΈΔ

Slide 13

Slide 13 text

σϞ GitHub URL https://github.com/texdeath/kotlin-todos

Slide 14

Slide 14 text

͜Μͳײ͡Ͱॻ͘ State, RBuilderʹ֦ுؔ਺Λఆٛ είʔϓ಺ʹDOMΛهड़ͯ͠Ώ͘ɻ IntelliJͩͱͲͷείʔϓΛ ࢀরͯ͠Δ͔ग़ͯ͘͠ΕΔ

Slide 15

Slide 15 text

IntelliJ IDEAͷαϙʔτ΋ڧྗ

Slide 16

Slide 16 text

IntelliJ IDEAͷαϙʔτ΋ڧྗ ֦ுؔ਺಺෦ͷthis͕ Ͳ͜Λࢦ͍ͯ͠Δ͔ Ұ໨ͰΘ͔Δ

Slide 17

Slide 17 text

JSͷϞδϡʔϧͷΠϯϙʔτ

Slide 18

Slide 18 text

·ͱΊ • Kotlin/JavaΛॻ͍ͨ͜ͱ͕ͳͯ͘΋΍ΕΔײ • IntelliJ IDEAͰͷิ׬͸ຊ౰ʹڧྗ

Slide 19

Slide 19 text

͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ Copyright 2019 ICS INC. All rights reserved. ৿ా উॣ @texdeath ICS MEDIA΍TwitterͰ΋΢ΣϒςΫϊϩδʔͷ৘ใΛൃ৴த ics.media