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
ブログ執筆を支える技術
Search
kz_morita
March 31, 2019
Technology
0
38
ブログ執筆を支える技術
https://itmokumoku.connpass.com/event/119460/
こちらのイベントで、「ブログの執筆環境」を紹介するLTを行った時のスライド
kz_morita
March 31, 2019
Tweet
Share
More Decks by kz_morita
See All by kz_morita
ブログを書き続けた話
kz_morita
1
950
Other Decks in Technology
See All in Technology
反実仮想機械学習とは何か
usaito
PRO
11
4.1k
非同期推論システムによるコスト削減と信頼性向上
koki_nishihara
0
210
Kernel MemoryでAzure OpenAI Serviceとお手軽データソース連携
mitsuzono
1
240
ServiceNow Knowledge 24の歩き方 EYストラテジー・アンド・コンサルティング
manarobot
0
190
GraphQL 成熟度モデルの紹介と、プロダクトに当てはめた事例 / GraphQL maturity model
mh4gf
7
1.3k
Vertex AI を中心に 生成AIのアップデートを共有します
kaz1437
0
300
ここが嬉しいABAC ここが辛いよABAC #再解説+補足編
masahirokawahara
1
270
開発パフォーマンスを最大化するための開発体制
ham0215
2
230
Google Cloud の AI を支える裏側のインフラを垣間見る!
maroon1st
0
340
Python と Snowflake はズッ友だょ!~ Snowflake の Python 関連機能をふりかえる ~
__allllllllez__
1
110
MLOpsの「壁」を乗り越える、LINEヤフーの Data Quality as Code
lycorptech_jp
PRO
5
460
私が trocco を推す理由
__allllllllez__
1
210
Featured
See All Featured
5 minutes of I Can Smell Your CMS
philhawksworth
199
19k
Reflections from 52 weeks, 52 projects
jeffersonlam
345
19k
From Idea to $5000 a Month in 5 Months
shpigford
377
45k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
20
1.9k
The Language of Interfaces
destraynor
151
23k
Visualization
eitanlees
136
14k
Designing Experiences People Love
moore
136
23k
The Cost Of JavaScript in 2023
addyosmani
16
3.9k
Designing for humans not robots
tammielis
248
25k
The Cult of Friendly URLs
andyhume
74
5.7k
Building Your Own Lightsaber
phodgson
99
5.7k
Stop Working from a Prison Cell
hatefulcrawdad
266
19k
Transcript
ɹɹɹࣥච Λࢧ͑Δٕज़ िҰϒϩάߋ৽ͷཪ ϒϩά @kz_morita 2019 3/31 ͳΜͰLTେձୈ̏
ࣗݾհ • kazuki morita • ɹ foresta • @kz_morita •
NewsPicks • Software Engineer • Swift / iOS • ֬౷ܭษڧத
ϒϩάࣥචঢ়گ • 9/1 ~ 3/31 ·Ͱͷ7ϲ݄ؒ • ߹ܭ27هࣄ • ि̍هࣄϖʔε
ϒϩάΛॻ͘త • Πϯϓοτͷ ྔΛ૿͢ • Πϯϓοτͷ࣭ΛߴΊΔ • ݸਓͷϒϥϯσΟϯά
ϒϩά͕ଓ͔ͳ͍ཧ༝ • ໘͍͘͞ • → ॻ͔͟ΔΛಘͳ͍ڥΛ࡞Δ • → Ͱ͖Δ͚ͩշదͳࣥචڥΛ࡞Δ •
ωλ͕ͳ͍ • ؾ߹͍
ॻ͔͟ΔΛಘͳ͍ڥ࡞Γ
ॻ͔͟ΔΛಘͳ͍ڥͱʁ • ߴΒ͔ʹએݴ
ॻ͔͟ΔΛಘͳ͍ڥͱʁ • slackάϧʔϓʮwrite-blog-every-weekʯ
շదͳࣥචڥͷߏங
շదͳϒϩάࣥචڥͱʁ • ϒϥβ্Ͱॻ͖ͨ͘ͳ͍ • ϩʔΧϧͰαΫαΫ • Vim ͓ΈͷΤσΟλ & MarkdownͰ͔͖͍ͨ
• ॻ͍͙ͯ͢ϓϨϏϡʔ͍ͨ͠ • όʔδϣϯཧ͍ͨ͠
͘͞ΒVPS localhost:8080 Preview ϩʔΧϧPC Build & Deploy push http://~
ࣥච࣌ • ϩʔΧϧαʔόʔΛͨͯΔ • هࣄΛ৽ن࡞ • vim Ͱ Markdownฤू •
อଘ͢ΔͱϦΞϧλΠϜͰϓϨϏϡʔ͕ߋ৽ ͞ΕΔͷͰ֬ೝͰ͖Δ
σϓϩΠ • $ git push origin master • Ҏ্!
ϒϩάΛࢧ͑Δٕज़ͨͪ
͘͞ΒVPS localhost:8080 Preview ϩʔΧϧPC Build & Deploy push http://~
Hugo • Golangͷ੩తαΠτδΣωϨʔλ • MarkDown → HTMLϑΝΠϧ • $ hugo
server Ͱαʔόʔཱ͕ͭ • $ hugo Ͱmd → html ʹϏϧυ
Hugo Πϯετʔϧ • OSXͳΒHomebrew ͰҰൃͰೖΔ $ brew install Hugo •
ޙड़͢ΔσϓϩΠεΫϦϓτͷͨΊαʔόʔ ʹhugoΛೖΕΔɻʢαʔόʔCentOS ͩͬͨͷͰɺgithubͰམͱͯ͠ɺgo installʣ
͘͞ΒVPS localhost:8080 Preview ϩʔΧϧPC Build & Deploy push http://~
Jenkins • ͘͞ΒVPSʹΠϯετʔϧ • GithubͷmasterϒϥϯνͷpushΛhook͢Δ ઃఆ • deployεΫϦϓτߏங npm install
npm run webpack hugo rsync -rlptgoD --delete --exclude ".git/" \ /path/to/jenkins/workspace/public/ \ /path/to/webserver/directory/
ͦͷଞ • ϑϩϯτΤϯυ (HTML/CSS) • γΣΞػೳ • ϚʔΫμϯϨΠΞτ • MathJax(ࣜ)
• PWA • Πϯϑϥ(͘͞ΒVPS) • Let's Encrypt • αΠτσβΠϯ • ϩΰ੍࡞ • OGPը૾ • Ξχϝʔγϣϯ • SEOରࡦ
·ͱΊ • շదͳڥͰिҰͰͷϒϩάߋ৽͕ܧଓத • շదͳࣥචڥΛߏஙͨ݁͠Ռɺ৭ʑͳ ͷݟ͕ಘΒΕͨ • Πϯϑϥ / σβΠϯ
/ ϑϩϯτΤϯυ etc... • ंྠͷ࠶։ൃ࠷ߴͷ᩵
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ https://blog.foresta.me https://github.com/foresta/blog.foresta.me →͓·͚͋ΔΑ
͓·͚
ϑϩϯτΤϯυڥ • Sass + ES6 + Webpack4Ͱߏங • HTML &
CSS ΄ͱΜͲ1͔Βߏங
γΣΞ • ֤छSNSͷγΣΞϩδοΫΛ࣮ • Twitter, Facebook, Pocket, ͯͿͷରԠ
هࣄͷϨΠΞτ • هࣄ͕ಡΈ͍͢Α͏ʹϑΥϯτͩͬͨΓɺ ߦؒͩͬͨΓࡉ͔͘ௐ • ࣜΛॻͨ͘Ίͷ MathJaxͷಋೖ
PWAରԠ • ແବʹʮϗʔϜʹՃʯ͕Ͱ͖Δ • ServiceWorkerରԠ (sw.js) ͱmanifest.jsonͷஔ • Chrome 73
͔ΒͷDesktop PWAʹࣗಈͰରԠ Ͱ͖ͨ!
Πϯϑϥ • ͘͞ΒVPSΛϨϯλϧ • ηΩϡϦςΟܥͱ͔ͷઃఆΛҰ௨Γ • Let's EncryptͰ httpsରԠ (SSL/TLS)
• ໊͓લ.comͰυϝΠϯऔಘ
σβΠϯ • ৭ܾΊͨΓɺશମͷํੑܾΊͨΓ • શମతʹϚςϦΞϧσβΠϯʹ४ڌ(ͨͭ͠Γ) • ϩΰ੍࡞ • γΣΞ༻ͷOGPը૾࡞ https://material.io/design/
Ξχϝʔγϣϯ • ؾ࣋ͪྑ͍ (ͱࢥ͏) Ξχϝʔγϣϯ