Blog

サービス開発にSvelteKitを導入するために行なったアプローチ

この記事は、ニフティグループ Advent Calendar 2022 25日目の記事です。

こんにちは、たけろいどです。SvelteKit v1.0.0リリースおめでとうございます!!
この日を心待ちにしていました。まさに魔法のように動き、コードを書くたびに驚かされています。

はじめに

この記事ではSvelteKitの技術的知見を多くは提供しません。 どちらかというとSvelteKitを本番環境へ採用するまでに至った心構えや気を付けていることを述べていきます。

とはいっても…

なにも紹介しないというのも釈然としないので、情報をどう集めているかを残しておきます。 これからSvelteKitを使っていく人の参考になればとてもうれしいです!

SvelteやSvelteKitはとても新しいほうのフレームワークです。そのため日本語の情報は少ないです。さらにSvelteKitのv1.0.0の情報は日本語に限らず情報が少ないです。

その時に頼りになるのが公式ドキュメントです!
Svelte
SvelteKit

Svelteは公式ドキュメントがとても優秀で開発に必要な情報は7割方こちらを参考にしています。 UseCaseが欲しい場合はExamplesを見てみましょう

これら公式ドキュメントは有志の方々が翻訳してくださっています。本当にありがとうございます。
SvelteJP
SvelteKitJP

他3割はSvelteのGithubを見ることが多いです。issueやdiscussionを覗いてみましょう。より詳細な情報を入手できるでしょう。
よきSvelte lifeを 🙂

ということで主題に入ります。

SvelteKit導入までの道のり

チーム理解

「SvelteKitを使いたいです!」といっても「Nextでいいじゃん…」と言われることが大半です。
負けないように説得しましょう。確かにエコシステムでは圧倒的な差がありますが…
SvelteKitのメリットをチームに紹介しましょう。
  • コード記述量が少ない。まさに魔法のようなコード
  • Vueのようなテンプレート記法を扱える
  • 仮想DOMを使わない
  • コンパイラであること
その他Svelte・SvelteKitのメリットを感じるにはTutorialを触って実際に体験してみましょう!
またSvelteについては別の記事で紹介しました。そちらも読んでみてください。

それに加えて新しい技術にトライすることの楽しさを伝えます。しっかりとした論理を説明できた上で、熱意をぶつければ理解を得やすいです。

ちなみに旧サービスでJinja2などのテンプレートエンジンを扱っているのなら、記法が似ているのでオススメできるポイントが増えます。

サービス理解

そのサービスにSvelteKitは本当に必要でしょうか?
サービスの規模感を考えてみるのがよいと思います。

確かにSvelteKitは優秀なフレームワークですが、実用例が極々少ないです。 それゆえの不安を捨てきれません。
大きなサービスを作るのなら引継ぎや保守・運用も大変です。そんなサービスでSvelteKitを使うのは少し怖いですね。

まずは小さなサービスから始めてみるのがオススメです。社内向けサポートツールなど内向きに閉じているサービスもチャレンジしやすくてオススメです。リスクを正しく認識していればチーム理解も得やすいと思います。

技術理解

SvelteKitでできることを知りましょう。 たいていのことはできると思いますが不得意なこともあります。

ゲームを作ることは難しいですし、エコシステムもNextに比べたらまだまだです。
GithubやShowCaseなどをみて、すでに動いているサービスはどんな実装なのか見てみると勉強になります。

またあくまでもアプリケーションフレームワークです。目的はアプリケーションを作ることでそのSvelteKitは便利な手段を提供しているにすぎません。

それを念頭にSvelteKitでよりよい開発をしていきましょう。

最後に

SvelteKitを導入する上でこれら3つの理解を深めていくことが重要だと感じました。

SvelteKitは使い勝手がよく素晴らしいフレームワークです。本番環境で使うかどうかは置いといても触れておいて損はないです。

この記事を読んでSvelteKitを本番に導入した事例が増えれば幸いです。

We are hiring!

ニフティでは、さまざまなプロダクトへ挑戦するエンジニアを絶賛募集中です!
ご興味のある方は以下の採用サイトよりお気軽にご連絡ください! Tech TalkやMeetUpも開催しております!
こちらもお気軽にご応募ください!