Svelte チュートリアルへようこそ。ここでは高速で小さいWebアプリケーションを簡単に構築するために必要な全てを学ぶことができます。
API docs や examples を参照することもできます。また、すぐにローカルで動かしたい場合は 60-second quickstart をご参照ください。
Svelteは速いWebアプリケーションを構築するためのツールです。
洗練されたインタラクティブなユーザーインタフェースを簡単に構築することが目的であるという点においては、ReactやVueなどのJavaScriptフレームワークに似ています。
しかし決定的な違いがあります。Svelteは、アプリケーションの 実行時に コードを解釈するのではなく、ビルド時に 理想的なJavaScriptに変換します。これによって、他のフレームワークにあるような抽象化とトレードオフのパフォーマンス劣化コストがなくなり、アプリが最初にロードされるときのペナルティも発生しません。
Svelteを使用してアプリケーション全体を構築することも、既存のコードベースに部分的/段階的に追加することもできます。また、従来のフレームワークに依存することなく、どこでも機能するスタンドアロンパッケージとしてコンポーネントを配布することもできます。
HTML、CSS、JavaScriptの基本的な知識があればSvelteを理解することができます。
チュートリアルを進めていくと、機能を解説する小さい演習が表示されます。後の章では前の章で学習した知識が必要になりますので、最初から最後まで学習することを推奨します。必要に応じて、上記のドロップダウンから移動することができます('Introduction / Basics'をクリックしてください)。
各チュートリアルでは、行き詰まった時に正しい解答を表示できる'Show me'ボタンがあります。ただし、これに頼りすぎないようにしてください。提示されたコードブロックをどこに配置するか自分で考え、エディタに手入力することで、より早く学ぶことができます。
Svelteでは、アプリケーションは1つ以上の コンポーネント で構成されます。コンポーネントとは、HTML、CSS、JavaScriptをカプセル化した再利用可能な自己完結型のコードブロックのことで、.svelteファイルに記述します。コードエディタの 'Hello world!' は単純なコンポーネントの例です。