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
SvelteKitで凝ったルーティングをするのが楽しかった話
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
HIBIKI CUBE
July 18, 2025
Technology
130
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
SvelteKitで凝ったルーティングをするのが楽しかった話
Svelte Japan Offline Meetup #4で登壇した際の資料です。
https://svelte-jp.connpass.com/event/358769/
HIBIKI CUBE
July 18, 2025
More Decks by HIBIKI CUBE
See All by HIBIKI CUBE
React島→Svelte島 住民受け入れガイド
hibiki_cube
0
16
なるべく楽してバックエンドに型をつけたい!(楽とは言ってない)
hibiki_cube
0
190
パスキーでのログインを 実装してみよう!
hibiki_cube
0
2.4k
今日からできる! はじめてのパスキー認証
hibiki_cube
1
280
ここがおもろい! Swift UI
hibiki_cube
1
120
SvelteKit × Supabaseで オレオレカンバンボード作ってみた
hibiki_cube
2
170
Other Decks in Technology
See All in Technology
AI時代の開発生産性を捉え直す — 経営と現場をつなぐ「開発組織のオブザーバビリティ」— / AI Dev Ex Conference 2026
tkyowa
1
1.6k
「顧客の声を聞かなければ何も始まらない」 ── 顧客の声から生まれた『AI返信補助機能』の開発プロセス / AICon2026_shikata_imai
rakus_dev
1
290
「待ち時間」の消滅と「自我消耗」の加速:生成AI時代のエンジニアを救うメンタル・リソース管理
poropinai1966
0
160
reFACToring
moznion
0
480
AIコード生成×サプライチェーン攻撃 — PHPが直面する“二重の信頼問題
shinyasaita
0
490
データベース研修【MIXI 26新卒技術研修】
mixi_engineers
PRO
1
290
データエンジニアリングとドメイン駆動設計
masuda220
PRO
14
2.7k
コンテナ・K8s研修【MIXI 26新卒技術研修】#2
mixi_engineers
PRO
1
170
テックカンファレンス三大ステークホルダーの文化人類学 ─ 違いを認め合う関係性作り
bash0c7
2
640
Power Automateアップデート情報
miyakemito
0
250
セキュリティ研修【MIXI 26新卒技術研修】
mixi_engineers
PRO
4
4.9k
AI工学特論: MLOps・継続的評価
asei
10
2.6k
Featured
See All Featured
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.6k
Accessibility Awareness
sabderemane
1
160
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
350
Ethics towards AI in product and experience design
skipperchong
2
330
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
Mobile First: as difficult as doing things right
swwweet
225
10k
The Invisible Side of Design
smashingmag
301
52k
Producing Creativity
orderedlist
PRO
348
40k
Designing for humans not robots
tammielis
254
26k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
640
How to Think Like a Performance Engineer
csswizardry
28
2.7k
Prompt Engineering for Job Search
mfonobong
0
380
Transcript
SvelteKitで 凝ったルーティングを するのが楽しかった話 HIBIKI CUBE @hibiki_cube
{@render children()}
突然ですが、 Svelteのプロジェクト を1つ作ってみます
bunx sv create my-app
None
None
None
None
なんとなく 見覚えあるかも… という方!
app.d.tsの 存在を知っていた という方!
app.d.tsを 編集したことがある という方!
SvelteKitで 凝ったルーティングを するのが楽しかった話 HIBIKI CUBE @hibiki_cube
None
None
None
None
None
None
None
None
None
None
None
None
None
None
None
None
None
たとえば…
None
None
let grade = $state('Adventure');
let grade = $state('Adventure'); const price = $derived(getPrice(grade));
None
None
None
やっぱり1コ前の グレードの方がいいかも
None
None
実装してみる
None
None
http://localhost:5173/adventure http://localhost:5173/g
None
page.params.grade ↓ と間違えないように!
None
None
None
None
None
let activeGrade = $derived(...);
None
None
None
None
SvelteKitで 凝ったルーティングを するのが楽しかった話 HIBIKI CUBE @hibiki_cube Fin!