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
330
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
February 01, 2025
Transcript
18 slides
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を よろしくお願いします!
More Decks by takanorip
See All by takanorip
今さら理解するウェブフォントver.2026
takanorip
3
1.2k
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
10
6.6k
「見せる」登壇資料デザインの極意
takanorip
7
2k
Design System Documentation Tooling 2025
takanorip
3
3.2k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
1
1.4k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
940
Bulletproof Design System with TypeScript
takanorip
7
5.5k
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
6
1.3k
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
15
8.1k
Other Decks in Technology
See All in Technology
An Introduction to Context Ontology Accelerator (teaching AI agents what your data means)
inariku
PRO
1
260
業務でAWSをあまり使っていない私が、AWSへのモチベを保つ方法
smt7174
0
200
農夫は秘伝のタレを知らない - NOBODY KNOWS THE HIDDEN SOURCE - Kaggriculture 3rd Place Solution
masspeaks
0
320
Gifu WordPress Meetup #200 に向けて、私たちには何ができるだろうか?/ 2026-11-07 Gifu WordPress Meetup
torounit
0
310
生成AI時代のIAMのマニアックな話
takuros
6
3.2k
Intro to Kiro (One agent, every surface) | Kiro: Zero to Hero 01
inariku
PRO
2
130
AI時代における医療情報システムのセキュリティ / Security of Healthcare IT Systems in the AI Era
henryofficial
0
170
Kiro Web 入門 (サインインから、頼み方、PR の受け取り、クラウドの決まりまで) | 目指せ Kiro マスター 04
inariku
PRO
2
120
高品質と高スピードを支える品質のシフトレフトのアプローチ
goyoki
4
1.2k
おうち環境でも「なるべく止めたくない!」 ― おうち環境の機器冗長化の理想と現実
yuutosi
0
100
IP重複は"ランディングVPC"で受け止める ― PrivateLink と Transit Gatewayによるマルチテナント接続基盤の設計
hatahata021
2
130
AIネイティブ組織の作り方。1人のPOとAIから始める、自社での実験
ama_ch
1
620
Featured
See All Featured
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1.1k
Building Adaptive Systems
keathley
44
3.3k
KATA
mclloyd
PRO
35
16k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
63
48k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.7k
Chasing Engaging Ingredients in Design
codingconduct
0
400
Six Lessons from altMBA
skipperchong
29
4.6k
GitHub's CSS Performance
jonrohan
1033
470k
Paper Plane
katiecoart
PRO
6
55k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
630
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
68
60k
Highjacked: Video Game Concept Design
rkendrick25
PRO
2
570