【公開講座】SvelteKit入門 -TypeScript-

※2025年3月～より、コース内容が一部変更されました。内容をご確認のうえ、お申込みください。 フロントエンド/バックエンド双方を備えたWebアプリケーションを高い生産性で開発するためのSvelteKit入門コースです。 本コースでは、最新のフロントエンドフレームワークであるSvelteとそのサーバーサイドフレームワークSvelteKitを用いたWebアプリケーション開発の基礎を学びます。まず、Svelteの基礎として、コンポーネント、props、リアクティブなどの概念を学習します。次に、SvelteKitを導入し、ルーティング、レイアウト、フォームアクション、APIルートといったWebアプリケーション開発に必要な要素を学びます。 ※受講に関する注意点※ 進行の都合上、研修開始時間を過ぎてからのご参加はご遠慮いただいております。 大変恐れ入りますが、研修開始時間までにご参加いただけていない場合、当日キャンセル扱いをさせていただく場合がございますのでご注意ください。

・SvelteKitを用いて、フロントエンド/バックエンド双方を備えたWebアプリケーションを開発できる

• ■ SvelteとSvelteKitを順序立てて学びたい方
• ■ メタフレームワークでのWebアプリケーション開発を体験したい方

下記をご受講済みの方、もしくは同等の技能をお持ちの方
■ 「モダンJavaScript入門」「TypeScriptイントロダクション」をご受講いただいた方もしくは、同等の技術を習得している方
■ ECMAScript2015以降の文法でJavaScriptのコーディングを行ったことのある方

2日間

■ Svelte概要
　□ Svelteとは
　□ Svelteの特徴
　□ エディタの設定
　□ 雛形作成
　□ シンプルなサンプル
■ コンポーネント基礎
　□ コンポーネントとは
　□ コンポーネントの親子関係
　□ コンポーネントの構成要素
　□ 式の埋め込み
　□ 分岐と繰り返し表示
　□ イベントハンドラ
　□ 親子関係とprops
■ リアクティブ
　□ 状態とは
　□ 状態の作成と更新
　□ 変更に連動して動作
　□ 入力値の受け取り
　□ 配列やオブジェクトを状態として扱う
■ SvelteKit概要
　□ SvelteKitとは
　□ SSRとは
　□ 雛形作成
　□ シンプルなサンプル
■ ルーティング
　□ ページの定義
　□ URLパラメータの取得
　□ プログラム的な遷移
■ レイアウト
　□ レイアウト定義
　□ レイアウトのデータ取得
■ 状態管理
　□ 状態管理
　□ Context API
　□ 状態と状態を操作する関数を共有
　□ xxx.svelte.ts ファイル
■ APIルートとデータ取得
　□ APIルートでWeb API作成
　□ Fetch APIでデータを取得
■ フォームアクション
　□ フォームアクション
　□ プログレッシブエンハンスメント
　□ プログレッシブエンハンスメントのカスタマイズ

■ 付録 : BFFとリクエストの受け渡し
■ 付録 : TypeScript要点速習
■ 付録 : Fetch APIによるHTTP通信
■ 付録 : npmの利用

※最新でより良い内容をお届けするため、一部の学習項目を予告なく変更する可能性がありますのでご了承ください。

■ Node.js v18.13以降
■ SvelteKit v2.16以降
■ Svelte v5以降
■ TypeScript v5.0以降
■ Chrome
■ Visual Studio Code

※ 使用するソフトウェアおよびバージョンについては予告なく変更する可能性がありますのでご了承ください。

オンライン参加の方は、研修当日にPDFのテキストを配布いたします。
オフライン（対面）参加の方は、研修当日に紙媒体のテキストを配布いたします。

■セミナールーム開催

■オンライン開催

※お問合せ内容ご記入欄に「SvelteKit入門 -TypeScript-」とご記入のうえお問合せください