Go & Sveltekit static adapterでWebアプリ開発
Kaikei EzakiSvelteが気に入ったので
- Svelteをほんの少しだけ触って、気になったのでSveltekitの staticアダプターを活用した静的なWebアプリケーションを作成する。
- 静的ファイルとして、jsその他ファイル群にコンパイルできる点が気に入った。
- しかし、まだコミュニティが未発達で情報は少ない。ただし、ドキュメントが整備されているので、大抵のことは載っているし、"Svelte REPL"とかで検索すると実例デモ付きのソースコードを読めるので助かる。
Kaikei Ezaki- GoとGinを使って、Sveltekitでコンパイルしたソースを、静的ファイルとしてサーバーに置く。
- 作りかけのものはあるが、テストコードも書いていないのと、ソースがめちゃくちゃなので、今後修正していく。
- Pythonで作成したものをGoに移植して、主要OS上のWebブラウザで動くアプリケーションにしたい。
Kaikei Ezakiあとで見る
Svelteの開発者が登壇した際の動画。
Kaikei Ezaki以下、和訳が間違っているかもしれません。ご指摘いただけると幸いです。
Rich Harrisに依ると
Frameworks are not tools for organizing your code,
they are tools for organizing your mind.
訳：「フレームワークはあなたのコードを整理する道具ではなく、あなたの考えを整理する道具だ。」
また
Svelte 3 moves Reactivity out of the component API, and into the LANGUAGE.
訳：「Svelte３は反応性をコンポーネントAPIから”言語”に移行させる。」
訳になっていない...
APIではなく、言語としての役割を担っていくということだろう。
英語を聞いて文章にまとめようとすると難しいな...
今回の動画の本質は上記だけじゃなく、動画内で説明していたReactとの比較や、変数のバインド、CSSの具体例などにからわかるように、Svelte側で抽象化してやってソースコードの複雑性を減らしてやる（Svelteが標榜する「Write less code」）ことが本質である。
そしてVanilla JSへのコンパイル、まさにその抽象化された元コードを翻訳してやることで、直接にDOMを操作しパフォーマンスとコンパイル前のソースに人間への直感性を担保しているのだと理解した。
Kaikei EzakiSvelteのバインディングの方法とコンポーネントに値を渡す方法を理解できていない。
Kaikei Ezakieachでの動的なフォーム生成に手こずっている。
動的に反映されない。
Kaikei Ezaki動的なフォームの実装が完了。
フォームを
<input type="number" value=1 bind:value="{todo.something}">
と実装していたために、値を2度設定していることになっていた。そのせいで、値がユニークでないというエラーが出て、3日くらい溶かした…
また時間の初期値の設定はＵＴＣのフォーマットを文字列とすることで完了した。
Kaikei Ezakiwebアプリができたので更新。
成果物
カフェインの減衰を計算するプログラム。Goが動く環境なら、クローンしてGoだけビルドすれば動きます。
グラフ周りの理解が浅く汚いし、バグがまだ残っていますが...
Svelteで学んだことはZennの記事にする予定。
Kaikei EzakiSvelteの作者のリッチ・ハリスがポッドキャストに出ている動画。Svelteの成立背景から目的などを話している。途中まで見た。
Svelte 3 moves Reactivity out of the component API, and into the LANGUAGE.
訳：「Svelte３は反応性をコンポーネントAPIから”言語”に移行させる。」
この箇所が以前はわからなかったが、本動画でSvelteを作っている最中に言語を作り出しているんだと数年前に気づいた、と語っておりなんとなく感覚がわかってきた気がする。
Kaikei Ezakistoreは永続化しないらしい。Discordで教えてくださった方ありがとうございます。
参考はこちら↓
もっと勉強しないと…
Kaikei Ezakiフロント側の処理がもたつく気がするのでRustの勉強も兼ねてWasmのSvelteへの導入を検討中。
Kaikei Ezaki想定している利用技術
-
フロントエンド
- TypeScript
- Svelte
- Sveltekit
- Rust(Wasm)
-
バックエンド
- Go
- Gin
- Go
Kaikei EzakiSvelte ＆ Rust をやっている方もいらっしゃるので無理ではなさそう。