Majorupdate/v1 0 0

.vscode/settings.json

@@ -0,0 +1,26 @@
+{
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "biomejs.biome",
+  "editor.codeActionsOnSave": {
+    "quickfix.biome": "explicit",
+    "source.organizeImports.biome": "explicit"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[javascriptreact]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[jsonc]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  }
+}

README.md

@@ -9,6 +9,9 @@ Toban のランディングページプロジェクトです。
 - **Emotion** - CSS-in-JS ライブラリ
 - **Biome** - リンター・フォーマッター
 - **Yarn** - パッケージマネージャー
+- **React Icons** - アイコンライブラリ
+- **Storybook** - コンポーネント開発環境
+- **serve** - 静的ファイル配信サーバー
 
 ## 📋 必要条件
 
@@ -30,7 +33,15 @@ cd toban-lp
 yarn install
 ```
 
-### 3. 環境変数の設定
+### 3. 不足している依存関係のインストール
+
+プロジェクトで使用されているアイコンライブラリをインストールします：
+
+```bash
+yarn add react-icons
+```
+
+### 4. 環境変数の設定
 
 必要に応じて環境変数を設定してください：
 
@@ -63,58 +74,127 @@ yarn build
 yarn start
 ```
 
+### 静的ファイルのエクスポート
+
+このプロジェクトは静的サイトとしてビルドされます：
+
+```bash
+yarn export
+```
+
+### Storybookの起動
+
+コンポーネントの開発・テスト用にStorybookを使用できます：
+
+```bash
+yarn build-storybook
+```
+
 ## 🧹 コード品質
 
-### リント
+### 自動フォーマット
+
+このプロジェクトでは以下の方法でコード品質が自動的に管理されます：
+
+#### 1. Git Hooks（推奨）
+- コミット前に自動的にBiomeのチェックと修正が実行されます
+- 問題がある場合はコミットがブロックされます
+- `lint-staged`により、ステージされたファイルのみが処理されます
+
+#### 2. VS Code設定
+- ファイル保存時に自動フォーマットが適用されます
+- Biome拡張機能が推奨されます
+
+#### 3. 手動実行
 
 ```bash
 # リントチェック
 yarn lint
 
 # リント自動修正
 yarn lint:fix
-```
-
-### フォーマット
 
-```bash
 # コードフォーマット
 yarn format
-```
 
-### 総合チェック
-
-```bash
-# リント + フォーマットの総合チェック
+# 総合チェック（リント + フォーマット）
 yarn check
 
 # 総合チェック + 自動修正
-yarn clean
+yarn check:fix
+
+# 型チェック
+yarn type-check
 ```
 
+### 開発時の注意点
+
+- コミット前に必ず`yarn check:fix`を実行することを推奨します
+- VS CodeでBiome拡張機能をインストールすると、リアルタイムでエラーが表示されます
+- プッシュ前にGitHub ActionsでBiomeチェックが実行されます
+
 ## 📁 プロジェクト構造
 
 ```
 toban-lp/
 ├── public/                 # 静的ファイル
 │   └── assets/            # アセットファイル
+│       ├── logo/          # ロゴファイル
+│       ├── HowItWorksImage/ # 説明画像
+│       ├── toban-logo.svg # Tobanロゴ
+│       ├── toban-logo-text.svg # Tobanテキストロゴ
+│       ├── hero-image.png # ヒーロー画像
+│       └── favicon.ico    # ファビコン
 ├── src/                   # ソースコード
 │   ├── components/        # React コンポーネント
 │   │   ├── common/       # 共通コンポーネント
+│   │   │   └── Button.tsx # ボタンコンポーネント
 │   │   ├── layouts/      # レイアウトコンポーネント
+│   │   │   └── base.tsx  # ベースレイアウト
 │   │   └── organisms/    # 複合コンポーネント
+│   │       ├── Header/   # ヘッダーコンポーネント
+│   │       ├── Footer/   # フッターコンポーネント
+│   │       ├── HeroSection.tsx # ヒーローセクション
+│   │       ├── Features.tsx # 機能紹介
+│   │       ├── ProblemSolution.tsx # 問題と解決策
+│   │       ├── HowItWorks.tsx # 使い方説明
+│   │       ├── UseCases.tsx # ユースケース
+│   │       ├── CaseStudies.tsx # 事例紹介
+│   │       ├── SecurityStack.tsx # セキュリティスタック
+│   │       ├── TrackRecord.tsx # 実績
+│   │       ├── Pricing.tsx # 料金プラン
+│   │       ├── Faq.tsx # よくある質問
+│   │       ├── AwardsMedia.tsx # 受賞・メディア
+│   │       ├── InfiniteLoop.tsx # 無限ループ
+│   │       └── GettingStarted.tsx # 始め方
 │   ├── data/             # データファイル
 │   ├── hooks/            # カスタムフック
 │   ├── locales/          # 国際化ファイル
 │   ├── pages/            # Next.js ページ
+│   │   ├── _app.tsx      # アプリケーション設定
+│   │   ├── _document.tsx # ドキュメント設定
+│   │   └── index.tsx     # メインページ
 │   ├── themes/           # テーマ設定
-│   │   ├── settings/    # テーマ設定
-│   │   └── styles/      # スタイル定義
+│   │   ├── settings/     # テーマ設定
+│   │   │   ├── color.ts  # カラー設定
+│   │   │   ├── spaces.ts # スペーシング設定
+│   │   │   └── breakpoints.ts # ブレークポイント設定
+│   │   ├── styles/       # スタイル定義
+│   │   │   └── globals.css # グローバルスタイル
+│   │   └── global.ts     # グローバルテーマ設定
 │   └── types/            # TypeScript 型定義
+├── .github/              # GitHub設定
+├── .yarn/                # Yarn設定
 ├── biome.json            # Biome 設定
 ├── next.config.ts        # Next.js 設定
+├── next-env.d.ts         # Next.js型定義
 ├── package.json          # パッケージ設定
-└── tsconfig.json         # TypeScript 設定
+├── tsconfig.json         # TypeScript 設定
+├── tsconfig.tsbuildinfo  # TypeScriptビルド情報
+├── .gitignore            # Git除外設定
+├── .gitattributes        # Git属性設定
+├── .yarnrc.yml           # Yarn設定
+└── yarn.lock             # Yarnロックファイル
 ```
 
 ## 🤝 コントリビューション
@@ -135,3 +215,5 @@ toban-lp/
 - [TypeScript ドキュメント](https://www.typescriptlang.org/docs/)
 - [Emotion ドキュメント](https://emotion.sh/docs/introduction)
 - [Biome ドキュメント](https://biomejs.dev/)
+- [Storybook ドキュメント](https://storybook.js.org/docs/react/get-started/introduction)
+- [React Icons ドキュメント](https://react-icons.github.io/react-icons/)

next.config.ts

@@ -13,9 +13,7 @@ const nextConfig: NextConfig = {
   },
 
   env: {
-    NEXT_PUBLIC_AIRTABLE_PAT: process.env.NEXT_PUBLIC_AIRTABLE_PAT,
-    NEXT_PUBLIC_AIRTABLE_BASE: process.env.NEXT_PUBLIC_AIRTABLE_BASE,
-    NEXT_PUBLIC_AIRTABLE_TABLE: process.env.NEXT_PUBLIC_AIRTABLE_TABLE,
+
   },
 };
 

package.json

@@ -8,19 +8,20 @@
     "build": "next build",
     "export": "next build && next export",
     "start": "serve out",
-    "lint": "yarn run biome lint ./src",
-    "lint:fix": "yarn run biome lint ./src --write",
-    "lint:fix:css": "stylelint --fix \"**/*.{js,jsx,ts,tsx}\"",
-    "format": "yarn run biome format ./src --write",
-    "check": "yarn run biome check ./src",
-    "clean": "yarn run biome check ./src --write",
+    "lint": "biome lint ./src",
+    "lint:fix": "biome lint ./src --write",
+    "format": "biome format ./src --write",
+    "check": "biome check ./src",
+    "check:fix": "biome check --write --unsafe ./src",
+    "type-check": "tsc --noEmit",
     "build-storybook": "storybook build"
   },
   "dependencies": {
     "@emotion/react": "^11.0.0",
     "next": "^15.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
+    "react-icons": "^5.5.0",
     "serve": "^14.0.0"
   },
   "devDependencies": {
@@ -31,6 +32,12 @@
     "lint-staged": "^15.0.0",
     "typescript": "^5.0.0"
   },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "biome check --write --unsafe ./src",
+      "biome format --write ./src"
+    ]
+  },
   "simple-git-hooks": {
     "pre-commit": "npx lint-staged"
   },