$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
誰でも簡単に組版した PDF を生成する仕組みづくり
Search
Yu Sugawara
August 23, 2023
Technology
1
72
誰でも簡単に組版した PDF を生成する仕組みづくり
YUMEMI.grow 技術同人誌を支える技術
https://yumemi.connpass.com/event/291439/
Yu Sugawara
August 23, 2023
Tweet
Share
More Decks by Yu Sugawara
See All by Yu Sugawara
HIG の歴史
yusuga
1
36
WWDC 2023 現地参加報告(コード編)
yusuga
0
140
マイク環境を考える
yusuga
0
34
Custom AppをIP制限ありのままで審査に通す方法
yusuga
0
5.5k
Swiftのas Any / AnyObjectの暗黙的な型変換について
yusuga
2
1.6k
ローカルのグローバル環境を可能な限り汚染しないXcodeの開発環境構築
yusuga
0
68
Pure DI 101
yusuga
0
210
Final conclusion of the iOS architecture
yusuga
0
270
Practical application of ReactorKit
yusuga
1
360
Other Decks in Technology
See All in Technology
LLMを「速く」「安く」 動かすには / CloudNative Days Winter 2024
pfn
PRO
4
1.1k
次のコンテナセキュリティの時代 - User Namespace With a Pod / CloudNative Days Winter 2024
pfn
PRO
4
370
Engineer Recruting Deck
siva_official
PRO
1
3.1k
GAS × Discord bot × Gemini で作ったさいきょーの情報収集ツール
ysknsid25
1
200
データカタログを自作したけど 運用しなかった話@Findy Lunch LT「データカタログ 事例から学ぶメタデータ管理の実態」
ryo_suzuki
2
360
LINEヤフーにおけるPrerender技術の導入とその効果
narirou
3
3.5k
KotlinユーザのためのJSpecify入門 / JSpecify 101 for Kotlin Devs
eller86
0
170
Windows Server 2025 Pay as you Go ライセンスを試す
murachiakira
0
180
4年で17倍に成長したエンジニア組織を支えるアーキテクチャの過去と未来
sansantech
PRO
1
4.3k
クルマのサブスクを Next.jsで内製化した経験とその1年後
kintotechdev
2
360
総会員数1,500万人のレストランWeb予約サービスにおけるRustの活用
kymmt90
2
2.5k
Entra ID の基礎(Japan Microsoft 365 コミュニティ カンファレンス 2024)
murachiakira
3
1.7k
Featured
See All Featured
Reflections from 52 weeks, 52 projects
jeffersonlam
346
20k
Raft: Consensus for Rubyists
vanstee
136
6.7k
Rails Girls Zürich Keynote
gr2m
94
13k
Statistics for Hackers
jakevdp
796
220k
We Have a Design System, Now What?
morganepeng
50
7.2k
The Cost Of JavaScript in 2023
addyosmani
45
6.8k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Side Projects
sachag
452
42k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
Automating Front-end Workflow
addyosmani
1366
200k
A Tale of Four Properties
chriscoyier
156
23k
Transcript
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ୭Ͱ؆୯ʹ൛ͨ͠ PDF Λ ੜ͢ΔΈͮ͘Γ 2023-08-23
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ࣗݾհ ੁݪ ༞ Twitter: @yusuga_ גࣜձࣾΏΊΈ: iOS ςοΫϦʔυ
߹ಉձࣾϐίε: දࣾһ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ࣥචͷྲྀΕ Markdown ϑΝΠϧͰهࣄΛॻ͘ɻ 1. Vivliostyle Ͱ Markdown ͔Β൛ͨ͠
PDF Λੜ ͢Δɻ 2. PDF Λݟ࣮ͯࡍͷࢴ໘ͷϨΠΞτࠐΈͰ ༰Λ֬ೝ͢Δʢमਖ਼͕͋Ε 1 Δʣɻ 3.
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ Vivliostyle ͱ Webٕज़Λ༻͍ͯిࢠॻ੶ͷ࡞ɺද ࣔɺҹΛՄೳʹ͢ΔCSSϑϨʔϜϫ ʔΫɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ Vivliostyle ΛΠϯετʔϧ͢Δʂ # install Volta curl https://get.volta.sh |
bash # install Node volta install node # ࣮ߦͰ͖Δ͔֬ೝ # μϝͩͬͨΒ `$HOME/.volta/bin` ʹ `PATH` ͕௨͍ͬͯ Δ͔֬ೝ volta --version
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ Vivliostyle ΛΠϯετʔϧ ͢Δʂ # ґଘϥΠϒϥϦΛΠϯετʔϧ yarn install #
࣮ߦͰ͖Δ͔֬ೝ yarn vivliostyle --version
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ PDF Λੜ͢Δʂ # vivliostyle Ͱ PDF Λੜ yarn
build # PDF Λ։͘ open ./book/output/ebook.pdf
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ՝
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ લఏ͕ࣝඞཁ curl – node – volta – yarn
– PATH ͕௨Δͱʁ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ࣮ߦͷखؒ खॱॻ௨ΓʹෳͷίϚϯυΛखಈͰ ࣮ߦ͠ͳ͚ΕͳΒͳ͍ɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ڥىҼͷ ࣗͷϚγϯڥʹπʔϧΛΠϯετ ʔϧ͢ΔͱɺͦΕͧΕͷڥͷঢ়گʹΑͬ ͯ͏·͘ΠϯετʔϧͰ͖ͳ͔ͬͨΓ࣮ ߦʹࣦഊ͢Δ͜ͱ͕͋Δɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ৭ʑͳਓʹࣥචͯ͠Β͍ͨ ͍ Web ͷ։ൃऀͳΒೃછΈ͕͋Δπʔϧͳ ͷͰͦͪΒࢀೖোนΊɻ – iOSɺAndroidɺσβΠφʹएׯϋʔυϧ ͕ߴ͍ɻ
–
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ త ࢲͨͪ node, volta, yarn, Vivliostyle ʹ͍ͭͯ ߟ͑ͨ͘ͳ͍ʂ
– ͨͩ୯ʹ Markdown ͰهࣄΛॻ͍ͯɺͦΕΛ֬ ೝ͢ΔͨΊʹ PDF Λੜ͍͚ͨͩ͠ ͳΜͩ…ʂ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ PDF Λੜ͢Δ ϋʔυϧΛԼ͛Δʂ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ վળҊ1: CI Ͱ PDF Λੜ GitHub ʹ PR
Λग़ͨ͠Β CI ্Ͱ PDF Λੜ ͯ֬͠ೝͰ͖ΔΑ͏ʹ͢Δɻ – git commit ͱ git push ͕ඞཁͰ खؒɻ – ΓؾܰʹϩʔΧϧͰ֬ೝ͍ͨ͠ɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ վળҊ2: ԾίϯςφΛ͏ DockerʢίϯςφԾԽϓϥοτϑΥʔϜʣ Λ͏ɻ – ΞϓϦέʔγϣϯͱͦͷґଘؔΛίϯς φͱݺΕΔύοέʔδʹ·ͱΊɺڥʹ ґଘͤͣʹҰ؏࣮ͯ͠ߦ͢ΔͨΊͷϓϥο
τϑΥʔϜɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ͭ·Γʁ ࣗͷϚγϯڥʹ node ͳͲΛΠ ϯετʔϧ͢Δ͜ͱͳ͘ɺίϯςφ্Ͱ Կ͔Λ࣮ߦͰ͖Δɻ – ࣗͷڥʹىҼͨ͠Πϯετʔϧ࣮
ߦͰ͖ͳ͍ΛվળͰ͖Δʂ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ վળҊ2ͷ Docker Λ͏ ํͰਐΊΔ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ࠷ऴతͳखॱॻ make run ඞཁͳίϚϯυΛ makefile ʹهड़ͯ͠ ॱ࣮࣍ߦͤ͞Δɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ make run Ͱ࣮ߦ͞ΕΔ͜ͱ brew ΛΠϯετʔϧ 1. Docker ΛΠϯετʔϧ
2. colima ΛΠϯετʔϧ 3. colima Λىಈ 4. VivliostyleʢDocker ImageʣΛ࣮ ߦ 5. PDF Λ։͘ ※ 1ʙ4͢ͰʹΠϯετʔϧ/ى ಈ͞ΕͯͨΒεΩοϓ 6. ৄࡉ 1 1. άϩʔόϧڥΛՄೳͳݶΓԚછͤͣʹMarkdown͔Β൛ͷPDFΛੜʢΏΊΈେٕྛ '23ʣ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ༻πʔϧ πʔϧ ༻్ brew macOS ͚ͷύοέʔδϚωʔδϟʔ Docker ίϯςφԾԽϓϥοτϑΥʔϜ
colima Docker ίϯςφΛ࣮ߦ͢ΔͨΊͷܰྔͳ Linux ϕʔεͷԾԽڥ Vivliostyle Webٕज़Λ༻͍ͯిࢠॻ੶ͷ࡞ɺදࣔɺҹΛՄೳʹ͢Δ CSS ϑϨ ʔϜϫʔΫ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ colima Ͱ Docker Λ࣮ߦ͢ΔϋʔυϧΛԼ͛Δ Docker ίϯςφΛ࣮ߦ͢ΔͨΊʹɺඪ४Ͱ Docker Desktop
͕ΘΕΔɻ – Docker Desktop ैۀһ͕ 250 ਓҎ্ɺ·ͨ ؒऩӹ͕ 1,000 ສυϧҎ্ͷاۀ͕༻ར༻͢Δ ߹ʹ༗ྉͷαϒεΫϦϓγϣϯ͕ඞཁͱͳ Δɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ colima Ͱ Docker Λ࣮ߦ͢ΔϋʔυϧΛԼ͛Δ ΏΊΈͰࣾͷϥΠηϯεͷ͍ग़͠ਃ ͕ඞཁͱͳΔͨΊɺʮ୭Ͱ؆୯ʹʯͷϋʔ υϧ͕एׯ্͕ͬͯ͠·͏ɻ –
Docker Desktop Λସ͢Δ colima Λ༻͢ Δ͜ͱͰਃͷखؒΛվળɻ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ·ͱΊ త͋͘·Ͱࣥච͢Δ͜ͱɻٕज़తͳ͜ͱ ҙࣝ͠ͳ͍͍ͯ͘Α͏ͳΈͮ͘ΓΛ͢Δɻ – ͍Ζ͍ΖͳਓΛר͖ࠐΜͰࣥච׆ಈΛ͛ΔͨΊ ʹɺࢀೖোนΛԼ͛Δ͜ͱΛҙࣝ͢Δɻ – ࣥච࡞ۀ͕Ұ൪͠ΜͲ͍ͷͰɺͦΕҎ֎ͷ͜ͱ
ߟ͑ͤ͞ͳ͍ʂʂ –
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ٕॻത8ʹͯ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ͓٬͞Μʮʔɺ୭Ͱ…ʯ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ͓٬͞ΜʮWindows Ͱ ʁʯ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ୭Ͱ macOS Ͱ
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ୭Ͱ؆୯ʹ ͷಓԕ ͍…
YUMEMI.grow ٕज़ಉਓࢽΛࢧ͑Δٕज़ ͝੩ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ