Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Make good (better) form
Search
Kusamao Abe
October 16, 2018
Technology
0
260
Make good (better) form
Kusamao Abe
October 16, 2018
Tweet
Share
More Decks by Kusamao Abe
See All by Kusamao Abe
Vue builds
kusamao
1
520
Javascript in the past and now
kusamao
1
170
The Essence of UI Design
kusamao
1
1.9k
Making mock-up in web application
kusamao
0
98
Keep a distance from jQuery
kusamao
0
130
Using Heroku on entrusted development
kusamao
0
1.1k
Other Decks in Technology
See All in Technology
BidiAgent と Nova 2 Sonic から考える音声 AI について
yama3133
2
140
「駆動」って言葉、なんかカッコイイ_Mitz
comucal
PRO
0
130
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
10k
投資戦略を量産せよ 2 - マケデコセミナー(2025/12/26)
gamella
0
560
小さく、早く、可能性を多産する。生成AIプロジェクト / prAIrie-dog
visional_engineering_and_design
0
280
[Neurogica] 採用ポジション/ Recruitment Position
neurogica
1
140
モダンデータスタックの理想と現実の間で~1.3億人Vポイントデータ基盤の現在地とこれから~
taromatsui_cccmkhd
2
290
AI with TiDD
shiraji
1
330
ペアーズにおけるAIエージェント 基盤とText to SQLツールの紹介
hisamouna
2
2k
AI駆動開発ライフサイクル(AI-DLC)の始め方
ryansbcho79
0
280
人工知能のための哲学塾 ニューロフィロソフィ篇 第零夜 「ニューロフィロソフィとは何か?」
miyayou
0
230
AgentCoreとStrandsで社内d払いナレッジボットを作った話
motojimayu
1
1.2k
Featured
See All Featured
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
1
410
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
38
Practical Orchestrator
shlominoach
190
11k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
How to make the Groovebox
asonas
2
1.9k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
31
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.8k
WCS-LA-2024
lcolladotor
0
400
AI: The stuff that nobody shows you
jnunemaker
PRO
1
40
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
150
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Transcript
2018/10/16 JAM plus #03 at tambourine commune ͍͍ϑΥʔϜΛͭ͘Ζ͏
҆෦ຑੜ Kusamao Abe גࣜձࣾλϯόϦϯ ʢtambourine.incʣ ɾςΫχΧϧσΟϨΫλʔ ɾWebΤϯδχΞ
JAM plusͷ͓͞Β͍ w JAMελοΫˠJavaScript API MarkUpΒ͍͠ w MEANελοΫͱ͔LAMPͱ͔ͦ͏͍͏ͭ ϑϩϯτΤϯυΛࢦ͢Β͍͠ w
plusͬͯԿˠ͜ͷϏϧͷ໊લ͕ϓϥεϏϧ w ݄։࠵͍͔͠͠Εͳ͍ʜʜ
ͦ͏ɺͦΖͦΖͷ
౦ژΦϦϯϐοΫ ͍͖ۙͮͯ·ͨ͠
IUUQTOFXTZBIPPDPKQCZMJOFLBOEBUPTIJBLJ
͡Ό͋ྑ͍ϑΥʔϜͬͯʁ
IUUQTVTJUFKQBMFSUCPYXFCGPSNEFTJHO
Kathryn Whitenton͍Θ͘ ͘͠Α͏ɻ ؔ࿈ͷ͋ΔϥϕϧͱೖྗཝάϧʔϓͰ͋ΔͱݟͯΘ͔ΔΑ͏ʹ͠Α͏ɻ ೖྗཝͷϨΠΞτΧϥϜʹ͠Α͏ɻ ཧతͳॱ൪ͰฒΑ͏ɻ
ϓϨʔεϗϧμςΩετར༻͠ͳ͍Α͏ʹ͠Α͏ɻ ೖྗཝೖྗ༰ͷछྨ͞ʹ߹͏ͷʹ͠Α͏ɻ ೖྗ͕ҙͷཝͱඞਢͷཝΛݟ͚ΒΕΔΑ͏ʹ͠Α͏ɻ ೖྗϑΥʔϚοτͷཁ݅ͯ͢આ໌͠Α͏ɻ ʮϦηοτʯϘλϯͱʮΫϦΞʯϘλϯΘͳ͍Α͏ʹ͠Α͏ɻ ʹ͖͘͢ɺ۩ମతͳΤϥʔϝοηʔδΛఏڙ͠Α͏ɻ
͜ΕΛकͬͯΕ͍͍ϑΥʔϜʁ
୭ʹͱͬͯʮ͍͍ʯʁ w ։ൃऀ w ࡞Γ͍͢ w ϝϯς͍͢͠ w ར༻ऀ w
ҟͳΔڥɾ݅ԼͰ͍͍͢ w తΛୡ͢Δͷ͕༰қ w ڙڅଆ w ਖ਼͍͠ใ͕ೖྗ͞ΕΔ w ͕ྃߴ͍
ଟ͘ͷ߹ɺ ʮࡾํྑ͠ʯΉ͔͍ͣ͠ʜ
ϚδͰ͍͍ϑΥʔϜͷڀۃ
ೖྗ͠ͳ͍͍ͯ͘͜ͱͰʁʁʁ
ͦͦೖྗΊΜͲ͍ w Զୡ͋ͱԿճϝʔϧΞυϨεΛೖྗ͠ͳ͍ͱ͍͚ͳ͍ͷ͔ w ࣗಈೖྗ͕ޮ͔ͳ͍ϑΥʔϜͨ͘͞Μ͋Δ w ͳΜ͔͏ͥΜͿɺϐοͱͬͯͰ͖ͳ͍͔ͬ͢ʁʁʁʁʁ
ͨͱ͑Amazon Pay
IUUQTQBZBNB[PODPNKQTIPQQFS
Amazon Pay w AmazonͷΞΧϯτʹొ͞ΕܾͨࡁใͰܾࡁͯ͘͠ΕΔ w ࣄۀऀܾࡁใΛอ͓࣋ͯ͘͠ϦεΫΛऔΒͣʹࡁΉ w ॅॴใ͍ͭͷAmazonͷͭͰ w खྉίϯςϯπͷ4%ʙ4.5%
Apple Payͱ͔ Google Payͦ͏
·͋ͦΕ͔ͬΓ͡Όͳ͍ΑͶ w ࣗͷͱ͜ΖͰΞΧϯτ࡞Βͤͯ*%౷߹ͯ͠."Γ͍ͨΑͶʙ w खྉߴ͍ʂͩʂ w ͨͩͷ͝ҙݟϑΥʔϜ͔ͩΒ͍ͦͦΒΜͷ͕ͩʙ
͍͔͠͠େࣄͳ͜ͱͳΜͰ͢
ਓɺؒҧ͑Δʜʜ
ͷ͕૿͑ΔͱͲ͏ͳΔ͔ w ࡞Δͷ͕ଟ͍ ˠΤϯόάͷՄೳੑ͕૿͑Δ w ೖྗ͢Δͷ͕ଟ͍ ˠೖྗΛؒҧ͑ΔՄೳੑ͕૿͑Δ w ཧ͢Δͷ͕ଟ͍ ˠηΩϡϦςΟࣄނͷՄೳੑ͕૿͑Δ
ͰɺͲ͏ͯ͠ඞཁͳ߲͋Δ w ࡂɾݮࡂ͠Α͏ w ηΩϡϦςΟ্ͷࣄނΛݮΒ͢ w όάΛݮΒ͢ w ೖྗϛεΛݮΒ͢
ϑϩϯτΤϯυΤϯδχΞ ͕Δ͜ͱ
όάΛݮΒ͢ w ͍·͋ͨΓલͳΜ͚͢Ͳ w όϦσʔγϣϯͰ௨͖͢ύλʔϯΛ͍͍ͯͨͱ͔ w ಛఆͷύλʔϯΛ౿ΉͱΛు͍ͯશ෦ೖྗ༰͕ফ͑Δͱ͔ w ૹ৴࣌ʹใ͕ܽམͯͨ͠ͱ͔
ೖྗϛεΛݮΒ͢ w όοΫΤϯυόϦσʔγϣϯϑϩϯτΤϯυόϦσʔγϣϯ ʮ͋ͬͯͨΓલʯʹͳ͖ͬͯͨʢͬͯͳ͍ͳΒΖ͏ͳʣ w ͦͦೖྗΛਖ਼͘͠Ͱ͖ΔΑ͏ʹ͢Δ
ྫɿ༣ศ൪߸ w ܻͷࣈ͔ΒͳΔຊͷ༣ศ൪߸ w ʮܻܻͷೖྗཝʹ͚Α͏ʯ w ʮ֯ࣈ͚ͩڐ༰ͯ͠΄͔Τϥʔʹ͠Α͏ʯ w ʮͦͷ༣ศ൪߸ͰϥΠϒϥϦ͔ΒॅॴҾ͍ͯ ॅॴ͕ଘࡏ͠ͳ͚ΕΤϥʔʹ͠Α͏ʯ
Τϥʔʹ͠ͳ͍ͱ͍͏ख๏ w ςΫϊϩδʔͰղܾͰ͖Δ͜ͱͯ͋͛͠Α͏ w ֯ࣈ͚ͩ͡Όͳ͘ɺશ֯ࣈΛมͯ͋͛͠Α͏ w ඞཁͳ͍จࣈྻ͕ೖͬͯউखʹऔΓআ͘ w ແବʹׂͯ͠ೖྗͤ͞ͳ͍ɺܻͰόϥ͢ͷϓϩάϥϜͰͰ͖Δ w
ˠσʔλܗࣜΛؒҧ͑Α͏͕ͳ͍
None
w jQueryͰόϦσʔγϣϯͶɺͭΒ͍ w ͪΐͬͱͨ͠ϑΥʔϜͰVue.js͏ͱΊͬͬͪΌͪ͘Όָ w σβΠϯͦ͜·Ͱؾʹ͠ͳ͍ͳΒElementUIΛ͏ͱͪΐʙʙʙʙָ
ςΫϊϩδʔͰղܾͰ͖ͳ͍͜ͱ͋Δ͕ w ͨͱ͑ಛघͳ༣ศ൪߸ͱ͍͏ͷ͕ଘࡏ͢Δ w ࠃཱେͷֶੜྈͱ͔ͩͱ൪ʹඥͮ͘ͷͰͳ͘ಛघͳ൪߸͕ඥ͍ͯ ͍ͯɺ༣ศ൪߸͚ͩͰࢪઃ͕ಛఆͰ͖ΔΑ͏ʹͳ͍ͬͯͨΓ͢Δ ʢͦ͏͍͏ͷϥΠϒϥϦͰҾ͚ͳ͍߹͕͋Δʣ w ˠҰ֓ʹϥΠϒϥϦͰҾ͔͔ͬΒͳ͍ͳΒଘࡏ͠ͳ͍༣ศ൪߸ͱݴ͑Δ ͔Θ͔Βͳ͍
IUUQTKBXJLJQFEJBPSHXJLJ&#&#&#'&""&'#
ͰॅॴؒҧͬͯͨΒࠔΔ w Θ͔Δʂʂʂʂʂʂʂʂ w ΫϩωίϠϚτձһαʔϏεొ࣌ʹ࣮ࡍʹొ͞Εͨॅॴʹ๚ͯ͠ ձһΧʔυΛ͢͜ͱͰ͋ΔఔͷޡΓνΣοΫΛ͍ͯͨ͠ w ༣ศ൪߸͕ͳͯ͘ՙखࢴಧ͘ ʢୡॴଆ͕θϯϦϯͷਤཤྺ͔Β֬ೝͨ͠Γ͍ͯ͠Δͷ͕΄ͱΜͲʣ
ؒҧͬͯͨΒ͍ͷΛݟۃΊΖ w ڧݻͳόϦσʔγϣϯʢόοΫɾϑϩϯτʣ w ೖྗϑΥʔϚοτΛ໌ࣔ͠ɺ ؒҧ͍ͬͯΔ߹Ͳ͏ͬͨΒղܾͰ͖Δ͔Λదʹࣔ͢ w ϝʔϧΞυϨε ˠ࣮ࡍʹૹ৴ͯ͠ෆୡνΣοΫ w
ܞଳి൪߸ ˠ4.4ʹΑΔຊਓνΣοΫ w ॅॴ ˠձһূɾొূૹʹΑΔνΣοΫ
Θ͔Γ͍͍͢͞ʁ w ใϦςϥγʔͷ͍ঢ়ଶʢటਲͯ͠Δͱ͔ᐒᐓͱ͍ͯ͠Δͱ͔ʣͷͱ͖ʹ ͑Δ͜ͱ͕ఏڙଆͷෆརӹʹͳΔͷࠔΔ w టਲͰAmazonͰؾ͕େ͖͘ͳͬͪΌͬͯߴֹͳͷΛങ͏ͱ͔ʁ w ωοτόϯΩϯάΛటਲঢ়ଶͰ͑Δ͖ͳͷ͔ʜʁʁʁʁʁʁʁʁ w ϑΥʔϚοτ͕໌ࣔ͞ΕͯΔͱ૯ͨΓ߈ܸͷώϯτΛ૿ͯ͠͠·͏Α͏
ͳؾ͢Δ w ʮ͜ͷϝʔϧΞυϨεొ͞Ε͍ͯ·͢ʯͬͯग़ͪ͠Ό͏ͷ·͍ͣ
ॱ൪͕͋Δ w ηΩϡϦςΟ্ͷݒ೦·ͣઌʹ௵͓ͯ͜͠͏ w ҰͰใ࿙͍͑Έ͍ͨͳΠϯγσϯτ͕͋ͬͨͱ͜ΖΛ͍͍͔ͨͲ͏͔Έͨ ͍ͳʹͳͬͯ͘Δ w ͦͷ্ͰɺఏڙͰ͖Δใఏڙ͠Α͏ʢϑΥʔϚοτखॱͳͲʣ w గਖ਼ՄೳͳͷϓϩάϥϜͰٵऩɺΦϖϨʔγϣϯͰָʹղܾͰ͖Δͷͦͷ·
·ɺͲ͏ͯ͠μϝͳͷʮͲ͏͢ΕͤΔ͔ʯΛ໌ࣔͯ͠ϑΟʔυόοΫ͢Δ w ΫϦςΟΧϧͳ࡞ۀ߲֬ೝμΠΞϩάͳͲͰϫϯΫογϣϯஔ͍ͨΓɺྃޙ ʹྃϝʔϧඈ͢ͱ͔ͰϩάΛ͓ͯ͘͠ʢਓటਲऀͷരങ͍ʹແྗʣ
༨ஊ
ϑΥʔϜ͋Δ͋Δ w ʮσβΠϯͱίʔσΟϯά·Ͱͬͯ͋ͱγεςϜͷਓʹʙʯ w %#ʹอଘ͢ΔʁϝʔϧૹΔʁηΩϡϦςΟͲ͏͢Δʁ w ͍Ζ͍Ζߟ͑Δ͜ͱଟ͍ʢݸਓใѻ͏߹ಛʹʣ
Pardot Form Handler w SalesforceͷʮPardotʯͷForm HandlerΛ͏ͱͦͷ͋ͨΓͪΐͬͱ ָ͔ w طଘͷίʔσΟϯάࡁΈϑΥʔϜͷૹ৴ઌΛPardotʹ͢ΔΠϝʔδ w
Ϧʔυͷ࿈ܞϑϩʔͱͷ࿈ܞ w IUUQTIFMQTBMFTGPSDFDPNBSUJDMF7JFX JEQBSEPU@GPSN@IBOEMFSTIUNUZQF
IUUQTXXXUBNUBNDPKQUJQTOPUFIUNM@DTTQPTUIUNM
Έ͍ͨͳSaaSͱ͔ΊͬͪΌ͋ΔͷͰ ʮ࡞Βͳ͍ʯબࢶ͋ΔΑ
େࣄͳ͜ͱ w ඞཁ͕ͳ͍ͷΛ࡞Βͳ͍ w ࣗͨͪͰ࡞Βͳ͍͍ͯ͘ͳΒ࡞Βͳ͍ʢ͋ΔͷΛ͏ʣ w ࡞Δͱ͖༏ઌॱংΛཱͯͯߟ͑Δʢ୭ͷɾͳΜͷͨΊͷϑΥʔϜʁʣ w jQueryͷόϦσʔγϣϯɺͭΒ͍ w
ϓϩάϥϜ͚ͩͰղܾͤͣ᎕खΛͬͯͭΒΈճආ͍ͯ͘͠ w ೖྗΤϥʔ͕ى͖ͳ͍Α͏ʹɺى͖͙ͯ͢෮ؼͰ͖ΔΑ͏ʹ
͕ࣗϘϥϯςΟΞԠืϑΥʔϜ࡞Δͱ͖ɺ Ͳ͏͢ΔͩΖ͏ͳͱ͓͍·ͨ͠
Thank you!