Upgrade to Pro — share decks privately, control downloads, hide ads and more …

tkow-Angular2入門者の会発表資料

tkow
October 14, 2016

 tkow-Angular2入門者の会発表資料

Leverages渋谷ヒカリエオフィスで開催された10/3 Angular2入門者の会で発表させていただいた際の
http://connpass.com/event/40251/
スライドです。

tkow

October 14, 2016
Tweet

More Decks by tkow

Other Decks in Technology

Transcript

  1. ࣗݾ঺հ ❖ ৘ใܥͷେֶӃੜ म࢜̎೥ ❖ ϑϩϯτΤϯυ/όοΫΤϯυ྆ํ΍Δਓ ❖ ։ൃܦݧ
 C#,C++,C,Java,Python,PHP,javascript,ruby,Swift,julia ❖

    SIerͱϕϯνϟʔاۀͰϓϩάϥϚͷमߦΛ1೥൒΄Ͳ ❖ react,Angular1.xܥ͸৮ͬͨࣄ͕͋Γ·͕͢,Angular2͸ࠓճॳΊͯ ❖ དྷ೥͔ΒLeveragesͷࣾһʹͳΓ·͢
  2. Angular2ॴײ ❖ ྑ͔ͬͨ఺ ❖ ComponentͱLayout͕෼཭ग़དྷΔͷͰ࠶ར༻ੑ,มߋʹ͓͚Δॊೈੑ͕ߴ͍ ❖ CSSͷ෼཭͕ྑ͍(શମͷCSSΛ೺Ѳ͠ͳͯ͘΋ྑ͍࢓૊Έ) ❖ ΫϥΠΞϯταΠυRouting͕ڧྗ ❖

    TypeScriptͷImport ,Exportͷؔ܎͕Θ͔Γ΍͍͢ͷͰJSϑΝΠϧΛૄ݁߹ʹ͠΍͍͢ ❖ Pipe͕͍͢͝ ❖ γʔϜϨεʹView͕ߋ৽͞ΕΔͷ͕͍͢͝ ❖ react-native + angular2 ͱ͍͏஍ຯʹ͍͢͝ϚϧνϓϥοτϑΥʔϜ։ൃϓϩδδΣΫ τ͕࣮ݱ͍ͯ͠Δ ❖ ng-cli͕͔ͳΓظ଴Ͱ͖Δ(railsίϚϯυฒΈʹศརʹͳΓͦ͏)
  3. Angular2ॴײ ❖ ਏ͔ͬͨ఺ ❖ ֶशίετ͸ߴ͍(TypeScript,ಠࣗͷsyntax,ActiveRouter,Component,Decorator,ng~) ❖ ώΞυΩϡϝϯτʹhtml΍cssΛॻ͚ΔͷͰԿ΋ߟ͑ͣʹ࢖͏ͱSyntax΍indent͕ࠅ͍͜ͱʹͳΔ (ϑΝΠϧΛ෼཭͢Δ͜ͱͰղܾ) ❖ *ngForͳͲ,λάͷதʹίʔυΛॻ͘ͷʹҧ࿨ײ(׳Εͷ໰୊ʁ)

    ❖ ֊૚෼͚ͳͲͷઃఆΛࣗ෼Ͱ͠ͳ͍ͱ,τϥϯεύΠϧϑΝΠϧ͕ࢄΒ͔Δ(webpackͰjsͷग़ྗઌΛ มߋग़དྷͨͷͰ,ࠓޙͷن໿Խ΍CLIʹΑΔࣗಈ֊૚෼͚ʹظ଴ ɻ) ❖ ͋͘·ͰframeworkͳͷͰ,طଘͷprojectʹ͙͢ʹಋೖͰ͖Δ਌࿨ੑ͸͋·Γͳ͍ײ͕ͨ͡͠ (webpack΍ng-cliͳͲͰಠཱͨ͠applicationͱͯ͠طଘͷϓϩμΫτʹͭͳ͙ͷ͸؆୯ͦ͏) ❖ ઃఆϑΝΠϧଟ͗͢໰୊(ng-cliʹࣗಈԽؤுͬͯཉ͍͠) ❖ έόϒέʔεʹҧ࿨ײ ❖ ΠϕϯτϑοΫ΍ΞχϝʔγϣϯΛ෇͚Δํ๏Λ·ͩ׬શʹ೺ѲͰ͖͍ͯͳ͍(CSSϝΠϯͱ͍͏ᷚ)
  4. Angular2ॴײ ❖ ·ͱΊ ❖ ؅ཧ͕೉͍͠jsϑΝΠϧΛΧϓηϧԽ͢ΔͨΊςετ΋΍Γ΍͘͢ อकੑ͕ߴ͍ͷͰ৽نϓϩδΣΫτͰ࢖͍͚ͬͯͦ͏ ❖ ng-cli΍npm,webpackͳͲΛಋೖ͢Δ͜ͱͰ,τϥϯεύΠϧ࣌ͷ ϑΝΠϧ؅ཧ΋؆୯ʹͳΓͦ͏ ❖

    ϑΝΠϧͷมߋʹରͯ͠,ଈ࣌Ԡ౴ͳͷͰσόοά͠΍͍͢ ❖ ΞϓϦέʔγϣϯͷن໛͕͋·Γେ͖͘ͳ͚Ε͹طଘͷίʔυΛ ॻ͖׵͑Δίετͷํ͕ߴͦ͏ ❖ ͜ΕΛ΋ͬͱԡ͑͞ͱ͚ͱ͍͏͜ͱ͕͋Ε͹ੋඇڭ͍͑ͯͩ͘͞ɻ