Make good (better) form

Slide 1

Slide 1 text

2018/10/16 JAM plus #03 at tambourine commune ͍͍ϑΥʔϜΛͭ͘Ζ͏

Slide 2

Slide 2 text

҆෦૲ຑੜ  Kusamao Abe גࣜձࣾλϯόϦϯ ʢtambourine.incʣ ɾςΫχΧϧσΟϨΫλʔ  ɾWebΤϯδχΞ

Slide 3

Slide 3 text

JAM plusͷ͓͞Β͍ w JAMελοΫˠJavaScriptAPIMarkUpΒ͍͠ w MEANελοΫͱ͔LAMPͱ͔ͦ͏͍͏΍ͭ  ϑϩϯτΤϯυΛࢦ͢Β͍͠ w plusͬͯԿˠ͜ͷϏϧͷ໊લ͕ϓϥεϏϧ w ݄͸։࠵೉͍͔͠΋͠Εͳ͍ʜʜ

Slide 4

Slide 4 text

ͦ͏ɺͦΖͦΖ೥ͷ੉

Slide 5

Slide 5 text

౦ژΦϦϯϐοΫ ͍͖ۙͮͯ·ͨ͠

Slide 6

Slide 6 text

IUUQTOFXTZBIPPDPKQCZMJOFLBOEBUPTIJBLJ

Slide 7

Slide 7 text

͡Ό͋ྑ͍ϑΥʔϜͬͯʁ

Slide 8

Slide 8 text

IUUQTVTJUFKQBMFSUCPYXFCGPSNEFTJHO

Slide 9

Slide 9 text

Kathryn Whitenton͍Θ͘ ୹͘͠Α͏ɻ ؔ࿈ͷ͋Δϥϕϧͱೖྗཝ͸άϧʔϓͰ͋ΔͱݟͯΘ͔ΔΑ͏ʹ͠Α͏ɻ ೖྗཝͷϨΠΞ΢τ͸ΧϥϜʹ͠Α͏ɻ ࿦ཧతͳॱ൪Ͱฒ΂Α͏ɻ ϓϨʔεϗϧμςΩετ͸ར༻͠ͳ͍Α͏ʹ͠Α͏ɻ ೖྗཝ͸ೖྗ಺༰ͷछྨ΍௕͞ʹ߹͏΋ͷʹ͠Α͏ɻ ೖྗ͕೚ҙͷཝͱඞਢͷཝΛݟ෼͚ΒΕΔΑ͏ʹ͠Α͏ɻ ೖྗ΍ϑΥʔϚοτͷཁ݅͸͢΂ͯઆ໌͠Α͏ɻ ʮϦηοτʯϘλϯͱʮΫϦΞʯϘλϯ͸࢖Θͳ͍Α͏ʹ͠Α͏ɻ ໨ʹ෇͖΍͘͢ɺ۩ମతͳΤϥʔϝοηʔδΛఏڙ͠Α͏ɻ

Slide 10

Slide 10 text

͜ΕΛकͬͯΕ͹͍͍ϑΥʔϜʁ

Slide 11

Slide 11 text

୭ʹͱͬͯ΋ʮ͍͍ʯʁ w ։ൃऀ w ࡞Γ΍͍͢ w ϝϯς͠΍͍͢ w ར༻ऀ w ҟͳΔ؀ڥɾ৚݅ԼͰ΋࢖͍΍͍͢ w ໨తΛୡ੒͢Δͷ͕༰қ w ڙڅଆ w ਖ਼͍͠৘ใ͕ೖྗ͞ΕΔ w ׬ྃ཰͕ߴ͍

Slide 12

Slide 12 text

ଟ͘ͷ৔߹ɺ ʮࡾํྑ͠ʯ͸Ή͔͍ͣ͠ʜ

Slide 13

Slide 13 text

ϚδͰ͍͍ϑΥʔϜͷڀۃ

Slide 14

Slide 14 text

ೖྗ͠ͳ͍͍ͯ͘͜ͱͰ͸ʁʁʁ

Slide 15

Slide 15 text

ͦ΋ͦ΋ೖྗ͸ΊΜͲ͍ w Զୡ͸͋ͱԿճϝʔϧΞυϨεΛೖྗ͠ͳ͍ͱ͍͚ͳ͍ͷ͔ w ࣗಈೖྗ͕ޮ͔ͳ͍ϑΥʔϜ΋ͨ͘͞Μ͋Δ w ͳΜ͔΋͏ͥΜͿɺϐοͱ΍ͬͯͰ͖ͳ͍͔ͬ͢ʁʁʁʁʁ

Slide 16

Slide 16 text

ͨͱ͑͹Amazon Pay

Slide 17

Slide 17 text

IUUQTQBZBNB[PODPNKQTIPQQFS

Slide 18

Slide 18 text

Amazon Pay w AmazonͷΞΧ΢ϯτʹొ࿥͞Εܾͨࡁ৘ใͰܾࡁͯ͘͠ΕΔ w ࣄۀऀ͸ܾࡁ৘ใΛอ͓࣋ͯ͘͠ϦεΫΛऔΒͣʹࡁΉ w ॅॴ৘ใ΋͍ͭ΋ͷAmazonͷ΍ͭͰ w ख਺ྉ͸ίϯςϯπͷ4%ʙ4.5%

Slide 19

Slide 19 text

Apple Payͱ͔  Google Pay΋ͦ͏

Slide 20

Slide 20 text

·͋ͦΕ͹͔ͬΓ͡Όͳ͍ΑͶ w ࣗ෼ͷͱ͜ΖͰΞΧ΢ϯτ࡞Βͤͯ*%౷߹ͯ͠."΍Γ͍ͨΑͶʙ w ख਺ྉߴ͍ʂ΍ͩʂ w ͨͩͷ͝ҙݟϑΥʔϜ͔ͩΒͦ΋ͦ΋͍ΒΜͷ͕ͩʙ

Slide 21

Slide 21 text

͍΍͔͠͠େࣄͳ͜ͱͳΜͰ͢

Slide 22

Slide 22 text

ਓ͸ɺؒҧ͑Δʜʜ

Slide 23

Slide 23 text

΋ͷ͕૿͑ΔͱͲ͏ͳΔ͔ w ࡞Δ΋ͷ͕ଟ͍  ˠΤϯόάͷՄೳੑ͕૿͑Δ w ೖྗ͢Δ΋ͷ͕ଟ͍  ˠೖྗΛؒҧ͑ΔՄೳੑ͕૿͑Δ w ؅ཧ͢Δ΋ͷ͕ଟ͍  ˠηΩϡϦςΟࣄނͷՄೳੑ͕૿͑Δ

Slide 24

Slide 24 text

Ͱ΋ɺͲ͏ͯ͠΋ඞཁͳ߲໨͸͋Δ w ๷ࡂɾݮࡂ͠Α͏ w ηΩϡϦςΟ্ͷࣄނΛݮΒ͢ w όάΛݮΒ͢ w ೖྗϛεΛݮΒ͢

Slide 25

Slide 25 text

ϑϩϯτΤϯυΤϯδχΞ  ͕΍Δ͜ͱ

Slide 26

Slide 26 text

όάΛݮΒ͢ w ͍΍·͋౰ͨΓલͳΜ͚͢Ͳ w όϦσʔγϣϯͰ௨͢΂͖ύλʔϯΛ஄͍͍ͯͨͱ͔ w ಛఆͷύλʔϯΛ౿ΉͱΛు͍ͯશ෦ೖྗ಺༰͕ফ͑Δͱ͔ w ૹ৴࣌ʹ৘ใ͕ܽམͯͨ͠ͱ͔

Slide 27

Slide 27 text

ೖྗϛεΛݮΒ͢ w όοΫΤϯυόϦσʔγϣϯ΍ϑϩϯτΤϯυόϦσʔγϣϯ͸  ʮ͋ͬͯ౰ͨΓલʯʹͳ͖ͬͯͨʢ΍ͬͯͳ͍ͳΒ΍Ζ͏ͳʣ w ͦ΋ͦ΋ೖྗΛਖ਼͘͠Ͱ͖ΔΑ͏ʹ͢Δ

Slide 28

Slide 28 text

ྫɿ༣ศ൪߸ w ܻͷ਺ࣈ͔ΒͳΔ೔ຊͷ༣ศ൪߸ w ʮܻܻͷೖྗཝʹ෼͚Α͏ʯ w ʮ൒֯਺ࣈ͚ͩڐ༰ͯ͠΄͔͸Τϥʔʹ͠Α͏ʯ w ʮͦͷ༣ศ൪߸ͰϥΠϒϥϦ͔ΒॅॴҾ͍ͯ  ॅॴ͕ଘࡏ͠ͳ͚Ε͹Τϥʔʹ͠Α͏ʯ

Slide 29

Slide 29 text

Τϥʔʹ͠ͳ͍ͱ͍͏ख๏ w ςΫϊϩδʔͰղܾͰ͖Δ͜ͱ͸ͯ͋͛͠Α͏ w ൒֯਺ࣈ͚ͩ͡Όͳ͘ɺશ֯਺ࣈΛม׵ͯ͋͛͠Α͏ w ඞཁͳ͍จࣈྻ͕ೖͬͯ΋উखʹऔΓআ͘ w ແବʹ෼ׂͯ͠ೖྗͤ͞ͳ͍ɺܻͰόϥ͢ͷ͸ϓϩάϥϜͰͰ͖Δ w ˠσʔλܗࣜΛؒҧ͑Α͏͕ͳ͍

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

w jQueryͰόϦσʔγϣϯ͸ͶɺͭΒ͍ w ͪΐͬͱͨ͠ϑΥʔϜͰ΋Vue.js࢖͏ͱΊͬͬͪΌͪ͘Όָ w σβΠϯͦ͜·Ͱؾʹ͠ͳ͍ͳΒElementUIΛ࢖͏ͱͪΐʙʙʙʙָ

Slide 32

Slide 32 text

ςΫϊϩδʔͰղܾͰ͖ͳ͍͜ͱ΋͋Δ͕ w ͨͱ͑͹ಛघͳ༣ศ൪߸ͱ͍͏ͷ͕ଘࡏ͢Δ w ࠃཱେͷֶੜྈͱ͔ͩͱ൪஍ʹඥͮ͘΋ͷͰ͸ͳ͘ಛघͳ൪߸͕ඥ෇͍ͯ ͍ͯɺ༣ศ൪߸͚ͩͰࢪઃ͕ಛఆͰ͖ΔΑ͏ʹͳ͍ͬͯͨΓ͢Δ  ʢͦ͏͍͏ͷ͸ϥΠϒϥϦͰҾ͚ͳ͍৔߹͕͋Δʣ w ˠҰ֓ʹϥΠϒϥϦͰҾ͔͔ͬΒͳ͍ͳΒଘࡏ͠ͳ͍༣ศ൪߸ͱݴ͑Δ ͔͸Θ͔Βͳ͍

Slide 33

Slide 33 text

IUUQTKBXJLJQFEJBPSHXJLJ&#&#&#'&""&'#

Slide 34

Slide 34 text

Ͱ΋ॅॴؒҧͬͯͨΒࠔΔ w Θ͔Δʂʂʂʂʂʂʂʂ w ΫϩωίϠϚτ͸ձһαʔϏεొ࿥࣌ʹ࣮ࡍʹొ࿥͞Εͨॅॴʹ๚໰ͯ͠ ձһΧʔυΛ౉͢͜ͱͰ͋Δఔ౓ͷޡΓνΣοΫΛ͍ͯͨ͠ w ༣ศ൪߸͕ͳͯ͘΋ՙ෺΍खࢴ͸ಧ͘  ʢ഑ୡॴଆ͕θϯϦϯͷ஍ਤ΍ཤྺ͔Β֬ೝͨ͠Γ͍ͯ͠Δͷ͕΄ͱΜͲʣ

Slide 35

Slide 35 text

ؒҧͬͯͨΒ΍͹͍΋ͷΛݟۃΊΖ w ڧݻͳόϦσʔγϣϯʢόοΫɾϑϩϯτʣ w ೖྗϑΥʔϚοτΛ໌ࣔ͠ɺ  ؒҧ͍ͬͯΔ৔߹Ͳ͏΍ͬͨΒղܾͰ͖Δ͔Λద੾ʹࣔ͢ w ϝʔϧΞυϨε  ˠ࣮ࡍʹૹ৴ͯ͠ෆୡνΣοΫ w ܞଳి࿩൪߸  ˠ4.4ʹΑΔຊਓνΣοΫ w ॅॴ  ˠձһূɾొ࿥ূૹ෇ʹΑΔνΣοΫ

Slide 36

Slide 36 text

Θ͔Γ΍͍͍͢͞ʁ w ৘ใϦςϥγʔͷ௿͍ঢ়ଶʢటਲͯ͠Δͱ͔ᐒᐓͱ͍ͯ͠Δͱ͔ʣͷͱ͖ʹ ࢖͑Δ͜ͱ͕ఏڙଆͷෆརӹʹͳΔͷ͸ࠔΔ w టਲͰAmazonͰؾ͕େ͖͘ͳͬͪΌͬͯߴֹͳ΋ͷΛങ͏ͱ͔ʁ w ωοτόϯΩϯάΛటਲঢ়ଶͰ࢖͑Δ΂͖ͳͷ͔ʜʁʁʁʁʁʁʁʁ w ϑΥʔϚοτ͕໌ࣔ͞ΕͯΔͱ૯౰ͨΓ߈ܸͷώϯτΛ૿΍ͯ͠͠·͏Α͏ ͳؾ΋͢Δ w ʮ͜ͷϝʔϧΞυϨε͸ొ࿥͞Ε͍ͯ·͢ʯͬͯग़ͪ͠Ό͏ͷ͸·͍ͣ

Slide 37

Slide 37 text

ॱ൪͕͋Δ w ηΩϡϦςΟ্ͷݒ೦͸·ͣઌʹ௵͓ͯ͜͠͏ w Ұ౓Ͱ΋৘ใ࿙͍͑Έ͍ͨͳΠϯγσϯτ͕͋ͬͨͱ͜ΖΛ࢖͍͍͔ͨͲ͏͔Έͨ ͍ͳ࿩ʹͳͬͯ͘Δ w ͦͷ্ͰɺఏڙͰ͖Δ৘ใ͸ఏڙ͠Α͏ʢϑΥʔϚοτ΍खॱͳͲʣ w గਖ਼Մೳͳ΋ͷ͸ϓϩάϥϜͰٵऩɺΦϖϨʔγϣϯͰָʹղܾͰ͖Δ΋ͷ͸ͦͷ· ·ɺͲ͏ͯ͠΋μϝͳ΋ͷ͸ʮͲ͏͢Ε͹௚ͤΔ͔ʯΛ໌ࣔͯ͠ϑΟʔυόοΫ͢Δ w ΫϦςΟΧϧͳ࡞ۀ΍߲໨͸֬ೝμΠΞϩάͳͲͰϫϯΫογϣϯஔ͍ͨΓɺ׬ྃޙ ʹ׬ྃϝʔϧඈ͹͢ͱ͔ͰϩάΛ࢒͓ͯ͘͠ʢਓ͸టਲऀͷരങ͍ʹແྗʣ

Slide 38

Slide 38 text

༨ஊ

Slide 39

Slide 39 text

ϑΥʔϜ͋Δ͋Δ w ʮσβΠϯͱίʔσΟϯά·Ͱ΍ͬͯ͋ͱ͸γεςϜͷਓʹʙʯ w %#ʹอଘ͢ΔʁϝʔϧૹΔʁηΩϡϦςΟͲ͏͢Δʁ w ͍Ζ͍Ζߟ͑Δ͜ͱଟ͍ʢݸਓ৘ใѻ͏৔߹ಛʹʣ

Slide 40

Slide 40 text

Pardot Form Handler w Salesforceͷ੡඼ʮPardotʯͷForm HandlerΛ࢖͏ͱͦͷ͋ͨΓͪΐͬͱ ָ͔΋ w طଘͷίʔσΟϯάࡁΈϑΥʔϜͷૹ৴ઌΛPardotʹ͢ΔΠϝʔδ w Ϧʔυͷ࿈ܞ΍ϑϩʔͱͷ࿈ܞ w IUUQTIFMQTBMFTGPSDFDPNBSUJDMF7JFX JEQBSEPU@GPSN@IBOEMFSTIUNUZQF

Slide 41

Slide 41 text

IUUQTXXXUBNUBNDPKQUJQTOPUFIUNM@DTTQPTUIUNM

Slide 42

Slide 42 text

Έ͍ͨͳSaaSͱ͔ΊͬͪΌ͋ΔͷͰ ʮ࡞Βͳ͍ʯબ୒ࢶ΋͋ΔΑ

Slide 43

Slide 43 text

େࣄͳ͜ͱ w ඞཁ͕ͳ͍΋ͷΛ࡞Βͳ͍ w ࣗ෼ͨͪͰ࡞Βͳͯ͘΋͍͍ͳΒ࡞Βͳ͍ʢ͋Δ΋ͷΛ࢖͏ʣ w ࡞Δͱ͖͸༏ઌॱংΛཱͯͯߟ͑Δʢ୭ͷɾͳΜͷͨΊͷϑΥʔϜʁʣ w jQueryͷόϦσʔγϣϯ͸ɺͭΒ͍ w ϓϩάϥϜ͚ͩͰղܾͤͣ᎕खΛ࢖ͬͯͭΒΈճආ΋͍ͯ͘͠ w ೖྗ͸Τϥʔ͕ى͖ͳ͍Α͏ʹɺى͖ͯ΋͙͢෮ؼͰ͖ΔΑ͏ʹ