アップロードして配置する

① アプリカタログにアップロードする

まず、.sppkg をアプリカタログへ登録します。

1. アプリカタログサイトを開く（SharePoint管理センター → ［詳細機能］ → ［Apps］ から辿れます。組織にまだ無ければ管理者が一度作成します）
2. ［Apps for SharePoint］ ライブラリを開く
3. sharepoint/solution/spfx-list-viewer.sppkg をドラッグ＆ドロップでアップロード
4. 信頼を確認するダイアログが出る。［このソリューションを組織内のすべてのサイトで利用可能にする］ にチェックを入れると、全サイトで使えるようになる → ［展開（Deploy）］

これで、アプリカタログに ListViewer が登録されました。

② サイトにアプリを追加する

①で「すべてのサイトで利用可能に」した場合は、多くのサイトですぐに使える状態になります。個別に追加する場合は、使いたいサイトで次を行います。

1. サイトの ［歯車アイコン］ → ［アプリの追加］（またはサイトコンテンツ → 新規 → アプリ）
2. 一覧から ListViewer を見つけて ［追加］

③ ページに配置する — ここがゴール

最後に、実際のページへ部品を置きます。

1. 配置したいモダンページを開き、［編集］
2. 本文の「＋」をクリックし、Webパーツ一覧から ListViewer を選ぶ
3. 部品が置かれたら、［鉛筆（Webパーツの編集）］ から右の設定パネルを開く
4. ［表示するリスト名］ に お知らせ を入力（別リストを映したいならその名前）
5. ［発行］ でページを公開

ページに、あなたの作った「お知らせ一覧」が表示されました。0から作った部品が、本番のSharePointで動いている——これがゴールです。

④ 更新版を配るときの流れ

一度配ったあと、機能を直したくなったら、次の順で差し替えます。

1. コードを修正する
2. config/package-solution.json の version を上げる（例：1.0.0.0 → 1.0.1.0）
3. npm run build で新しい .sppkg を作る
4. アプリカタログに同じ場所へアップロード（上書き）し、再度 ［展開］
5. 必要に応じて、各サイトでアプリを更新する

ページに置いた部品は、アプリが更新されれば自動的に新しい版で動きます。バージョンを上げ忘れると更新が反映されない——これだけ覚えておけば、運用でつまずきません。

STAGE 06 のまとめ ／ そして講座の完走

• .sppkg は アプリカタログ（Apps for SharePoint）にアップロードして展開
• サイトにアプリを追加 → モダンページにWebパーツを配置 → 設定して発行
• 更新は version を上げて再ビルド → 上書きアップロード → 展開
• これで「作った部品が本番で動く」まで到達した

STAGE 01の環境構築から、ここまで6ステージ。SPFxで独自のWebパーツを0から作り、本番へ届ける一連の流れを、通しで体験しました。次はぜひ、自分の映したいリストで、あなただけの部品を作ってみてください。