Svelteの最新情報：2023年7月

Svelte 4がリリースされ、皆さんが開発を進めています！ たくさんの新しいショーケース、ライブラリ、そしてチュートリアルを共有します。早速見ていきましょう...

Svelteの最新情報

今月のビッグニュースは、Svelte 4.0のリリースです！ 詳細はSvelte 4発表の投稿をご覧ください。パフォーマンスの修正や開発エクスペリエンスの向上から、まったく新しいサイト、ドキュメント、チュートリアルまで...この新しいリリースは、最小限の破壊的変更でSvelte 5への舞台を整えます。

既にNode.js 16を使用している場合は、プロジェクトに破壊的変更がない可能性があります。ただし、詳細については移行ガイドを必ずお読みください。

リリースされていない変更を含む、Svelteコンパイラのすべての変更の完全なリストについては、変更履歴をご覧ください。

SvelteKitの最新情報

今月素晴らしいバグ修正がたくさんありましたので、最新バージョンにアップグレードしてください！ また、いくつかの新しい機能についても触れておきます。

• 新しいevent.isSubRequestブール値は、サーバーリクエスト中に、アプリ自身のAPIの1つへの同一オリジンfetchリクエストであるかどうかを示します（1.21.0、ドキュメント、#10170）
• 新しい設定オプションconfig.kit.env.privatePrefixは、環境変数にプライベートプレフィックスを設定します。これはデフォルトで''です（1.21.0、ドキュメント、#9996）
• VERSIONがエクスポートされ、@sveltejs/kitを介してアクセスできるようになりました。これは、機能検出や、SvelteKitの現在のバージョンの知識を必要とするその他のあらゆることに使用できます（1.21.0、ドキュメント、#9969）

アダプター固有の変更については、各adapterディレクトリの変更履歴をご覧ください。

---

コミュニティショーケース

Svelteで構築されたアプリとサイト

• Heerdle は、Spotifyの現在は廃止されたHeardle（毎日の音楽当てゲーム）のリメイクです。
• Meoweler は、猫と人気のある目的地に関する役立つ情報でいっぱいの旅行サイトです。
• IKEAのテックリードが、Svelteを使用してページ（およびページテンプレート）を構築する方法について、さらに詳しく説明しました。
• パスワードを置き換えるための探求は、すべての人気のあるパスワード管理ツールのためのインタラクティブな比較ビジュアライゼーションを備えています。
• audiogestを使用すると、ワンクリックで音声をテキストに変換し、要約することができます。
• heroify は、AIを使用してWebサイト用の3Dグラフィックスを生成します。
• Diesel Legacy: The Brazen Age は、リーダーボードとプロファイルページがすべてSvelteで構築された格闘ゲームです。
• markmyimages は、一括画像のサイズ変更、名前変更、エフェクトなどを備えた透かしツールです。
• md.robino.dev は、Webベースのマークダウンエディターです。
• YABin は、非常に特殊な機能を備えたYet Another Pastebinです。

学習リソース

• Svelte 4発表の投稿
• svelte.dev：完全なオーバーホール

Svelteコントリビューターとアンバサダーの紹介

• 開発ブログ：2023年6月 - Rich HarrisによるSvelte 4.0
• PodRocket：Svelte 4（Geoffと）
• This Dot Media：Svelte 4ローンチパーティー（Simon、Ben、Geoff、Puruと）
• Exposing Svelte: Between Two Nerds は、Rich HarrisとDax Raadのコミカルな会話です。
• コミュニティチュートリアル：VPS、Docker、CapRover、GitHub Actionsを使用したSvelteKitのセルフホスティング（Stanislav Khromovと）
• SvelteKitとStorybook（Jeppe Reinholdと）
• 今週のSvelte
  • 2023年6月2日 - SvelteKit 1.20.1、Svelte 4プレリリース、Headless UIライブラリ
  • 2023年6月9日 - アップデート、SvelteKitのセルフホスティング、子へのスタイルの受け渡し
  • 2023年6月16日 - Svelte 4 next.1、ハンバーガーメニューの作成方法、グループレイアウト
  • 2023年6月23日 - Svelte 4、ポップオーバーとホバー、SvelteKitを使用したリアルタイムリクエスト
• Svelte Radio
  • SvelteLab - SvelteKit用のSvelte REPL（AntonioとPaoloと）
  • Svelte Radio Live - Svelte 4サマースペシャル（SimonとPuruと）
• Svelte Society - 2023年6月ロンドン
• Joy of CodeによるストアでSvelteコンテキストAPIを使用する、SvelteとGSAPを使用した不可能なFLIPレイアウトアニメーション、Svelteで美しいプレゼンテーションを作成する

視聴するもの

• hartenfellerdevによるSvelteKitでのサーバーサイドでフィルタリング、ページネーション、ソートされたテーブル
• SvelteRustによる2023年にSvelteとSvelteKitに最適なアイコンライブラリ

読むもの

• Justin AhinonによるSvelteKitでゼロから本番環境まで
• Claudio HolandaによるSvelte(Kit)についての考察、1年後と30億リクエスト後
• Stanislav KhromovによるSvelteKitとCapacitorを使用してiOSとAndroid用の感謝ジャーナリングアプリを公開した方法
• Black Spikeによる実践による学習 - Vue開発者がSvelteシングルページアプリを構築する
• Aakash GoplaniによるSvelteKitでパンくずリストとナビゲーションを生成する、SvelteKitAuthとOAuthプロバイダーを使用したSvelteKit認証：包括的なガイド、Salesforce OAuthプロバイダーを使用したSvelteKitAuth
• Jeremy ZaborowskiによるSvelteコンポーネントの孤立を即座に見つけて削除する
• Aakash GoplaniによるRoutifyからSvelteKitルーターへの移行ガイド
• DataViz CubedによるThrelteとD3を使用した3Dデータビジュアライゼーションの作成
• Rodney LabによるSvelteリアルタイムマルチプレイヤーゲーム：ユーザープレゼンスとSvelteKit PostCSSチュートリアル：Future CSSを今日から使用する
• Igor NowosadによるSvelteKitのルーティングの世界：動的ルートとパラメーターを使用してアプリの力を解き放つ

ライブラリ、ツール、コンポーネント

• Vercel AI SDK は、ReactとSvelteで構築されたAIアプリ向けの、相互運用可能でストリーミング対応のエッジ対応ソフトウェア開発キットです。
• Superforms 1.0 がリリースされました。詳細については、移行ガイドと新機能リストをご覧ください。
• Panda CSS は、ビルド時に生成されるスタイル、RSC互換性、マルチバリアントサポートを備えたCSS-in-JSです。
• svelte-section-list は、アイテムとセクションを管理するためのドラッグアンドドロップ機能を提供する、ヘッドレスSvelte npmパッケージです。
• WebStorm は、IDEツーリングでSvelte言語サーバーの使用を開始しています。
• shadcn-svelte は、shadcn/ui の非公式のSvelteへの移植版であり、共通のベースコンポーネントからコンポーネントライブラリを簡単に構築できます。
• sveltekit-multibuild は、Androidアプリ、Webサイト、デスクトップアプリ、Chrome拡張機能を自動的に作成するためのスターターリポジトリです。
• SvelteKit AI Chatbot は、SvelteKit、Vercel AI SDK、OpenAI、Vercel KVを使用して構築されたオープンソースのAIチャットボットアプリテンプレートです。
• KitAI は、SvelteKitとNext.js用のすぐに使えるAIテンプレートを提供します。
• Svelte Form Builder は、Svelte用のノーコードのドラッグアンドドロップフォームビルダーです。

読んでいただきありがとうございます！ いつものように、RedditまたはDiscordで見逃しているものがあればお知らせください。

次回まで👋