ϙέϞϯͷબग़ը໘Λղੳ͢ΔWebΞϓϦΛ࡞ͬͨ
View Slide
࣍• WebΞϓϦͷ֓ཁ• ϑϩϯτΤϯυ• όοΫΤϯυ• Πϯϑϥ• ػೳ໘ͷ՝• ײ• ·ͱΊ
WebΞϓϦͷ֓ཁ• ࠷ۙͷϙέϞϯΦϯϥΠϯରઓ͕Մೳ• ૬खͷख͕࣋ͪӈͷਤͷΑ͏ʹදࣔ͞ΕΔγʔϯ͕͋Δ• Կ͕͍ࣸͬͯΔ͔ࣗಈͰఆ͍ͨ͠
WebΞϓϦͷ֓ཁ• ·ͣ࠷ॳʹσϞ͠·͢• ιʔείʔυodanado/TeamPreviewAnalyst• ͍ΘΏΔSPA(Single Page Application)• αʔόAPIΛ௨ͯ͡JSONͳͲΛൃߦ• ΫϥΠΞϯτJSONΛड͚औͬͯDOMΛૢ࡞• HTMLͷੜαʔόଆͰͳ͘ΫϥΠΞϯτଆͰߦ͏
WebΞϓϦͷ֓ཁΠϯϑϥϑϩϯτΤϯυόοΫΤϯυ
ϑϩϯτΤϯυϑϩϯτΤϯυ
ϑϩϯτΤϯυ• React(+redux)Ͱॻ͍ͨ• Facebook͕։ൃ͍ͯ͠ΔOSS• ίϯϙʔωϯτࢦ• ԾDOMͰޮతʹDOMΛߋ৽• JSXͱݺΕΔJSΛ֦ுͨ͠ݴޠͰهड़• ޙड़͢Δը૾ղੳAPIʹϦΫΤετΛ͛ͯͦͷ݁ՌʹԠͯ͡ը໘ΛมԽͤ͞Δ
όοΫΤϯυόοΫΤϯυ
όοΫΤϯυ• REST API• Bottle(Python)Ͱ࣮• ݱঢ়༷͕؆୯ͳͷͰബ͍frameworkͰେৎ• ࣮తʹ࠷• ը૾ղੳ• OpenCVͱscikit-image• ΞϧΰϦζϜ୯७(࣍ͷεϥΠυ)
όοΫΤϯυ• ը૾ղੳΞϧΰϦζϜOpenCVͷinRangeؔͰΦϨϯδ৭ͷ෦͚ͩநग़ྖҬݕΛߦ͍Ұ൪େ͖͍ྖҬΛΓऔΓ
όοΫΤϯυ• ը૾ղੳΞϧΰϦζϜϙέϞϯ͕͍ࣸͬͯͦ͏ͳ෦ΛΓग़͢
όοΫΤϯυ• ը૾ղੳΞϧΰϦζϜຊͷը૾HOGಛྔͷϚϯϋολϯڑ͕࠷খ͍͞ͷΛબ(༁ Ұ൪ࣅ͍ͯΔͭΛબͿ)ºϙέϞϯͷ
ΠϯϑϥΠϯϑϥ
ΠϯϑϥDockerίϯςφ্ͰόοΫΤϯυಈ࡞nginxͷϦόʔεϓϩΩγͰαϒυϝΠϯׂΓͯAPIΛhttpsͰ৴͢Δඞཁ͕͋ͬͨͷͰLet’s Encrypt Ͱূ໌ॻΛൃߦ͍ͭ͜Dockerίϯςφ(jwilder/nginx-proxy)͍ͭ͜Dockerίϯςφ(jrcs/letsencrypt-nginx-proxy-companion)docker-composeͰཧ
ػೳ໘ͷ՝• ͏ҰσϞ͠·͢• ݱࡏͷղੳਫ਼6ׂఔ• Ұൠެ։͠σʔλΛऩूத• ࠓͷͱ͜Ζ400ຕू·ͬͨ• σʔλ͕ू·ΕػցֶशͰղੳͰ͖Δ͔• twitterͱ࿈ܞͯ͠Ϣʔβʔཧ͍ͨ͠
ײ• WebΞϓϦΛΠϯϑϥ͔ΒϑϩϯτΤϯυ·Ͱ࡞ΔͷॳΊͩͬͨ• ҰਓͰ৭ʑࢼͤΔͷͰָ͔ͬͨ͠• ओཁͳ෦3ؒϓϩάϥϛϯά͚ͩΛͯ͠࡞͕ͬͨɼମௐΛյ͔͚ͨ͠• ·ͩ·ͩػೳվળ͍ͨ͠• Docker͍͍ͧ
·ͱΊ• ϙέϞϯͷબग़ը໘ͷղੳΛߦ͏WebΞϓϦΛ࡞ͬͨ• ϑϩϯτΤϯυʹReactόοΫΤϯυʹBottle(Python)ΠϯϑϥʹDockerΛͬͨ• ࠓޙղੳਫ਼ͷ্twitterͷ࿈ܞΛ༻͍ͯϢʔβʔཧػೳͷ࣮Λߦ͍͍ͨ