Web Componentsを使ったウィジェット埋め込みの話

Slide 1

Slide 1 text

8FC$PNQPOFOUTΛ࢖ͬͨ ΢ΟδΣοτຒΊࠐΈͷ࿩ 5VF"OPUIFSXPSLTY4NBSU)3'SPOU&OE%FFQ%JWF OBCFMJXP 4NBSU)3ϓϩμΫτΤϯδχΞ

Slide 2

Slide 2 text

ࣗݾ঺հ OBCFMJXP 4NBSU)3 ϓϩμΫτΤϯδχΞάϧʔϓ ϓϥοτϑΥʔϜ։ൃϢχοτ ϑϩϯτΤϯυΤϯδχΞ 5ZQF4DSJQU 3FBDU /FYUKTͳͲ

Slide 3

Slide 3 text

ϓϥοτϑΥʔϜࣄۀͷ͝঺հ

Slide 4

Slide 4 text

CONFIDENTIAL ͜͜ʹηΫγϣϯλΠτϧΛ ೖΕͯΈΑ͏ʂ

Slide 5

Slide 5 text

4NBSU)31MVTЌ൛ͱ͸ w 4NBSU)3Λ΋ͬͱศརʹ׆༻͢ΔͨΊͷ֎෦ ΞϓϦέʔγϣϯΛಋೖͰ͖ΔΞϓϦετΞ w Ϣʔβʔͱ֎෦ΞϓϦέʔγϣϯύʔτφʔ Λͭͳ͙ͨΊͷ৽͍͠ίϛϡχέʔγϣϯ νϟωϧ

Slide 6

Slide 6 text

ࠓ೔࿩͢͜ͱ

Slide 7

Slide 7 text

ࠓ೔࿩͢͜ͱ w 1'ࣄۀͰ8FC$PNQPOFOUTΛ࠾༻ͨ͠࿩ w ͳͥ8FC$PNQPOFOUTΛ࠾༻ͨ͠ͷ͔ w ࣮ࡍʹ࢖ͬͯΈͯͲ͏͔ͩͬͨ w ࠓޙͷ1'ࣄۀͷٕज़తͳల๬

Slide 8

Slide 8 text

8FC$PNQPOFOUTͬͯ ͦ΋ͦ΋ͳΜ͚ͩͬͷ͓͞Β͍

Slide 9

Slide 9 text

8FC$PNQPOFOUTͱ͸ w ࠶ར༻ՄೳͳΧελϜཁૉ w 4IBEPX%0.ʹΑΔΧϓηϧԽ w )5.-ςϯϓϨʔτʹΑΔϚʔΫΞοϓ w ΢Σϒඪ४

Slide 10

Slide 10 text

8FC$PNQPOFOUTͷ"1*Λϥοϓͯ͠؆୯ʹѻ͑ ΔΑ͏ʹͨ͠ϥΠϒϥϦɻ 4NBSU)3Ͱ͸-JUΛ࢖༻ͯ͠ΧελϜཁૉΛ࡞ͬͯ ͍·͢ɻ

Slide 11

Slide 11 text

1'ࣄۀͰ8FC$PNQPOFOUT Λ࠾༻ͨ͠࿩

Slide 12

Slide 12 text

௨ۈܦ࿏ݕࡧ w ग़ൃ஍ɺ໨త஍ɺ௨ۈखஈΛೖྗ͢Δͱࣗಈ Ͱ௨ۈܦ࿏΍௨ۈඅΛग़ͯ͘͠ΕΔ w /"7*5*.&ͱ(PPHMF.BQͷ"1*Λ࢖༻ͯ͠ ͍Δ w طଘͷैۀһฤूը໘Λ֦ு͢Δ

Slide 13

Slide 13 text

ΦϓγϣϯػೳΛΠϯετʔϧ

Slide 14

Slide 14 text

ैۀһ߲໨͕ΧελϚΠζ͞ΕΔ

Slide 15

Slide 15 text

௨ۈܦ࿏ݕࡧػೳͷٕज़తͳ࢓༷ w Πϯετʔϧ͠ͳ͍ͱ࢖͑ͳ͍ w Πϯετʔϧ͢Δͱैۀһ৘ใฤूը໘ʹ௨ ۈܦ࿏༻ͷϑΥʔϜ΢ΟδΣοτ͕֎෦͔Βຒ Ίࠐ·ΕΔ w ΢ΟδΣοτͷ࣮૷͸4NBSU)3಺ʹ͸ͳ͍

Slide 16

Slide 16 text

΢ΟδΣοτͷ࣮૷͕֎ʹ͋Δཧ༝ w ࠓޙ΋ΦϓγϣϯػೳͰΠϯετʔϧ͞Εͨػೳ͕ 4NBSU)3಺ʹຒΊࠐ·Ε͍ͯ͘ w શͯ4NBSU)3಺ʹ࣮૷͍ͯ͘͠ͱΦϓγϣϯػೳ௥ Ճͷ౓ʹ4NBSU)3Ͱ৽ن࣮૷͠ͳ͍ͱ͍͚ͳ͍ w ࠓޙSEύʔςΟ੡ΞϓϦΛ૿΍͍ͯ͘͠ w ֎ͷΞϓϦଆͰ΢ΟδΣοτΛ࡞Δܗʹ͍ͨ͠

Slide 17

Slide 17 text

ຒΊࠐΈ΢ΟδΣοτΛ 8FC$PNQPOFOUTͰ࣮૷͍ͯ͠·͢

Slide 18

Slide 18 text

ͳͥ8FC$PNQPOFOUTΛ ࠾༻ͨ͠ͷ͔

Slide 19

Slide 19 text

8FC$PNQPOFOUT࠾༻ཧ༝ w 4NBSU)3ଆͷ΢ΟδΣοτຒΊࠐΈͷهड़Λ γϯϓϧʹ͔ͨͬͨ͠ w ΢ΟδΣοτ͸֎͔ΒͷӨڹΛड͚ͣɺ֎ʹӨ ڹΛ༩͑ͳ͍ܗʹ͔ͨͬͨ͠ w 4NBSU)3ͷϑϩϯτΤϯυͷෳࡶੑͷഎܠ

Slide 20

Slide 20 text

΢ΟδΣοτຒΊࠐΈΛγϯϓϧʹ w ࠓޙຒΊࠐΈ͍ͨΞϓϦͷ਺ɺ΢ΟδΣοτͷ ਺͸ͲΜͲΜ૿͍͑ͯ͘૝ఆ w ͭͳ͗͜Έ෦෼Λγϯϓϧʹ͠ͱ͔ͳ͍ͱޙʑ ා͍ w 8FC$PNQPOFOUTͰ͋Ε͹4NBSU)3ଆ͸ +4ΛಡΈࠐΜͰΧελϜཁૉΛݺͿ͚ͩ

Slide 21

Slide 21 text

ຒΊࠐΈ࣮૷ͷྲྀΕ w ຒΊࠐΈ͍ͨΞϓϦଆͰίϯϙʔωϯτΛ࣮૷ ͢Δ w ΧελϜཁૉ໊ͱϏϧυͨ͠+4ͷύεΛ 4NBSU)3ʹ౉͢ w 4NBSU)3ଆ͸΋Βͬͨ৘ใΛઃఆϑΝΠϧͰ ؅ཧ͢Δ

Slide 22

Slide 22 text

˞IBNMͰ͢ ˞આ໌͠΍͍͢Α͏৭ʑม͑ͯॻ͍ͯ·͢

Slide 23

Slide 23 text

4NBSU)3 ௨ۈܦ࿏ݕࡧ ϑΥʔϜ࣮૷ σʔλϕʔε 8FC$PNQPOFOUT ʹΑΔΧελϜ ϑΥʔϜ࣮૷ Ϗϧυͨ͠+4 ૢ࡞ Ϗϧυ $IBOHF&WFOU %JTQBUDI 4VCTDSJCF ߋ৽

Slide 24

Slide 24 text

௨ۈܦ࿏ݕࡧػೳͷ8FC$PNQPOFOUTͱ 4NBSU)3ͷ΍ΓऔΓ͸ ΠϕϯτͷEJTQBUDIͱTVCTDSJCFͷΈ

Slide 25

Slide 25 text

ӨڹΛ༩͑ͳ͍ܗʹ͔ͨͬͨ͠ w 8FC$PNQPOFOUTͰ͋Ε͹ΧελϜԽ͞Εͯ ͍ΔͷͰɺ4NBSU)3ଆͷάϩʔόϧͳελΠ ϧͷӨڹΛड͚ͳ͍ w 8FC$PNQPOFOUT಺ͷ࣮૷ʹΑΓ4NBSU)3 ଆͷ6*Λյ͞ͳ͍

Slide 26

Slide 26 text

ͦΕͬͯ3FBDUͰྑ͍ͷͰ͸ʜʁ

Slide 27

Slide 27 text

4NBSU)3ͷϑϩϯτΤϯυͷෳࡶੑ w ैۀһ৘ใΛมߋ͢Δํ๏͸ैۀһ৘ใฤूը໘ ͱਃ੥ϑΥʔϜͷ௨Γ͋Δ w ैۀһ৘ใฤूը໘͸IBNMK2VFSZɺਃ੥ ϑΥʔϜ͸3FBDUͰಈ͍͍ͯΔ w ͲͪΒͷύλʔϯͰ΋ಉ͡ܗࣜͰѻ͏ͨΊʹ 8FC$PNQPOFOUTʹ͍ͯ͠Δ

Slide 28

Slide 28 text

࣮ࡍʹ࢖ͬͯΈͯͲ͏͔ͩͬͨ

Slide 29

Slide 29 text

ྑ͔ͬͨͱ͜Ζ w બఆཧ༝ʹॻ͍࣮ͨݱ͍ͨ͜͠ͱ͸શͯ໰୊ͳ͘ ࣮ݱͰ͖ͨ w 4NBSU)3ͷෳࡶͳࣄ৘Λ8FC$PNQPOFOUT ଆ͕഑ྀ͢Δඞཁ͕ͳ͍ w γϯϓϧͳΠϯλʔϑΣʔε

Slide 30

Slide 30 text

೉͍͠ͱ͜Ζ w 4NBSU)36*͕࢖͑ͳ͍😭 w %JTQBUDIͱ4VCTDSJCFͷΈͱ͍͏औΓܾΊ͸͠ ͯΔ͕ɺϧʔϧ͸؆୯ʹ΍ΔͿ͜ͱ͕Ͱ͖Δͷ ͰSEύʔςΟʹಉ͡΍ΓํΛͤ͞Δͷ͸ةͳ͍

Slide 31

Slide 31 text

w 4NBSU)3ͷϓϩμΫτͰ൚༻తʹ࢖͑Δ3FBDU ίϯϙʔωϯτू w #VUUPO *OQVUͳͲͷγϯϓϧͳཁૉ͸΋ͪΖ Μɺ%JBMPH΍%SPQEPXO %BUF1JDLFSͷΑ͏ͳ ෳࡶͳ΋ͷ΋͋Γͱͯ΋ศར

Slide 32

Slide 32 text

4NBSU)36*͕࢖͑ͳ͍😭 w 4NBSU)3ͷ6*ͷ$44Λίϐʔͯ͠࢖͏Έ͍ͨ ͳ͜ͱΛ͍ͯͨ͠ w ෳࡶͳ΋ͷ͸೉͍͠ͷͰɺಉ͡%BUF1JDLFSͳͷ ʹϑΥʔϜ͝ͱʹݟͨ໨ҧ͏ͱ͍͏͜ͱʹͳͬͯ ͠·ͬͨ

Slide 33

Slide 33 text

4NBSU)36* 8FC$PNQPOFOUT

Slide 34

Slide 34 text

ࠓޙΛݟਾ͑ͨ੬ऑੑͷ࿩ w 8FC$PNQPOFOUT಺ͷίʔυ͕4NBSU)3಺Ͱ ࣮ߦ͞ΕΔͨΊɺ΍Ζ͏ͱࢥ͑͹ͳΜͰ΋Ͱ͖Δ w SEύʔςΟʹຒΊࠐΈ΢ΟδΣοτΛ։์͢Δ ͱ͖͸αϯυϘοΫεԽͷ࢓૊ΈΛ༻ҙ͠ͳ͍ͱ ͍͚ͳ͍

Slide 35

Slide 35 text

ࠓޙͷ1'ࣄۀͷٕज़తͳల๬

Slide 36

Slide 36 text

w 4NBSU)36*ͷ8FC$PNQPOFOUTԽ w αϯυϘοΫεԽͷٕज़ݕ౼

Slide 37

Slide 37 text

4NBSU)36*ͷ8FC$PNQPOFOUTԽ w 3FBDU 7VF 7BOJMMB FUDʜͲ͔͜ΒͰ΋࢖͑Δ Α͏ʹ͍ͨ͠ w 4NBSU)36*Λγϡοͱ8FC$PNQPOFOUTʹ ஔ͖׵͑Δͷ͸೉͍͠ w ·ͣ͸CVUUPOͳͲͷ؆୯ͳ6*Λม͍͑ͯ͘ͳ ͲΛͯ͠ࢼ͍͖͍ͯͨ͠

Slide 38

Slide 38 text

αϯυϘοΫεԽͷٕज़ݕ౼ w JGSBNF w 2VJDL+4Λ8BTNԽ͢Δ w 8FC8PSLFS w 4IBEPX3FBMN"1*