【脱Gulp】Vite × FLOCSS 爆速開発環境（静的コーディング用）

Gulpでの開発、こんな悩みありませんか？

・リロードが遅くてストレス
・gulpfile.jsが複雑すぎて触れない
・Nodeのバージョン変えたら動かなくなった
・新規案件のたびに環境構築で時間が溶ける

それ、Viteに移行すれば全部解決します。

この開発環境を使えば

✅ yarn dev で即開発スタート
✅ 新規案件の初期構築が5分で完了
✅ FLOCSS設計済みでCSS設計に迷わない
✅ 画像圧縮・WebP変換が全自動
✅ ヘッダー・フッターのパーツ化も対応済み

もう環境構築で時間を溶かす必要はありません。

【含まれるもの】

・Vite開発環境一式（すぐ動く状態）
・FLOCSS構成のSCSSファイル
・実務で使えるコンポーネント集
・画像自動圧縮 & WebP/AVIF変換
・Handlebarsによるパーツ管理
・メタ情報のJSON一元管理
・README・コーディングガイドライン付き

【コンポーネント一覧】

・ボタン
・セクションタイトル
・カード
・ヘッダー（ドロワー付き）
・フッター
・Splideカルーセル
・アコーディオン（details/summary）

---

【こんな人におすすめ】

・Gulpから卒業したい人
・環境構築に時間をかけたくない人
・FLOCSS設計を実務に取り入れたい人
・モダンな開発環境を使いたい人
・毎回ゼロから環境を作るのが面倒な人

---

【注意事項】

・本テンプレートは静的サイト構築用です
・WordPress用ではありません
・Node.js 20.19以上、yarnが必要です
・再配布・再販売は禁止です

---

【購入者特典】

購入後、
LINE登録でさらに特典をプレゼント！

・取り扱いマニュアル（Googleドキュメント）
・よくある質問集（限定note）

---

【レビュー特典】

レビューを書いてくれた方には、
さらに追加特典をプレゼント！

- 実務で使えるスニペット集（VSCode用 / 約15種類）
  - HTML：画像タグ、picture要素、Handlebars構文など
  - CSS：Flexbox中央寄せ、Grid配置、ホバーアニメーションなど

※ レビュー投稿後、LINEでご連絡ください

---

開発が楽になって、
空いた時間でコーディングに集中できる。

環境構築の悩みから解放されたい方は、
ぜひ使ってみてください。