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
Eleventy3.0 で始める爆速個人ブログ開発!
Search
takanorip
February 01, 2025
Technology
0
230
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
February 01, 2025
Tweet
Share
More Decks by takanorip
See All by takanorip
Design System Documentation Tooling 2025
takanorip
3
2k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
0
860
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
620
Bulletproof Design System with TypeScript
takanorip
7
4.6k
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
5
1k
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
15
7.7k
社内管理画面のデザインもプロダクトデザイン
takanorip
5
2.1k
早わかり W3C Community Group
takanorip
0
540
Ubieとアクセシビリティのこれからを考える
takanorip
0
500
Other Decks in Technology
See All in Technology
AI Agent Agentic Workflow の可観測性 / Observability of AI Agent Agentic Workflow
yuzujoe
1
570
製造業から学んだ「本質を守り現場に合わせるアジャイル実践」
kamitokusari
0
620
Redshift認可、アップデートでどう変わった?
handy
1
140
わが10年の叡智をぶつけたカオスなクラウドインフラが、なくなるということ。
sogaoh
PRO
1
510
SES向け、生成AI時代におけるエンジニアリングとセキュリティ
longbowxxx
0
320
技術選定、下から見るか?横から見るか?
masakiokuda
0
190
投資戦略を量産せよ 2 - マケデコセミナー(2025/12/26)
gamella
1
640
【Agentforce Hackathon Tokyo 2025 発表資料】みらいシフト:あなた働き方を、みらいへシフト。
kuratani
0
120
AWSと生成AIで学ぶ!実行計画の読み解き方とSQLチューニングの実践
yakumo
2
450
純粋なイミュータブルモデルを設計してからイベントソーシングと組み合わせるDeciderの実践方法の紹介 /Introducing Decider Pattern with Event Sourcing
tomohisa
1
990
形式手法特論:コンパイラの「正しさ」は証明できるか? #burikaigi / BuriKaigi 2026
ytaka23
16
5.5k
手軽に作れる電卓を作って イベントソーシングに親しもう CQRS+ESカンファレンス2026
akinoriakatsuka
0
220
Featured
See All Featured
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
97
The SEO identity crisis: Don't let AI make you average
varn
0
48
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
370
A Modern Web Designer's Workflow
chriscoyier
698
190k
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
0
280
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
430
The agentic SEO stack - context over prompts
schlessera
0
590
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.4k
Agile that works and the tools we love
rasmusluckow
331
21k
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
51k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
1
270
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を よろしくお願いします!