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
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
takanorip
February 01, 2025
Technology
280
0
Share
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
February 01, 2025
More Decks by takanorip
See All by takanorip
「見せる」登壇資料デザインの極意
takanorip
3
760
Design System Documentation Tooling 2025
takanorip
3
2.6k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
1
1k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
720
Bulletproof Design System with TypeScript
takanorip
7
5k
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
6
1.1k
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
15
7.8k
社内管理画面のデザインもプロダクトデザイン
takanorip
5
2.2k
早わかり W3C Community Group
takanorip
0
590
Other Decks in Technology
See All in Technology
Google Cloud Next '26 の裏でこっそりリリースされたCloud Number Registry & Cloud Hub コスト分析 を試してみた
hikaru1001
0
110
AndroidアプリとCopilot Studioの統合
nakasho
0
170
Shipping AI Agents — Lessons from Production
vvatanabe
0
290
「責任あるAIエージェント」こそ自社で開発しよう!
minorun365
10
2.3k
AIが盛んな時代に 技術記事を書き始めて起きた私の中での小さな変化
peintangos
0
280
目的ファーストのハーネス設計 ~ハーネスの変更容易性を高めるための優先順位~
gotalab555
8
2.5k
Microsoft 365 / Microsoft 365 Copilot : 自分の状態を確認する「ラベル」について
taichinakamura
0
370
Do Vibe Coding ao LLM em Produção para Busca Agêntica - TDC 2026 - Summit IA - São Paulo
jpbonson
3
160
20年前の「OSS革命」に学ぶ AI時代の生存戦略
samakada
0
500
AIコーディング時代における、ソフトウェアサプライチェーン攻撃に対する防衛術(簡易版)
soysoysoyb
0
160
Oracle AI Database@AWS:サービス概要のご紹介
oracle4engineer
PRO
4
2.4k
【技術書典20】OpenFOAM(自宅で深める流体解析)流れと熱移動(2)
kamakiri1225
0
290
Featured
See All Featured
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
280
Bash Introduction
62gerente
615
210k
Paper Plane (Part 1)
katiecoart
PRO
0
6.8k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
340
Site-Speed That Sticks
csswizardry
13
1.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.7k
Optimizing for Happiness
mojombo
378
71k
Darren the Foodie - Storyboard
khoart
PRO
3
3.3k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.7k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
1
2k
Six Lessons from altMBA
skipperchong
29
4.2k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
500
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を よろしくお願いします!