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
Phics
Search
Matts966
December 18, 2018
Programming
0
80
Phics
Web application of generative art
Matts966
December 18, 2018
Tweet
Share
More Decks by Matts966
See All by Matts966
OSS分散ベクトル検索エンジンValdと最新の取り組み
matts966
0
78
Grafana Dashboard as Code using Grafana Foundation SDK
matts966
3
160
nilarg
matts966
0
160
Static Analysis in Go
matts966
0
3.1k
Other Decks in Programming
See All in Programming
なぜあの開発者はDevRelに伴走し続けるのか / Why Does That Developer Keep Running Alongside DevRel?
nrslib
3
410
Claude CodeによるAI駆動開発の実践 〜そこから見えてきたこれからのプログラミング〜
iriikeita
0
280
Claude Agent SDK を使ってみよう
hyshu
0
1.1k
Writing Better Go: Lessons from 10 Code Reviews
konradreiche
0
1.3k
All About Angular's New Signal Forms
manfredsteyer
PRO
0
180
あなたとKaigi on Rails / Kaigi on Rails + You
shimoju
0
170
Leading Effective Engineering Teams in the AI Era
addyosmani
7
450
Devvox Belgium - Agentic AI Patterns
kdubois
1
120
Railsだからできる 例外業務に禍根を残さない 設定設計パターン
ei_ei_eiichi
0
930
Server Side Kotlin Meetup vol.16: 内部動作を理解して ハイパフォーマンスなサーバサイド Kotlin アプリケーションを書こう
ternbusty
3
210
ソフトウェア設計の実践的な考え方
masuda220
PRO
4
600
Le côté obscur des IA génératives
pascallemerrer
0
150
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
Six Lessons from altMBA
skipperchong
29
4k
For a Future-Friendly Web
brad_frost
180
10k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Building Adaptive Systems
keathley
44
2.8k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
Building a Modern Day E-commerce SEO Strategy
aleyda
44
7.8k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
53k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
Designing for humans not robots
tammielis
254
26k
Transcript
Phics Phics Graphics Generation Service. Graphics Generation Service. Created by
Service Slide Masahiro Matsui
None
࣍ ࣍ 1. 2. 3. 4. 5. 6. 7. 8.
ΞϓϦέʔγϣϯ֓ཁ δΣωϥςΟϒΞʔτͱ αʔόʔଆ࣮ ΫϥΠΞϯτଆ࣮ ڥߏங&DeployࣗಈԽ ল ࠓޙͷ՝ ࢀߟจݙ
ΞϓϦέʔγϣϯ֓ཁ ΞϓϦέʔγϣϯ֓ཁ ϢʔβʔϩάΠϯޙɺཪฦ͠ͷΧʔυΛΒΕ Δɻ λοϓ͢Δ͜ͱͰɺΧʔυΛཪฦ͢͜ͱ͕Ͱ͖ɺΦ Ϟς໘ʹδΣωϥςΟϒΞʔτ͕දࣔ͞ΕΔɻ ϘλϯΛԡ͢͜ͱͰɺը૾Λอଘ͢Δ͜ͱ͕Ͱ͖ Δɻ
δΣωϥςΟϒΞʔτͱ δΣωϥςΟϒΞʔτͱ
αʔόʔଆ࣮ αʔόʔଆ࣮ Nginx Rails 5.2.1 Ruby 2.3.7 Webpacker devise react-rails
αʔόʔଆ࣮ αʔόʔଆ࣮ αϒυϝΠϯͰͷӡ༻ʢDNS,VPNͷϓϩόΠμͰ ͷઃఆ ʴ NginxͰͷϙʔτϑΥϫʔσΟϯάʣɻ Webpacker ͰΫϥΠΞϯτଆͷίϯύΠϧɻ devise ͰϢʔβೝূɻomniauth
ʹΑΔGoogleೝ ূΛ࣮ʢબࢶ͕ଟ͍ͱٯʹ໎ͬͯ໘ͱ͍͏࣮ ମݧͱɺཧͷख͔ܰ͞ΒҰͭʹߜͬͨʣɻ react-rails Ͱ rails ଆͷσʔλΛ React ΫϥΠΞϯ τଆʹ͢ɻ
Webpacker Webpacker Webpacker͕ϩάΛు͔ͣʹམͪΔ ͦͷଞͷ໘͝ͱ ࠷৽൛webpackͷରԠͷΕ
ΫϥΠΞϯτଆ࣮ ΫϥΠΞϯτଆ࣮ React.js 16.7.0-alpha.0 React P5Wrapper Material UI 3.7.1
P5Wrapper ͰͷReactͬΆ͍ P5Wrapper ͰͷReactͬΆ͍ σʔλϋϯυϦϯά σʔλϋϯυϦϯά p.setup = function ()
{ p.myCustomRedrawAccordingToNewPropsHandler = propsHandler(p, canvas); }
ڥߏங&DeployࣗಈԽ ڥߏங&DeployࣗಈԽ capistrano unicorn webpack-dev-server foreman
σϓϩΠϑϩʔ σϓϩΠϑϩʔ rails s , webpacker-dev-server, ΛbundleͰ ࣮ߦʢforemanͰ·ͱΊ͓ͯ͘ʣɺ࣮ͷ࠷ऴ֬ ೝɻ 1.
ͳ͚Εcap production deployͰσϓϩ ΠΛ࣮ߦɻ 2. ෦Ͱassets:precompile, webpacker:compileΛߦ͍ɺunicornαʔόͷ࠶ ىಈɻ 3. 3ͷλΠϛϯάɺॴ͕ͱͳͬͨɻ
Webpacker Webpacker WebpackerWebpackͷઃఆϑΝΠϧͳͲΛӅṭ ͯ͘͠ΕΔɻymlදهͰൺֱత؆қʹઃఆՄೳɻ ͦͷ݁Ռ͍Ζ͍Ζแ·ͳ͍ͱ͍͚ͳ͍ͨΊɺ PermissionΤϥʔbundleͷversionཧͷͳ ͲͰߴසͰ͚͜Δɻ --trace Λ͔͚ͯϩά͕·ͱʹు͔Εͳ͍͜ ͱ͕͋Δɻ
Webpacker Webpacker Ͳ͏͢Δ͔ʁ Ͳ͏͢Δ͔ʁ ϩʔΧϧͰϩάग़Δ͠ɺ͋·Γ͚͜ͳ͍͜ͱʹ ؾͮ͘ɻ Ϣʔβʔ͕σϑΥϧτͰ root ͩͬͨΓɺͱͱ system͕
ruby 2.3.0 Λࠅͯ͠Δαʔόͩͬͨ ͷͰɺઌड़ͷ༷ͳ͕ग़ͨͱߟ͑ΒΕΔɻ → ϩʔΧϧͰίϯύΠϧΛ௨ͯ͠͠·͍͍͑ɻ → ͦͷޙrsyncͰϑΝΠϧసૹΛߦ͏ capistarano λεΫΛఆٛͯ͠͏ɻ
None
ল ল Γ͍ͨ͜ͱʹྗΛஔ͍࣮ͨϥΠϒϥϦͷ ༻ޮΑ͘ਐΊΒΕͨͷͰɺͦ͏͍ͬͨํʹ࣌ ؒΛ͏গ͑͠ΕΑ͔ͬͨɻ ͳΜͲߦ͏σϓϩΠޮԽ͓ͯ͜͠͏ͱࢥͬͨ ݁ՌɺͦͪΒʹ࣌ؒΛ͍ա͗ͯ͠·ͬͨɻ ܭըΛશཱͯͣ͘ʹ࡞ͬͨͨΊɺURLͳͲ͕ࡶɻ ͍Ζ͍Ζͱؒʹ߹Θͣɺೝূͷҙຯ͕ͳ͍ͱ͍͏ ೦ͳঢ়ଶɻ
ࠓޙͷ՝ ࠓޙͷ՝ νέοτγεςϜʢ͜ΕΛೖΕͳ͍ͱϩάΠϯͷҙ ຯͳ͠ʣ Email Confirmation ϦηϚϥରࡦ༻ͷΞΧϯτsoft-deleteʢίϯςϯ πͷՁͱྔΛ্͛ͳ͍ͱҙຯͳ͠ʣ GANϞσϧͷΞϓϦέʔγϣϯͷऔΓࠐΈ(Ruby Ͱॻ͖ͨ͘ͳ͍ͷͰGAE/GOͷ༧ఆ)
࣮ࡍͷDBͷը૾ͷอଘʢSaveϘλϯΧʔυΛ දʹฦ͔ͯ͠Βग़͍ͨ͠ʣ
ࠓޙͷ՝ ࠓޙͷ՝ Ϣʔβʔ͝ͱͷॴ࣋ը૾Ұཡػೳ SNS share ΞΠίϯ PWAରԠ Χʔυͷछྨ૿͢ LP࡞Δ
ࢀߟจݙ ࢀߟจݙ [ීٴ൛]δΣωϥςΟϒɾΞʔτ―ProcessingʹΑ Δ࣮ફΨΠυ,ɹMatt Pearson (ஶ), ٱอా ߊ߂ ( म),
ԭ ܒհ (༁), ϏʔɾΤψɾΤψ৽ࣾ, 2014/11 1. The Nature of Code (English Edition), Daniel Shiffman, Amazon Services International, Inc. 2.