JAWS DAYS 2017の公式サイト インフラと静的HTMLへの変換

[仙台] JAWS DAYS 2017 Recap!
JAWS DAYS 2017の公式サイト
インフラと静的HTMLへの変換
https://jaws-tohoku.doorkeeper.jp/events/58096

Transcript

1. J A W S D AY S 2 0 1 7 ͷ ެ ࣜ αΠ τ 
 Π ϯ ϑ ϥ ͱ ੩ త H T M L ΁ ͷ ม ׵ D i g i t a l C u b e I n c . : K a z u e I G A R A S H I [ ઋ ୆ ] J A W S D A Y S 2 0 1 7 R E C A P !
2. K a z u e I G A R A S H I ʢ ޒ े ཛྷ ࿨ ܙ ʣ @ g a t e s p a c e _ k • http://gatespace.jp/ • http://qiita.com/gatespace • https://github.com/gatespace • DigitalCube Inc. : Code Wrangler / Frontend Engineer • AWS : Advanced Technology Partner • _s (Underscores) : Contributor • JAWS-UG ౦๺ / ໢ݩػಈୂ
3. h t t p s : / / j a . a m i m o t o - a m i . c o m / h t t p s : / / g e t s h i f t e r. i o / h t t p s : / / g e t b o o s t e r. i o /
4. h t t p s : / / w w w. f a c e b o o k . c o m / G H O S T I N T H E A M I M O T O / h t t p : / / u n d e r s c o re s . m e / h t t p s : / / j a w s - t o h o k u . d o o r k e e p e r. j p /
5. A G E N D A • JAWS DAYS 2017 ެࣜαΠτͷΠϯϑϥͷ࿩ • JAWS DAYS 2017 ެࣜαΠτͷ੩తHTML΁ͷม׵
6. J A W S D AY S 2 0 1 7 ެ ࣜ αΠ τ 
 Π ϯ ϑ ϥ ͷ ࿩
7. Wo rd P re s s P o w e re d b y A M I M O T O ( H V M ) • શ෦ೖΓʢWebαʔόʔɺσʔλ ϕʔεɺWordPressʣ • ΠϯϑϥΤϯδχΞͰ͸ͳͯ͘΋͢ ͙ʹௐୡͱηοτΞοϓ͕Ͱ͖Δ • https://ja.amimoto-ami.com/
8. Wo rd P re s s ͳ Ͳ • JAWS DAYS 2017 ެࣜαΠτͷ࿩
 https://gatespace.jp/2017/03/15/jaws- days-2017-website-stroy/ • JAWS DAYS 2016 ެࣜαΠτཪ࿩
 https://gatespace.jp/2016/03/24/jaws- days-2016-website-stroy/ • GitHubϦϙδτϦ
 https://github.com/jaws-ug/ jawsdays2017/wiki
9. S P E C • OS: AmazonLinux • Runtime: PHP5.6 (PHP7) • Proxy Cache: Nginx • Function: Monit • Web Server: Nginx • Database: Percona • EC2: t2.micro • Elastic IP • Route53 • (S3)
10. • GoogleΞφϦςΟΫεɹ3/10ʙ3/11 • 3/10ɹ௚લ৘ใϦϦʔε • 3/11ɹ։৔લޙͷ9:00͕ϐʔΫʢΞΫηε৘ใɺλΠϜςʔϒϧʣ
11. • CloudWatchɹ3/10ʙ3/11 • CPU࢖༻཰͸3/10ʢχϡʔεެ։ͳͲʣ͕ͩ࠷େͰ΋10%ఔ౓ • NetworkIn͸3/11ɹαʔόʔଆͰΩϟογϡΛฦͯ͠ΔʹCPU࢖༻཰͸௿͍
12. Π ϯ ϑ ϥ · ͱ Ί • AMIMOTO AMIͳΒϑϩϯτΤϯδχΞͰ΋શ෦ೖΓαʔόʔΛ͙͢ௐୡ Ͱ͖Δ • t2.micro ΠϯελϯεͰ΋͋ͱ10ഒఔ౓ͷΞΫηε͸଱͑ΒΕΔ • ऴΘͬͨΒ੩తHTMLʹॻ͖ग़͠ͰS3ϗεςΟϯάʢʹӬ୅ڙཆʣ • ʹෆཁͳΠϯελϯεΛىಈ͠ͳ͍ɻ੩తHTMLͳͷͰCMSͳͲͷηΩϡ ϦςΟϗʔϧ΋ͳ͍
13. J A W S D AY S 2 0 1 7 ެ ࣜ αΠ τ 
 ੩ త H T M L ΁ ͷ ม ׵
14. ੩ త H T M L ΁ ͷ ม ׵ લ ͷ ஫ ҙ ఺ • WordPressͷݕࡧ࢖͑·ͤΜ • ϝʔϧϑΥʔϜ࢖͑·ͤΜ • WordPressͷίϝϯτ࢖͑·ͤΜ • WordPressͷoEmbedͷ͏ͪαΠτ಺ ϦϯΫͷຒΊࠐΈΧʔυ࢖͑·ͤΜ
15. ख ॱ • DBͱϝσΟΞͷॻ͖ग़͠ • StaticPressϓϥάΠϯͷΠϯετʔϧ • ॻ͖ग़͠ʢ࠶ߏஙʣ • S3΁ͷΞοϓϩʔυ • DNSͷॻ͖׵͑ • EC2Πϯελϯεͷఀࢭʢ or Terminateʣ h t t p s : / / g i t h u b . c o m / j a w s - u g / j a w s d a y s 2 0 1 7 / w i k i
16. ख ॱ 1 ɿ D B ͱ ϝ σΟΞ ͷ ॻ ͖ ग़ ͠ • WordPressͷ͋ΔσΟϨΫτϦͰҎԼͷίϚϯυΛ࣮ߦ͠ϢʔβʔσΟϨ ΫτϦʹॻ͖ग़͠ɻ • ॻ͖ग़͞ΕͨΒϩʔΧϧͳΓʹDL͓ͯ͘͠ # D B $ w p d b e x p o r t ~ / j a w s d a y s 2 0 1 7 . s q l S u c c e s s : E x p o r t e d t o ' / h o m e / e c 2 - u s e r / j a w s d a y s 2 0 1 7 . s q l ' . # ϝ σΟΞ $ t a r - z c v f ~ / j a w s d a y s 2 0 1 7 u p l o a d s . t a r . g z w p - c o n t e n t / u p l o a d s /
17. ख ॱ 2 ɿ S t a t i c P re s s ϓ ϥ άΠ ϯ ͷ Π ϯε τ ʔϧ • WordPressͷ͋ΔσΟϨΫτϦͰҎԼͷίϚϯυΛ࣮ߦɻ $ w p p l u g i n i n s t a l l s t a t i c p r e s s - - a c t i v a t e I n s t a l l i n g S t a t i c P r e s s ( 0 . 4 . 5 ) h t t p s : / / d o w n l o a d s . w o r d p r e s s . o r g / p l u g i n / s t a t i c p r e s s . 0 . 4 . 5 . z i p ͔ Β Π ϯε τ ʔϧύ ο έ ʔ δ Λ μ ΢ ϯ ϩ ʔ υ ͯ͠ ͍ · ͢ … ύ ο έ ʔ δ Λ ల ։ ͯ͠ ͍ · ͢ … ϓ ϥ άΠ ϯ Λ Π ϯε τ ʔϧ ͯ͠ ͍ · ͢ … ϓ ϥ άΠ ϯ ͷ Π ϯε τ ʔϧ ͕ ׬ ྃ ͠ · ͠ ͨ ɻ A c t i v a t i n g ' s t a t i c p r e s s ' . . . S u c c e s s : P l u g i n ' s t a t i c p r e s s ' a c t i v a t e d .
18. ख ॱ 3 ɿ ॻ ͖ ग़ ͠ ʢ ࠶ ߏ ங ʣ 1.μογϡϘʔυʼStaticPressʼStaticPressઃఆɹͰҎԼΛઃఆ͠อଘ • ੩తαΠτ URLɿhttp://jawsdays2017.jaws-ug.jp/ • ग़ྗઌσΟϨΫτϦ (υΩϡϝϯτϧʔτ)ɿ/home/ec2-user/static/ʢ͜Ε͸೚ҙͷ σΟϨΫτϦͰOKʣ 2.μογϡϘʔυʼStaticPressɹͰ࠶ߏஙΛ࣮ߦ 3.׬ྃͨ͠ΒϩʔΧϧʹμ΢ϯϩʔυ͢ΔͳͲͯ͠σουϦϯΫ΍ιʔεʹ໰୊ͳ͍͔ ֬ೝ
19. ख ॱ 4 ɿ S 3 ΁ ͷ Ξ οϓ ϩ ʔ υ • S3ʹखॱ3Ͱॻ͖ग़ͨ͠੩తαΠτ URLͷυϝΠϯͱಉҰͷόέοτ
 ʢྫɿjawsdays2017.jaws-ug.jpʣΛ ࡞੒ʢόέοτϗεςΟϯάʣ • ༻ҙͨ͠όέοτʹॻ͖ग़ͨ͠ϑΝ ΠϧҰࣜΛΞοϓϩʔυ • ύϒϦοΫDNSͰΞΫηε͠Ұ௨Γ ֬ೝ
20. ख ॱ 5 ɿ D N S ͷ ॻ ͖ ׵ ͑ • Route53 Ͱ jawsdays2017.jaws-ug.jp ͷ CNAME Λ S3όέοτͷ Τϯυ ϙΠϯτʹ͓ͯ͘͠
21. ख ॱ 6 ɿ E C 2 Π ϯε λ ϯε ͷ ఀ ࢭ ʢ O R T E R M I N AT E ʣ
22. h t t p s : / / g e t s h i f t e r. i o / ͜ͷखॱ͕໘౗͍͘͞ͱײͨ͡Β Shifter ࢖ͬͯΈΑ͏
23. A b o u t S h i f t e r • WordPressͷαΠτΛؙ͝ͱHTMLʹ ͯ͠άϩʔόϧͳCDNͰ഑৴ • SSL, HTTP/2 • WordPress͸࢖͏ͱ͖͚ͩىಈͳͷ ͰϝϯςϑϦʔ͔ͭηΩϡϦςΟϦ Ϋε͕௿͍ • αʔόʔͷ؅ཧίετෆཁ
24. Thanks!