Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Eleventy3.0 で始める爆速個人ブログ開発!
Search
takanorip
February 01, 2025
Technology
320
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
February 01, 2025
More Decks by takanorip
See All by takanorip
今さら理解するウェブフォントver.2026
takanorip
3
490
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
10
6.2k
「見せる」登壇資料デザインの極意
takanorip
7
1.7k
Design System Documentation Tooling 2025
takanorip
3
3.1k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
1
1.4k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
910
Bulletproof Design System with TypeScript
takanorip
7
5.4k
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
6
1.2k
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
15
8k
Other Decks in Technology
See All in Technology
Snapshot Testing in Practice: Predictable and Reliable SwiftUI Views
fespinoza
0
160
ai_cording_with_k8s_knowledge.pdf
mochizuki875
1
320
今こそ知りたいAmplifyGen2
mkdev10
2
160
FactoryBotアンチパターン / factory_bot anti-patterns
toshimaru
0
140
AI駆動開発、viviONの1年 ── うまくいったこと・いかなかったこと
vivion
0
270
転んだ話が背中を預ける理由になる / A_story_about_falling_down_gives_you_a_reason_to_watch_each_other_s_backs.pdf
pauli
3
340
あなたの知らないAmazon VPC Route Server/Amazon VPC Route Server you don't know about
masakiokuda
2
240
パッチ更新でterraform initが落ちた日
grimoh
1
100
Execution in the Kingdom of Agents: Reflections on Abstraction and Complexity
bcantrill
0
890
プロダクト価値を、 チームが使える判断軸に変える
vivion
0
140
MCPゲートウェイを作って運用してわかったこと — Agent時代の権限管理の現在地
mtpooh
10
3.2k
OSC2026on_the-world-is-waiting-for-your-voice.pdf
naruoga
0
360
Featured
See All Featured
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
350
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
56k
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
260
sira's awesome portfolio website redesign presentation
elsirapls
0
450
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Documentation Writing (for coders)
carmenintech
77
5.6k
Build your cross-platform service in a week with App Engine
jlugia
234
19k
Building Flexible Design Systems
yeseniaperezcruz
330
41k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
42k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
270
Skip the Path - Find Your Career Trail
mkilby
1
250
Transcript
Eleventy3.0 で始める爆速個人ブログ開発! 大木尊紀 - BuriKaigi2025 LT
大木 尊紀 デザインエンジニア デザインとエンジニアリングが交わるところが最近の主戦場。 プロダクト開発の他にデザインシステムの開発・運用や アクセシビリティ改善にも取り組んでいる。 自己紹介
Eleventy概説
Eleventy Eleventy is a simpler static site generator シンプルなJavaScript製静的サイトジェネレーター わりと前からある(v0.1.0リリースは8年前!)
https://github.com/11ty/eleventy/blob/v0.1.0/ README.md
Eleventyの良いところ:1 めちゃくちゃ 手軽に始められる ビルドも早い 薄い
Eleventyの良いところ:2 いろいろなテンプレートに対応
Eleventyの良いところ:3 プラグインが書きやすい https://www.11ty.dev/docs/plugins/#creating-a-plugin
Eleventy3.0で できるようになったこと
Eleventy3.0 https://www.11ty.dev/blog/eleventy-v3/
Full support for ESM https://www.11ty.dev/docs/cjs-esm/
TypeScript / JSX / MDX Templates JSX, TSX, MDXがテンプレート として使えるようになった!
今まではViteなどを使って自前でビルドする必要があったが、標準でJSX、TSXが使える ※ Reactが動くわけではない!
Full support for ESM → TypeScript 設定ファイルをTypeScriptで 書けるようになった! 詳細はこちらのブログにあるよ https://bennypowers.dev/posts/typescript-11ty-config/
Eleventy 3.0 馴染みのある書き方ができるように なったので、より使いやすく! Nunjucksから開放されるの嬉しくて嬉しくてたまらないと思ってたけど 少しさみしい気もする
Full support for ESM → TypeScript FrontMatter内でJSが使えるように
Astroとどう違う?
2年前… https://speakerdeck.com/takanorip/astroteshi-merubao-su-ge-ren-saitokai-fa
Astroとの比較 Eleventy ) 薄く余計な機能がなV ) カスタマイズ性が高い、自分でいろいろやる必要があE ) 本当に静的なウェブサイト向き(ブログとか) Astro )
ReactやVueなどのコンポーネントが動作する、動的なサイトを作ることを意識していE ) 全部いい感じに面倒見てくれるリッチなフレームワーク
Eleventy3.0を よろしくお願いします!