Svelte.js の学習には費用がかかりますか?
Svelte は、コーディング初心者に最適なプラットフォームです。HTML/CSS と JavaScript のスキルを組み合わせるだけで、追加の知識がなくても、最初の Web サイトをゼロから構築できます。これにより、ほとんどの代替手段とは異なり、学習曲線が非常に短くなります。これに加えて、Svelte は充実した学習リソースも提供しており、学習者は React、Vue、Angular のように数週間や数か月かかるのではなく、わずか数日で詳細を習得できるようになります。
Svelte.js を始める
もう、Svelte コードを書き始める準備ができていると思います。そのために、Svelte コンポーネントを使用して ToDo リストを作成する方法を示す初心者向けのチュートリアルを用意しました。To Do を完了としてマークしたり、不要な To Do を削除したりできる対話型フォームを構築します。この To Do リスト アプリを作成する前に、見てみましょう。Svelte の基本構文は、私が専門家ではないことを前提としています。整理整頓された人で、To-Do リスト プログラムを構築する必要があります。この To-Do リスト プログラムがすべての作業を 1 つずつ完了するのに役立つことを願っています。皆さん、私に参加して、この素晴らしい開発の旅に乗り出しましょう。このアプリケーションを構築しましょう一緒。
Svelte プロジェクトを作成する
ステップ 1: cmd を開いてコマンドを入力します。npm create vite@latest
ステップ 2: プロジェクト名を入力します
ステップ 3: Selvet フレームワークを選択する
ステップ 4: 言語を選択します (ここでは Javascript が選択されています)
プロジェクトを開く
npm run dev と入力してプロジェクトを開始すると、次のページが表示されます (Vite と Svelte の大きなロゴ)
これをコンパイルすることもできます。以下では、そのボリュームがわずか数 kb であることがわかります。
こんにちは世界
すべての言語の最初のファイルは、ta から分離できません。
App.svelte ファイルを開き、その中の内容をすべてクリアします。次のコードを記述するだけです。
script タグで宣言するデータは直接応答するデータです。vue や他のフレームワークとは異なり、応答するようにするには ref/reactive のように宣言する必要があり、div 中括弧空間で js 操作を開発する必要があるため、いくつかのメソッドを使用できます。 js
imgタグの使用
方法は 2 つあります。1 つ目は直接 src='image address' です。2 つ目は直接 {address} の略語で、一部の友達は保存時に略語形式に直接変更する場合があります。
双方向バインディング
レンダリングするファイルを変更するには、main.js ファイルに移動する必要があります。
これは、vue の v-module に似ていますが、ここでは双方向バインディングに binding:value が使用される点が異なります。
