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
110
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
February 01, 2025
Tweet
Share
More Decks by takanorip
See All by takanorip
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
5
800
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
14
7k
社内管理画面のデザインもプロダクトデザイン
takanorip
4
1.8k
早わかり W3C Community Group
takanorip
0
460
Ubieとアクセシビリティのこれからを考える
takanorip
0
430
2023年版 デザインシステム 技術選定の勘所 - フロントエンドカンファレンス沖縄
takanorip
2
3.8k
Astroで始める爆速個人サイト開発
takanorip
15
11k
後悔しないデザインシステムの始め方
takanorip
4
3.2k
デザインシステム運用とOKRの良い関係
takanorip
0
2.1k
Other Decks in Technology
See All in Technology
【ServiceNow SNUG Meetup LT deck】ServiceNow「検索性の進化」ZingからNow Assistまで
niwato
0
220
組織のスケールを見据えたプロジェクトリードエンジニア制度の実践 / Project Lead Engineer for Scaling Engineering Organization
ohbarye
13
2.9k
実践的なバグバウンティ入門 (2025年版)
scgajge12
4
900
Scala meets WebAssembly
tanishiking
0
170
テクスチャ画像付きのメッシュモデルを3次元点群へ変換する
kentaitakura
1
420
TechBullエンジニアコミュニティの取り組みについて
rvirus0817
0
560
Github Copilot Chatは本日よりケ◯ロ軍曹でありま〜〜〜すッ!!!(たぶん)
yu_yukk_y
1
120
Alpine.js を活用した Laravel MPA フロントエンド最適化戦略 / Alpine.js MPA
tzmfreedom
1
540
BCMathを高速化した一部始終をC言語でガチ目に解説する / BCMath performance improvement explanation
sakitakamachi
0
200
Engineering Managementのグローバルトレンド #emoasis / Engineering Management Global Trend
kyonmm
PRO
1
230
SLI/SLO・ラプソディあるいは組織への適用の旅
nwiizo
3
600
OCI Oracle Database Services新機能アップデート(2024/12-2025/02)
oracle4engineer
PRO
2
160
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
11
1.4k
Unsuck your backbone
ammeep
669
57k
Mobile First: as difficult as doing things right
swwweet
223
9.5k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
YesSQL, Process and Tooling at Scale
rocio
172
14k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
22
2.6k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Designing for humans not robots
tammielis
250
25k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.7k
Six Lessons from altMBA
skipperchong
27
3.7k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
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を よろしくお願いします!