Skip to content

Commit 642e31c

Browse files
unchunksunchunks
committed
Refactor: Split data into individual files in src/content
1 parent f27370c commit 642e31c

File tree

6 files changed

+290
-299
lines changed

6 files changed

+290
-299
lines changed

‎README.md‎

Lines changed: 23 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -34,27 +34,35 @@ npm run build
3434

3535
## カスタマイズ
3636

37-
`src/data.js` を編集するだけで、サイトのコンテンツを簡単に更新できます。
38-
- **Profile**: 名前、役職、自己紹介、SNSリンク
39-
- **Projects**: プロジェクトの追加・削除
40-
- **Posts**: 新しいブログ記事の追加
37+
サイトのコンテンツは `src/content` ディレクトリ内のファイルを編集することで更新できます。
4138

42-
### 新しい記事の追加方法
39+
- **Profile**: `src/data.jsx` の `profile` セクション
40+
- **Projects**: `src/content/projects/` ディレクトリ内の各ファイル
41+
- **Posts**: `src/content/posts/` ディレクトリ
42+
43+
### 新しいプロジェクトの追加方法
4344

44-
1. `src/data.js` を開きます。
45-
2. `posts` 配列を見つけます。
46-
3. 以下のような形式で、新しい記事データを追加してください（IDは他と被らないユニークな数字にしてください）。
45+
1. `src/content/projects/` に新しいファイル（例: `mygame.jsx`）を作成します。
46+
2. 既存のファイルを参考に、プロジェクトデータを記述・エクスポートします。
47+
3. `src/data.jsx` を開き、作成したファイルをインポートして `projects` リストに追加します。
4748

4849
```javascript
49-
{
50-
id: 104, // 新しいID
51-
title: "新しい記事のタイトル",
52-
date: "2023-12-01",
53-
category: "DevLog",
54-
content: "ここに記事の本文を書きます..."
55-
}
50+
import { mygame } from './content/projects/mygame';
51+
52+
// ...
53+
54+
projects: [
55+
// ...
56+
mygame,
57+
],
5658
```
5759

60+
### 新しい記事の追加方法
61+
62+
1. `src/content/posts/` に新しいファイルを作成します。
63+
2. `src/content/posts/index.js` でそのファイルをインポートし、`posts` 配列に追加します。
64+
65+
5866
保存すると、サイトに自動的に反映されます。
5967

6068
## デプロイ（公開）

‎src/content/posts/index.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
// 新しい記事を追加する場合は、新しいファイルを作成してここでインポートしてください
2+
// import { myNewPost } from './myNewPost';
3+
4+
export const posts = [
5+
// myNewPost,
6+
// {
7+
// id: 101,
8+
// title: "カスタム物理エンジンの苦難と解決策",
9+
// date: "2023-10-24",
10+
// category: "Engineering",
11+
// content: "UnityのPhysXを使わずに独自の物理挙動を実装しようとした際の壁抜け問題について。レイキャストの長さを動的に調整することで解決しました..."
12+
// },
13+
];

‎src/content/projects/eneme.jsx‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import React from 'react';
2+
3+
export const eneme = {
4+
id: "eneme",
5+
title: "えねMe",
6+
description: "プレイヤーの創造性と戦略的思考を融合させた新しいジャンルのゲーム。",
7+
tags: ["New Project", "Strategy"],
8+
imageColor: "from-orange-500 to-red-500",
9+
link: "/projects/eneme",
10+
details: (
11+
<div className="space-y-6">
12+
<p className="text-slate-300">
13+
このページは、「えねMe」についての情報を発信するものです。
14+
</p>
15+
16+
<div>
17+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">プロジェクトの概要</h2>
18+
<p className="text-slate-300 mb-4">
19+
新プロジェクトは、プレイヤーの創造性と戦略的思考を融合させた新しいジャンルのゲームを目指しています。現時点で以下の特徴を予定しています：
20+
</p>
21+
<ul className="list-disc list-inside text-slate-300 space-y-2 ml-4">
22+
<li>プレイヤーがモンスターとして冒険者からダンジョンを守るユニークなゲームプレイ</li>
23+
<li>プレイヤーの戦略によって成長するモンスターと冒険者</li>
24+
</ul>
25+
</div>
26+
27+
<div>
28+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">開発スケジュール</h2>
29+
<p className="text-slate-300">
30+
現在、プロジェクトは企画段階にあり、今後1年間で基本的なゲームシステムの開発を進める予定です。ベータテストは2025年夏頃を予定しており、正式リリースは2026年を目指しています。
31+
</p>
32+
</div>
33+
34+
<div>
35+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">まだ見ぬファンの皆様へ</h2>
36+
<p className="text-slate-300">
37+
このプロジェクトは私が初めて発表するものです。当然ファンなどいるはずもないのですが、今後の私の活動を見て、楽しみにしていただければと思います。
38+
</p>
39+
</div>
40+
</div>
41+
)
42+
};

‎src/content/projects/rogue.jsx‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import React from 'react';
2+
3+
export const rogue = {
4+
id: "rogue",
5+
title: "Rogue",
6+
description: "ローグライクゲームプロジェクト。",
7+
tags: ["Roguelike", "Game Dev"],
8+
imageColor: "from-gray-700 to-slate-600",
9+
link: "/projects/rogue",
10+
details: (
11+
<div className="space-y-6">
12+
<p className="text-slate-300">
13+
このページは、「Rogue」についての情報を発信するものです。
14+
</p>
15+
<div className="mt-4">
16+
<a href="https://github.com/unchunks/Rogue" target="_blank" rel="noopener noreferrer" className="inline-block bg-emerald-600 hover:bg-emerald-500 text-white font-bold py-2 px-4 rounded transition-colors">
17+
ソースコード (GitHub)
18+
</a>
19+
</div>
20+
</div>
21+
)
22+
};

‎src/content/projects/vialactea.jsx‎

Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
import React from 'react';
2+
3+
export const vialactea = {
4+
id: "vialactea",
5+
title: "Via Lactea",
6+
description: "ドット絵調のイラストを用いたレトロな2Dシューティングゲーム。",
7+
tags: ["Shooting", "Pixel Art", "2D"],
8+
imageColor: "from-blue-600 to-indigo-600",
9+
link: "/projects/vialactea",
10+
details: (
11+
<div className="space-y-8">
12+
<p className="text-slate-300 text-lg">
13+
ドット絵調のイラストを用いたレトロな2Dシューティングゲーム。ハイスコアを目指せ！
14+
</p>
15+
16+
<div>
17+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">ゲーム仕様</h2>
18+
<h3 className="text-xl font-semibold text-emerald-400 mb-3">基本操作</h3>
19+
<div className="overflow-x-auto">
20+
<table className="w-full text-left border-collapse">
21+
<thead>
22+
<tr className="bg-slate-800 text-slate-200">
23+
<th className="p-3 border border-slate-700">操作</th>
24+
<th className="p-3 border border-slate-700">キー</th>
25+
</tr>
26+
</thead>
27+
<tbody className="text-slate-300">
28+
<tr><td className="p-3 border border-slate-700">左</td><td className="p-3 border border-slate-700">A または ←</td></tr>
29+
<tr><td className="p-3 border border-slate-700">右</td><td className="p-3 border border-slate-700">D または →</td></tr>
30+
<tr><td className="p-3 border border-slate-700">上</td><td className="p-3 border border-slate-700">W または ↑</td></tr>
31+
<tr><td className="p-3 border border-slate-700">下</td><td className="p-3 border border-slate-700">S または ↓</td></tr>
32+
<tr><td className="p-3 border border-slate-700">発射</td><td className="p-3 border border-slate-700">スペースキー</td></tr>
33+
</tbody>
34+
</table>
35+
</div>
36+
</div>
37+
38+
<div>
39+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">目的</h2>
40+
<ul className="list-disc list-inside text-slate-300 space-y-2 ml-4">
41+
<li>敵を倒してハイスコアを目指す</li>
42+
<li>ボスを倒す</li>
43+
</ul>
44+
</div>
45+
46+
<div>
47+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">駆け引きの要素</h2>
48+
<ul className="list-disc list-inside text-slate-300 space-y-2 ml-4">
49+
<li>敵の種類によって倒したときのスコアが異なる</li>
50+
<li>スコアが低い敵ほど出現頻度が高い</li>
51+
<li>ボスを倒すとゲームクリアだが、それ以上スコアが伸ばせない</li>
52+
</ul>
53+
</div>
54+
55+
<div>
56+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">キャラクターの仕様</h2>
57+
<div className="overflow-x-auto">
58+
<table className="w-full text-left border-collapse text-sm">
59+
<thead>
60+
<tr className="bg-slate-800 text-slate-200">
61+
<th className="p-2 border border-slate-700">名称</th>
62+
<th className="p-2 border border-slate-700">見た目</th>
63+
<th className="p-2 border border-slate-700">スコア</th>
64+
<th className="p-2 border border-slate-700">体力</th>
65+
<th className="p-2 border border-slate-700">サイズ</th>
66+
<th className="p-2 border border-slate-700">スピード</th>
67+
<th className="p-2 border border-slate-700">弾速</th>
68+
<th className="p-2 border border-slate-700">出現頻度</th>
69+
</tr>
70+
</thead>
71+
<tbody className="text-slate-300">
72+
<tr>
73+
<td className="p-2 border border-slate-700">PLAYER</td>
74+
<td className="p-2 border border-slate-700"><img src="/projects/ViaLactea/image/player.png" width="50" alt="Player" /></td>
75+
<td className="p-2 border border-slate-700">-</td>
76+
<td className="p-2 border border-slate-700">3</td>
77+
<td className="p-2 border border-slate-700">30</td>
78+
<td className="p-2 border border-slate-700">10</td>
79+
<td className="p-2 border border-slate-700">15</td>
80+
<td className="p-2 border border-slate-700">-</td>
81+
</tr>
82+
<tr>
83+
<td className="p-2 border border-slate-700">STOP</td>
84+
<td className="p-2 border border-slate-700"><img src="/projects/ViaLactea/image/stop.png" width="50" alt="Stop" /></td>
85+
<td className="p-2 border border-slate-700">40</td>
86+
<td className="p-2 border border-slate-700">5</td>
87+
<td className="p-2 border border-slate-700">40</td>
88+
<td className="p-2 border border-slate-700">0</td>
89+
<td className="p-2 border border-slate-700">8</td>
90+
<td className="p-2 border border-slate-700">34.25</td>
91+
</tr>
92+
<tr>
93+
<td className="p-2 border border-slate-700">STRAIGHT</td>
94+
<td className="p-2 border border-slate-700"><img src="/projects/ViaLactea/image/straight.png" width="50" alt="Straight" /></td>
95+
<td className="p-2 border border-slate-700">50</td>
96+
<td className="p-2 border border-slate-700">5</td>
97+
<td className="p-2 border border-slate-700">40</td>
98+
<td className="p-2 border border-slate-700">5</td>
99+
<td className="p-2 border border-slate-700">15</td>
100+
<td className="p-2 border border-slate-700">27.4</td>
101+
</tr>
102+
<tr>
103+
<td className="p-2 border border-slate-700">ZIGZAG</td>
104+
<td className="p-2 border border-slate-700"><img src="/projects/ViaLactea/image/zigzag.png" width="50" alt="Zigzag" /></td>
105+
<td className="p-2 border border-slate-700">80</td>
106+
<td className="p-2 border border-slate-700">8</td>
107+
<td className="p-2 border border-slate-700">40</td>
108+
<td className="p-2 border border-slate-700">5</td>
109+
<td className="p-2 border border-slate-700">15</td>
110+
<td className="p-2 border border-slate-700">17.125</td>
111+
</tr>
112+
<tr>
113+
<td className="p-2 border border-slate-700">FAST</td>
114+
<td className="p-2 border border-slate-700"><img src="/projects/ViaLactea/image/fast.png" width="50" alt="Fast" /></td>
115+
<td className="p-2 border border-slate-700">200</td>
116+
<td className="p-2 border border-slate-700">3</td>
117+
<td className="p-2 border border-slate-700">30</td>
118+
<td className="p-2 border border-slate-700">10</td>
119+
<td className="p-2 border border-slate-700">30</td>
120+
<td className="p-2 border border-slate-700">6.85</td>
121+
</tr>
122+
<tr>
123+
<td className="p-2 border border-slate-700">BOSS</td>
124+
<td className="p-2 border border-slate-700"><img src="/projects/ViaLactea/image/boss.png" width="50" alt="Boss" /></td>
125+
<td className="p-2 border border-slate-700">1000</td>
126+
<td className="p-2 border border-slate-700">30</td>
127+
<td className="p-2 border border-slate-700">80</td>
128+
<td className="p-2 border border-slate-700">3</td>
129+
<td className="p-2 border border-slate-700">15</td>
130+
<td className="p-2 border border-slate-700">0.274</td>
131+
</tr>
132+
</tbody>
133+
</table>
134+
</div>
135+
</div>
136+
137+
<div>
138+
<h2 className="text-2xl font-bold text-white mb-4 border-b border-slate-700 pb-2">アイテム</h2>
139+
<div className="overflow-x-auto">
140+
<table className="w-full text-left border-collapse">
141+
<thead>
142+
<tr className="bg-slate-800 text-slate-200">
143+
<th className="p-3 border border-slate-700">名称</th>
144+
<th className="p-3 border border-slate-700">見た目</th>
145+
<th className="p-3 border border-slate-700">効果</th>
146+
</tr>
147+
</thead>
148+
<tbody className="text-slate-300">
149+
<tr>
150+
<td className="p-3 border border-slate-700">BULLET</td>
151+
<td className="p-3 border border-slate-700"><img src="/projects/ViaLactea/image/bullet.png" alt="Bullet" /></td>
152+
<td className="p-3 border border-slate-700">5秒間プレイヤーの発射する弾が3方向に増える</td>
153+
</tr>
154+
<tr>
155+
<td className="p-3 border border-slate-700">HEAL</td>
156+
<td className="p-3 border border-slate-700"><img src="/projects/ViaLactea/image/heal.png" alt="Heal" /></td>
157+
<td className="p-3 border border-slate-700">体力を1回復する</td>
158+
</tr>
159+
<tr>
160+
<td className="p-3 border border-slate-700">SPEED</td>
161+
<td className="p-3 border border-slate-700"><img src="/projects/ViaLactea/image/speed.png" alt="Speed" /></td>
162+
<td className="p-3 border border-slate-700">スピードが永続的に5上昇する</td>
163+
</tr>
164+
</tbody>
165+
</table>
166+
</div>
167+
</div>
168+
169+
<div className="mt-8">
170+
<a href="https://github.com/unchunks/VIA-LACTEA" target="_blank" rel="noopener noreferrer" className="inline-block bg-emerald-600 hover:bg-emerald-500 text-white font-bold py-2 px-4 rounded transition-colors">
171+
ソースコード (GitHub)
172+
</a>
173+
</div>
174+
</div>
175+
)
176+
};

0 commit comments

Comments
 (0)