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
Svelte でルービックキューブを作ってみた
Search
Yuto Ono
March 22, 2024
1
220
Svelte でルービックキューブを作ってみた
Yuto Ono
March 22, 2024
Tweet
Share
More Decks by Yuto Ono
See All by Yuto Ono
1_年間_EM_エンジニアリングマネージャー_を経験した人の話.pdf
yutoono
0
53
EMを目指す方法
yutoono
1
180
レガシーなフロントエンドを_React___Next.js_にリプレースした結果.pdf
yutoono
0
1.2k
レガシーなフロントエンドを リプレースするプラクティス。 エネチェンジが挑む 「React化」
yutoono
4
2k
WebAssembly で 世界最速の数独ソルバーを作った話
yutoono
0
990
AWS Codebuild のすすめ
yutoono
0
1.4k
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
696
190k
Side Projects
sachag
455
43k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Facilitating Awesome Meetings
lara
55
6.5k
Documentation Writing (for coders)
carmenintech
74
5k
How GitHub (no longer) Works
holman
315
140k
The World Runs on Bad Software
bkeepers
PRO
70
11k
How to Ace a Technical Interview
jacobian
279
23k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
Building an army of robots
kneath
306
46k
Art, The Web, and Tiny UX
lynnandtonic
302
21k
Into the Great Unknown - MozCon
thekraken
40
2k
Transcript
Svelte で ルービックキューブを作ってみた
Yuto の自己紹介 • ENECHANGE株式会社 EM ◦ 本業では主に React を使っている •
個人開発ではSvelteを使うことが多い • 趣味 ◦ ルービックキューブ ▪ 自己ベスト8秒(参考: 世界記録3.13秒) ◦ その他色々
Svelte でルービックキューブ まずはこちらをご覧ください https://rubiks-cube-yuto.vercel.app/ 使用技術 • Svelte • Vite
Svelte でルービックキューブ リポジトリはこちら https://github.com/yuto-ono/rubik • SVGを動的に出力してキューブを描画している • 座標の処理はすべて自前で実装 ◦ ベクトルや行列の計算など
Svelte をアップグレードしてみた • 一年以上前に作ったやつなので、Svelteのバージョンが古くなってた • Before ◦ Svelte 3.52.0 •
After ◦ Svelte 4.2.12
Svelte をアップグレードしたら、警告が
最近のSvelteは a11y に力を入れている? Svelte のブログを遡ると、 a11y 関係のアップデートが多い https://svelte.dev/blog/whats-new-in-svelte-june-2023 https://svelte.dev/blog/whats-new-in-svelte-november-2022 https://svelte.dev/blog/whats-new-in-svelte-october-2022
a11y は忘れがちなので、検出してくれるのは、かなりありがたい
でも、適切な a11y 対応がわからん… このSVG、 button ではないし、 menuitem でもないんだよな…
今回は無視することにしました
まとめ 最近の Svelte は a11y 対応が手厚くなっていてす ばらしい!