StreamlitとFlaskではじめる, 爆速プロトタイピングとTV砲対策 #jx_tech_talk / AI web application development starting with Streamlit and Flask

JX Tech Talk #python Pythonista 達が語る速報サービス開発の舞台裏 2021/6/23 登壇資料

#Streamlit #Flask #GCP #GAE #CloudRun #WebApplication

Transcript

1. 4USFBNMJUͱ'MBTLͰ͸͡ΊΔ
   ര଎ϓϩτλΠϐϯάͱ57๒ରࡦ
   ʙ"*αʔϏε্ཱͪ͛ͷ෣୆ཪʙ
   4IJOJDIJ/BLBHBXB +91SFTT$PSQPSBUJPO4FOJPS&OHJOFFS
   
   +9@5&$)@5"-,1ZUIPO
   

   View Slide

2. Agenda
   8IPBN* ͓લ୭Α
   
   4USFBNMJUͰര଎ϓϩτλΠϓ։ൃ
   'MBTLΛ࢖ͬͨ"*όοΫΤϯυ
   ("&$MPVE3VOͰ57๒Λଧͪฦ͢
   ݁ͼ
   1,
   2,
   3,
   4,
   5,
   

   View Slide

3. ͓લ୭Α
   ࣗݾ঺հЋ
   01
   

   View Slide

4. Who am I
   ?
   
   (͓લ୭Α)
   w 4IJOJDIJ/BLBHBXB !TIJOZPSLF
   
   w +9௨৴ࣾγχΞΤϯδχΞ
   w 1ZUIPO%BUB4DJFODF
   

   #BDLFOE#BTFCBMM
   w 1Z$PO+1Ͱճ΄Ͳ⽁ͷ࿩ͯ͠·͢
   w IUUQTTIJOZPSLFIBUFOBCMPHDPN
   

   View Slide

5. ໺ٿͱPythonͱAI
   ࠷ۙͷʮ໺ٿͱ1ZUIPOͱ"*ʯͳ׆ಈ
   ໺ٿ"*͕બͿ50,:0ࣆ+"1"/໊
   IUUQTTIJOZPSLFIBUFOBCMPHDPNFOUSZUPLZPTBNVSBJKBQBO
   

   View Slide

6. ຊ೔͸ͬͪ͜ͷAIͷ͸ͳ͠
   ʮ"*ϫΫνϯ઀छ༧ଌʯͷ1P$ϩʔϯν57ʹग़Δ·Ͱͷ͸ͳ͠🐍
   IUUQTKYQSFTTOFU
   

   View Slide

7. ຊ೔ͷ
   ͓౔࢈
   w "*ϓϩδΣΫτͷ1P$͔Β
   

   ຊ൪ϦϦʔε·Ͱͷ࣮࿩ͱϊ΢ϋ΢
   w ͋Δ೔ಥવαʔϏε͕📺ʹग़Δʂ
   

   ʜͱ͍͏࣌ͷࠓυΩͳରԠํ๏
   w ͜ΕΒΛ1ZUIPO($1Ͱ
   

   ͍͍ײ͡ʹ΍Δํ๏
   w 1P$ϑΣʔζ4USFBNMJU
   w ຊ൪📺๒ରࡦ'MBTL ("&
   

   View Slide

8. ࿩͞ͳ͍͜ͱ
   w "*ϫΫνϯ઀छ༧ଌͷϞσϧ
   w ࣭໰͞Εͯ΋౴͑ΒΕ·ͤΜ🙏
   w ಛʹΞϧΰϦζϜͷ࿩
   w ($1ͷৄ͍͠ղઆ
   w ("& $MPVE3VOͷ͍ܰ࿩͸͢Δ
   w ͕ ࢝Ίํɾৄ͍͠આ໌͸͠·ͤΜ
   w ϑϩϯτΤϯυपΓ
   w 3FBDU5ZQF4DSJQUͰ͢
   w ͜Ε΋("&Ͱಈ͍ͯ·͢
   

   View Slide

9. 4USFBNMJUͰര଎ϓϩτλΠϓ։ൃ
   02
   4USFBNMJUͷઆ໌͔Β࣮ફతͳ࢖͍ํ·Ͱ
   

   View Slide

10. ͸͡·Γ͸͍ͭ΋ࢥ͍͖͔ͭΒ
    "*ϓϩδΣΫτ͸ʮಥવͷࢥ͍͖ͭʯͰ͸͡·Δ
    ɾ ʮϫΫνϯ💉͍ͭ઀छͰ͖Δ͔ ͬͯؾʹͳΔΑͶʔʯˡͦΕͳ
    ɾ ʮσʔλͱ"*Ͱ͍͍ײ͡ʹͰ͖ΔͷͰ͸ ʯˡ͜Ε
    ʮಥવͷࢥ͍͖ͭʯ͔Β1P$͕͸͡·Δ
    ɾ ʮग़དྷͦ͏ͳਓʹ΍ͬͯ΋Β͑͹ த઒͞Μͱ͔ʯ
    ɾϫΠকʮϑΝ ͱΓ͋͑ͣࣾ಺Ͱ1P$͠ͳ͍ͱʯˡ͜Ε
    

    View Slide

11. ࣾ಺PoCΛ͍͍ײ͡ʹ΍Δ
    ٞ࿦ͷωλʹͳΔϓϩτλΠϓͷ༻ҙ͕Ϛετ
    ɾ͋Δఔ౓ͪΌΜͱಈ͘ϓϩτλΠϓͰٞ࿦͢΂͖಺༰ͩͬͨ
    ɾ͜ΕΛݶΒΕͨظؒͰಈ͘ΞϓϦͱͯ͠ఏڙ͢Δ
    ϓϩτλΠϓ͸OPUFCPPL͡Όͳ͍΄͏͕͍͍
    ɾσʔλαΠΤϯςΟετ͸+VQZUFSOPUFCPPLͰϓϩτλΠϓ࡞Γ͕ͪ
    ɾ͕ͩ εςʔΫϗϧμʔ΁ͷઆಘྗͬͯҙຯͰOPUFCPPL͸ඍົ
    ͜͜Ͱ4USFBNMJUͰ͢ΑʢυϠإʣ
    

    View Slide

12. StreamlitͰര଎ϓϩτλΠϓ։ൃ
    ʲࢀߟʳσʔλαΠΤϯςΟετͷඈͼಓ۩ͱͯ͠ͷ4USFBNMJU
    IUUQTUFDIKYQSFTTOFUFOUSZEBUBBQQGPSTUSFBNMJU
    ϑΝΠϧ ߦະຬͷίʔυͰΠϯλϥΫςΟϒͳ
    8FCΞϓϦ͕Ͱ͖ͪΌ͏ʂʢ)5.-͸ॻ͔ͳͯ͘0,ʣ
    

    View Slide

13. Streamlit #ͱ͸
    +VQZUFSOPUFCPPLΛͦͷ·Μ·8FCΞϓϦʹͰ͖Δʂ
    ɾσʔλαΠΤϯςΟετ͕+VQZUFSͰ΍ͬͨ݁ՌΛ8FCʹ͢Δ΍ͭ
    ɾࣗ෼Ͱ)5.-ͱ͔+4ॻ͔ͳͯ͘΋ͻͱ·ͣϓϩτλΠϐϯάͰ͖Δʂ
    4USFBNMJUͰϓϩτλΠϓΛ࡞Δ
    ɾ'PSNͰ༧ଌΛຯΘ͑ΔϓϩτλΠϓΛ4USFBNMJUͰ࣮૷
    ɾ.5(ͷ࣌ʹಈ͔͠ͳ͕ΒݟͤΕ͹0,
    

    View Slide

14. ࣾ಺PoCͷ؀ڥ
    खݩͰ4USFBNMJUΛಈ͔͠ OHSPLܦ༝ͰΦϯϥΠϯ͓൸࿐໨
    

    View Slide

15. ࣮ࡍʹ΍ͬͨ͜ͱ
    4USFBNMJUͰ઀छ༧ଌϞσϧͷϓϩτλΠϓ։ൃ
    ɾ઀छ༧ଌϞσϧΛΠϯλʔϯੜͱઃܭ ͻͱ·ͣ+VQZUFSMBCͰ։ൃ
    ɾ༧ଌϞσϧͷ*'Λ੔ཧͯ͠4USFBNMJUʹॻ͖׵͑
    νʔϜϝϯόʔϘʔυͷօ͞ΜʹϓϩτλΠϓ൸࿐
    ɾ.5(ݶఆͰOHSPLͰϓϩΩγͯ͠৮ͬͯ΋Βͬͨ
    ɾˢΛճ΄Ͳ΍ͬͯޙαʔϏε։ൃ͕ܾ·ͬͨ💪
    

    View Slide

16. ϓϩτλΠϓ͔ΒϗϯτͷϓϩμΫτ΁
    'MBTLΛ࢖ͬͨ"*όοΫΤϯυ
    03
    

    View Slide

17. αʔϏεͷߏ੒
    ΞϓϦέʔγϣϯͷߏ੒
    ɾϑϩϯτΤϯυʢ3FBDUʣͱόοΫΤϯυʢ1ZUIPOʣΛ෼͚ͯ։ൃ
    ɾϑϩϯτ͔ΒͷϦΫΤετͰίϯςϯπΛฦ͢3&45GVMతͳ
    ϓϩμΫτશମͷߏ੒
    ɾߴෛՙରࡦΛָʹ΍Γ͍ͨख͔͚ؒͨ͘ͳ͍
    ɾ("&ʢ(PPHMF"QQ&OHJOF͕ʣ͋Δ͡ΌΜʂˡ͜Ε
    ɾ࠷ऴతʹ͸("&Ұ෦αʔϏεΛ$MPVE3VOʹ
    

    View Slide

18. ΞʔΩςΫνϟͷશମ૾
    ϑϩϯτΤϯυͱόοΫΤϯυ͕("&
    

    Ұ෦αʔϏεʢ0(1ը૾ੜ੒ʣΛ$MPVE3VO
    

    View Slide

19. όοΫΤϯυ։ൃ
    ݴޠ͸1ZUIPOറΓ
    ɾ઀छ༧ଌϞσϧΛ1ZUIPOͰॻ͍ͨͷͰಉ͡ݴޠ͕͍͍
    ɾ(P΍3VTUͰ΍Δ΄Ͳͷཁ݅Ͱ΋ͳ͔ͬͨ
    'SBNFXPSL͸ԿͰ΋ྑ͔ͬͨ
    ɾ1ZUIPOͰ͋Ε͹ԿͰ΋ ߟ͑ͨͷ͸'BTU"1*'MBTLCPUUMF͋ͨΓ
    ɾຊମ͸'MBTL Ұ෦ͷผαʔϏεΛ'BTU"1*Ͱ։ൃ
    

    View Slide

20. Streamlit͔ΒFlask΁ͷॻ͖׵͑ʢ֓೦ʣ
    ʲਤʳϓϩτλΠϓͱ"1*ͷύοέʔδߏ੒ʢͬ͘͟Γʣ
    

    View Slide

21. Streamlit͔ΒFlask΁ͷॻ͖׵͑ʢ֓೦ʣ
    4USFBNMJUϓϩτλΠϓͷ࣌఺Ͱ"1*ॻ͖׵͑Λ૝ఆ
    ʮϓϩτΛ௥Ճ։ൃͯ͠"1*ʹʯ͕Ͱ͖ΔΑ͏ʹͨ͠
    

    View Slide

22. ϓϩτλΠϓ͔ΒAPIॻ͖׵͑ͷ࡞ઓ
    ϓϩτλΠϓʢ4USFBNMJUʣͷ࣌఺Ͱύοέʔδ੔ཧ
    ɾ"1*ʹ͢Δͷ͕Θ͔Γ͖ͬͯͨͷͰ࠷ॳ͔ΒϓϩμΫτߏ੒Λҙࣝ
    ɾ༧ଌϞσϧͳͲ͕Ҡ২࣌ʹյΕͳ͍Α͏ $*ςετͷ࢓૊Έ΋੔͑ͨ
    'SBNFXPSLʹґଘ͢ΔՕॴΛݶఆ͢Δ
    ɾϏδωεϩδοΫͰ'SBNFXPSLʹґଘ͢Δ࣮૷Λճආ͢Δ
    ɾ8FC"1*ͷ৔߹ IUUQ T
    Ͱ௨৴͢Δͱ͜Ζ͚ͩ'SBNFXPSLΛ࢖͏
    ɾ'MBTL΍'BTU"1*ͳͲͷܰྔ'SBNFXPSLͳΒϞδϡʔϧ͚ͩͰࡁΉ
    

    ɹʢ஫ɿΞϓϦέʔγϣϯͷن໛࣍ୈͰύοέʔδ෼͚Α͏ʣ
    

    View Slide

23. ͜ͷ࡞ઓͰ্ख͍ͬͨ͘͜ͱ
    ςετͷ͓ӄͰϓϩτλΠϓ"1*Ҡߦ͕੒ޭ
    ɾҠߦͨ࣌͠ʹ༧ଌϞσϧ΍ϏδωεϩδοΫ͕յΕͣʹࡁΜͩ
    ɾೖࣾॳ೔ͷֶੜΠϯλʔϯ͕͙͢DPOUSJCVUFͰ͖ͨ
    ٸͳ'SBNFXPSLͷมߋ͕Ұ൩ͰऴΘͬͨ
    ɾ࣮͸࠷ॳ͸'BTU"1*Ͱ։ൃ͍ͯͨ͠ࣄ৘ʹΑΓ'MBTLʹ੾Γସ͑
    ɾNBJOQZͱҰ෦ͷεΩʔϚมߋ͚ͩͰര଎Ͱ੾Γସ͕͑ऴΘͬͨ
    

    View Slide

24. ߴτϥϑΟοΫʹ߄ͯͳ͍ٕज़
    ("&$MPVE3VOͰ57๒Λଧͪฦ͢
    04
    

    View Slide

25. ʲ࠶ܝʳαʔϏεͷߏ੒
    ΞϓϦέʔγϣϯͷߏ੒
    ɾϑϩϯτΤϯυʢ3FBDUʣͱόοΫΤϯυʢ1ZUIPOʣΛ෼͚ͯ։ൃ
    ɾϑϩϯτ͔ΒͷϦΫΤετͰίϯςϯπΛฦ͢3&45GVMతͳ
    ϓϩμΫτશମͷߏ੒
    ɾߴෛՙରࡦΛָʹ΍Γ͍ͨख͔͚ؒͨ͘ͳ͍
    ɾ("&ʢ(PPHMF"QQ&OHJOF͕ʣ͋Δ͡ΌΜʂˡ͜Ε
    ɾ࠷ऴతʹ͸("&Ұ෦αʔϏεΛ$MPVE3VOʹ
    

    View Slide

26. View Slide

27. GAE + Cloud Runߏ੒ʹͨ͠ཧ༝
    ɾαʔϏεͷੑ্࣭ 57࿐ग़ͷՄೳੑେ📺
    ɾ📺ग़ԋͷ౎౓ ख࡞ۀ૿͑Δͷ͸🙅
    ɾ($1ͷ࢓૊Έʹ৐͔ͬͬͪΌ͑ˡ͜Ε
    ߴτϥϑΟοΫରࡦΛָʹ΍Γ͔ͨͬͨ
    

    View Slide

28. ϝονϟָͩͬͨߴෛՙରࡦ
    ("&ͱ$MPVE3VOͷରࡦ
    ɾͲͪΒ΋ࣄલʹΠϯελϯεΛ૿΍͢ઃఆͯ͠σϓϩΠ͕جຊઢ
    ɾΠϯελϯεͷ࠷খ࠷େ਺Λௐ੔ HDMPVEίϚϯυͰҰൃσϓϩΠ
    /FXT%JHFTUͷରԠ΋ָͩͬͨ
    ɾ"*ϫΫνϯ઀छ༧ଌ͸/FXT%JHFTUͷҰ෦ͳͷͰͬͪ͜΋ෛՙରࡦ͕
    ɾ౰࣌43&ͩͬͨ!5BUDI/JDPMBT͞Μ͕Ұ൩ͰπʔϧΛ։ൃ
    

    ɹίϚϯυҰൃͰෛՙରࡦΛ΍ΕΔΑ͏ʹʂʢײँʣ
    

    View Slide

29. ݁Ռ͸Ͳ͏ͩͬͨ?
    57࿐ग़ͷߴෛՙʹे෼଱͑ͨ
    ɾट౎ݍΩʔہͷ͍ΖΜͳ൪૊ʹग़͕ͨαʔϏεো֐͸φγ
    

    ɹʢখ͞ͳΤϥʔͱ͔͸ͪΐ͍ͪΐ͍͋ͬͨʣ
    ɾΊ͟·͠ςϨϏ 8#4 /&84;&30ͱ͍ͬͨେ๒ʹ଱͑ͨ
    ӡ༻ෛՙ͸େͨ͜͠ͱφγ
    ɾ57࿐ग़લޙʹத઒͕෼ఔ౓࡞ۀʢجຊతʹσϓϩΠ࡞ۀʣ
    ɾϫΫνϯ઀छ༧ଌͱ/FXT%JHFTUͷରࡦ͸΄΅ҰਓͰӡ༻Ͱ͖ͨ
    ʮ(PPHMF"QQ&OHJOFͰ͸͡ΊΔ Β͘Β͘57๒ରࡦ"*ϫΫνϯ઀छ༧ଌͷ෣୆ཪʯ
    IUUQTUFDIKYQSFTTOFUFOUSZWBDDJOFHBF
    

    View Slide

30. 1ZUIPO࢖͍ʹͱͬͯͷٕज़બ୒ͱ͸
    ݁ͼ
    05
    

    View Slide

31. ૯ׅ
    ϓϩτλΠϐϯάͰ4USFBNMJUΛ࢖ͬͨ݅
    ɾϓϩτλΠϓ։ൃࣾ಺1P$։ൃ
    

    ɹ͜ΕΒͷҙࢥܾఆɾαʔϏεϩʔϯν·Ͱͷεϐʔυײʹߩݙ
    ɾ͜ͷ΍ΓํΛԣల։͍ͨ͠ʢ4USFBNMJU࢖͓͏ϗεςΟϯάͳͲʣ
    'MBTL("&ͰεέʔϥϏϦςΟͳόοΫΤϯυ
    ɾബ͍"1*ΛνʔϜ։ൃ ٸͳτϥϑΟοΫରԠ΋ָʹ͍͚ͨ
    ɾ/FXT%JHFTU'"45"-&35ຊମͳͲ ΋ͬͱίΞͳॴͰ͜ͷ஌ݟΛ
    

    ɹ׆͔ͤͨΒ࠷ߴ͡Όͳ͍͔આ͋Δ🤔
    

    View Slide

32. ࢲʢshinyorkeʣ͕େ੾ʹ͍ͯ͠Δ͜ͱ
    ʮֶࣗࣗशʯΛॏͶͯʮબ୒ࢶΛ૿΍͢ʯײ͕͡ϕετ΍Ͱ
    IUUQTMPHNJKQUFDIBSUJDMFT
    

    View Slide

33. Thank you!
    

    View Slide