Skip to content

Commit d8f76c6

Browse files
committed
add ja translations
1 parent 077d9a0 commit d8f76c6

14 files changed

Lines changed: 1090 additions & 12 deletions

File tree

astro.config.mjs

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -112,22 +112,22 @@ export default defineConfig({
112112
ru: '🍰 О нас',
113113
},
114114
items: [{
115-
label: 'Mission',
116-
translations: {
117-
ru: 'Миссия',
118-
},
115+
// label: 'Mission',
116+
// translations: {
117+
// ru: 'Миссия',
118+
// },
119119
slug: 'docs/about/mission'
120120
}, {
121-
label: 'Motivation',
122-
translations: {
123-
ru: 'Мотивация',
124-
},
121+
// label: 'Motivation',
122+
// translations: {
123+
// ru: 'Мотивация',
124+
// },
125125
slug: 'docs/about/motivation'
126126
}, {
127-
label: 'Alternatives',
128-
translations: {
129-
ru: 'Альтернативы',
130-
},
127+
// label: 'Alternatives',
128+
// translations: {
129+
// ru: 'Альтернативы',
130+
// },
131131
slug: 'docs/about/alternatives'
132132
}, {
133133
label: 'Understanding',
Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
---
2+
title: 代替案
3+
sidebar:
4+
order: 3
5+
badge:
6+
text: WIP
7+
variant: caution
8+
---
9+
10+
import { FileTree } from '@astrojs/starlight/components';
11+
12+
## ビッグボールオブマッド
13+
14+
- [(記事) DDD - Big Ball of mud](https://thedomaindrivendesign.io/big-ball-of-mud/)
15+
16+
17+
## スマート&ダムコンポーネント
18+
19+
- [(記事) Dan Abramov - Presentational and Container Components (TLDR: 非推奨)](https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0)
20+
21+
22+
## デザイン原則
23+
24+
## DDD
25+
26+
## 参照 \{#see-also}
27+
28+
- [(記事) DDD, Hexagonal, Onion, Clean, CQRS, … How I put it all together](https://herbertograca.com/2017/11/16/explicit-architecture-01-ddd-hexagonal-onion-clean-cqrs-how-i-put-it-all-together/)
29+
30+
## クリーンアーキテクチャ
31+
32+
- [(記事) DDD, Hexagonal, Onion, Clean, CQRS, … How I put it all together](https://herbertograca.com/2017/11/16/explicit-architecture-01-ddd-hexagonal-onion-clean-cqrs-how-i-put-it-all-together/)
33+
34+
## フレームワーク
35+
36+
- [(記事) FSDの作成理由 (フレームワークに関する断片)](/docs/about/motivation)
37+
38+
39+
## Atomic Design
40+
41+
### これは何か?
42+
43+
アトミックデザインでは、責任の範囲が標準化された層に分かれています。
44+
45+
アトミックデザインは**5つの層**に分かれます(上から下へ)。
46+
47+
1. `pages` - FSDの`pages`層と同様の目的を持つ。
48+
2. `templates` - コンテンツに依存しないページの構造を定義するコンポーネント。
49+
3. `organisms` - ビジネスロジックを持つ分子から構成されるモジュール。
50+
4. `molecules` - 通常、ビジネスロジックを持たないより複雑なコンポーネント。
51+
5. `atoms` - ビジネスロジックを持たないUIコンポーネント。
52+
53+
同じ層のモジュールは、FSDのように下の層のモジュールとだけ相互作用しています。
54+
つまり、分子(molecule)は原子(atom)から構築され、生命体(organism)は分子から、テンプレート(template)は生命体から、ページ(page)はテンプレートから構築されます。
55+
また、アトミックデザインはモジュール内での**公開API**の使用を前提としています。
56+
57+
### フロントエンドでの適用性
58+
アトミックデザインはプロジェクトで比較的よく見られます。アトミックデザインは、開発者の間というより、ウェブデザイナーの間で人気です。ウェブデザイナーは、スケーラブルでメンテナンスしやすいデザインを作成するためにアトミックデザインをよく使用しています。
59+
開発では、アトミックデザインは他のアーキテクチャ設計方法論と混合されることがよくあります。
60+
61+
しかし、アトミックデザインはUIコンポーネントとその構成に焦点を当てているため、
62+
アーキテクチャ内でビジネスロジックを実装する問題が発生してしまいます。
63+
64+
問題は、アトミックデザインがビジネスロジックのための明確な責任レベルを提供していないため、
65+
ビジネスロジックがさまざまなコンポーネントやレベルに分散され、メンテナンスやテストが複雑になることです。
66+
ビジネスロジックは曖昧になり、責任の明確な分離が困難になり、コードがモジュール化されず再利用可能でなくなります。
67+
68+
### FSDとの統合
69+
FSDの文脈では、アトミックデザインのいくつかの要素を使用して柔軟でスケーラブルなUIコンポーネントを作成することができます。 `atoms``molecules`の層は、FSDの`shared/ui`に実装でき、基本的なUI要素の再利用とメンテナンスを簡素化しています。
70+
71+
<FileTree>
72+
- shared/
73+
- ui/
74+
- atoms/
75+
- molecules/
76+
</FileTree>
77+
78+
FSDとアトミックデザインの比較は、両方の設計方法論がモジュール性と再利用性を目指していることを示していますが、
79+
異なる側面に焦点を当てています。アトミックデザインは視覚的コンポーネントとその構成に焦点を当てています。
80+
FSDはアプリケーションの機能を独立したモジュールに分割し、それらの相互関係に焦点を当てています。
81+
82+
- [Atomic Design](https://atomicdesign.bradfrost.com/table-of-contents/)
83+
- [(動画) Atomic Design: What is it and why is it important?](https://youtu.be/Yi-A20x2dcA)
84+
85+
## Feature Driven
86+
87+
- [(講演) Feature Driven Architecture - Oleg Isonen](https://youtu.be/BWAeYuWFHhs)
88+
- [Feature Driven-Short specification (from the point of view of FSD)](https://github.com/feature-sliced/documentation/tree/rc/feature-driven)
Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
---
2+
title: ミッション
3+
sidebar:
4+
order: 1
5+
---
6+
7+
ここでは、私たちがFSD方法論を開発する際に従う方法論適用の制限と目標について説明します。
8+
9+
- 私たちは、目標をイデオロギーとシンプルさのバランスとして考えている
10+
- 私たちは、すべての人に適した銀の弾丸を作ることはできない
11+
12+
**それでも、FSD方法論が広範な開発者にとって近く、アクセス可能であることを望んでいます。**
13+
14+
## 目標 \{#goals}
15+
16+
### 幅広い開発者に対する直感的な明確さ \{#intuitive-clarity-for-a-wide-range-of-developers}
17+
18+
FSD方法論は、プロジェクトチームの大部分にとってアクセス可能であるべきです。
19+
20+
*なぜなら、将来のすべてのツールがあっても、FSD方法論を理解できるのは経験豊富なシニアやリーダーだけでは不十分だからである*
21+
22+
### 日常的な問題の解決 \{#solving-everyday-problems}
23+
24+
FSD方法論には、プロジェクト開発における日常的な問題の理由と解決策が示されるべきです。
25+
26+
また、開発者が*コミュニティーの経験に基づいた*アプローチを使用できるようにし、長年のアーキテクチャや開発の問題を回避できるようにするには、**FSD方法論はこれに関連するツール(CLI、リンター)を提供することも必要です。**
27+
28+
29+
> *@sergeysova: 想像してみてください。開発者が方法論に基づいてコードを書いているとき、開発者の直面している問題は10倍少なく発生しています。それは他の人々が多くの問題の解決策を考え出したから、可能になったのです。*
30+
31+
## 制限 \{#limitations}
32+
33+
私たちは*自分たちの見解を押し付けたくありません*が、同時に*多くの開発者の習慣が日々の開発の妨げになっていることを理解しています。*
34+
35+
すべての開発者にはシステム設計と開発経験レベルが異なるため、**次のことを理解することが重要です。**
36+
37+
- FSD方法論は、すべての開発者にとって、同時に非常にシンプルで、非常に明確にするのは不可能
38+
> *@sergeysova: 一部の概念は、問題に直面し、解決に数年を費やさない限り、直感的に理解することはできない。*
39+
>
40+
> - *数学の例 — グラフ理論。*
41+
> - *物理の例 — 量子力学。*
42+
> - *プログラミングの例 — アプリケーションのアーキテクチャ。*
43+
>
44+
- シンプルさ、拡張性は、実現可能であって望ましい
45+
46+
## 参照 \{#see-also}
47+
48+
- [アーキテクチャの問題][refs-architecture--problems]
49+
50+
[refs-architecture--problems]: /docs/about/understanding/architecture#problems
Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
---
2+
title: モチベーション
3+
sidebar:
4+
order: 1
5+
---
6+
7+
**Feature-Sliced Design**の主なアイデアは、さまざまな開発者の経験を議論し、研究結果を統合することに基づいて、複雑で発展するプロジェクトの開発を容易にし、開発コストを削減することです。
8+
9+
明らかに、これは銀の弾丸ではなく、当然ながら、FSDには独自の[適用範囲の限界][refs-mission]があります。
10+
11+
## 既存の解決策が不足している理由 \{#intuitive-clarity-for-a-wide-range-of-developers}
12+
> 通常、次のような議論があります。
13+
>
14+
> - *「SOLID」、「KISS」、「YAGNI」、「DDD」、「GRASP」、「DRY」など、すでに確立された設計原則があるのに、なぜ新しい方法論が必要なのか?」*
15+
> - *「プロジェクトのすべての問題は、良いドキュメント、テスト、確立されたプロセスで解決できる」*
16+
> - *「すべての問題は、すべての開発者が上記のすべてに従えば解決される」*
17+
> - *「すでにすべてが考案されているから、あなたはそれを利用できないだけだ」*
18+
> - *\{FRAMEWORK_NAME\}を使えば、すべてが解決される」*
19+
20+
### 原則だけでは不十分 \{#principles-alone-are-not-enough}
21+
22+
**良いアーキテクチャを設計するためには、原則の存在だけでは不十分です。**
23+
24+
すべての人が原則を完全に理解しているわけではありません。正しく原則を理解し、適用できる人はさらに少ないです。
25+
26+
*設計原則はあまりにも一般的であり、「スケーラブルで柔軟なアプリケーションの構造とアーキテクチャをどのように設計するか?」という具体的な質問に対する答えを提供していません。*
27+
28+
### プロセスは常に機能するわけではない \{#processes-dont-always-work}
29+
30+
*ドキュメント/テスト/プロセス*を使用するのは、確かに良いことですが、残念ながら、それに多くのコストをかけても、**アーキテクチャの問題や新しい人をプロジェクトに導入する問題を解決することは常にできるわけではありません。**
31+
32+
- ドキュメントは、しばしば膨大で古くなってしまうので、各開発者のプロジェクトへの参加時間はあまり短縮されない。
33+
- 誰もが同じようにアーキテクチャを理解しているかを常に監視することは、膨大なリソースを必要とする。
34+
- bus-factorも忘れないようにしましょう。
35+
36+
### 既存のフレームワークはどこでも適用できるわけではない \{#existing-frameworks-cannot-be-applied-everywhere}
37+
38+
- 既存の解決策は通常、高い参入障壁があるため、新しい開発者を見つけるのが難しい。
39+
- ほとんどの場合、技術の選択はプロジェクトの深刻な問題が発生する前に決定されているため、**技術に依存せずに**、すでにあるもので作業をすることができなければならない。
40+
41+
> Q: *「私のプロジェクトでは`React/Vue/Redux/Effector/Mobx/{YOUR_TECH}`を使っていますが、エンティティの構造とそれらの間の関係をどのように構築すればよいでしょうか?」*
42+
43+
### 結果として \{#as-a-result}
44+
45+
「雪の結晶」のようにユニークなプロジェクトが得られ、それぞれが従業員の長期的な関与を必要とし、他のプロジェクトではほとんど適用できない知識を必要とします。
46+
47+
> @sergeysova: *これは、現在のフロントエンド開発の状況そのものであり、各リーダーがさまざまなアーキテクチャやプロジェクトの構造を考案しているが、これらの構造が時間の試練に耐えるかどうかは不明であり、最終的にはリーダー以外の人がプロジェクトを発展させることができるのは最大で2人であり、新しい開発者を再び入れる必要がある。*
48+
49+
## 開発者にとっての方法論の必要性 \{#why-do-developers-need-the-methodology}
50+
51+
### アーキテクチャの問題ではなくビジネス機能に集中するため \{#focus-on-business-features-not-on-architecture-problems}
52+
53+
FSDは、スケーラブルで柔軟なアーキテクチャの設計にかかるリソースを節約し、開発者の注意を主要な機能開発に向けることを可能にしています。同時に、プロジェクトごとにアーキテクチャの解決策も標準化されます。
54+
55+
*別の問題は、FSDがコミュニティの信頼を得る必要があることです。そうすれば、開発者は自分のプロジェクトの問題を解決する際に、与えられた時間内にFSDを理解し、信頼することができます。*
56+
57+
### 経験に基づく解決策 \{#an-experience-proven-solution}
58+
59+
FSDは、*複雑なビジネスロジックの設計における経験に基づく解決策を目指す開発者*を対象としています。
60+
61+
*ただし、FSDは、全体としてベストプラクティスのセット、または特定の問題やケースに関する記事一覧です。したがって、開発や設計の問題に直面する他の開発者にも役立てます。*
62+
63+
### プロジェクトの健康 \{#project-health}
64+
65+
FSDは、*プロジェクトの問題を事前に解決し、追跡することを可能にし、膨大なリソースを必要としません。*
66+
67+
**技術的負債は通常、時間とともに蓄積され、その解決の責任はリーダーとチームの両方にあります。**
68+
69+
FSDは、*スケーリングやプロジェクトの発展における潜在的な問題を事前に警告することを可能にしています。*
70+
71+
## ビジネスにとってのFSD方法論の必要性 \{#why-does-a-business-need-a-methodology}
72+
73+
### 迅速なオンボーディング \{#fast-onboarding}
74+
75+
FSDを使用すると、**すでにこのアプローチに慣れている人をプロジェクトに雇うことができ、再教育する必要がありません。**
76+
77+
*人々はより早くプロジェクトに慣れ、貢献し始め、次のプロジェクトのイテレーションで人を見つけるための追加の保証が得られます。*
78+
79+
### 経験に基づく解決策 \{#an-experience-proven-solution-1}
80+
81+
ビジネスは、プロジェクトの発展における大部分の問題を解決するフレームワーク/解決策を得たいと考えています。FSDにより、ビジネスは*システムの開発中に発生するほとんどの問題に対する解決策を得ることができます。*
82+
83+
### プロジェクトのさまざまな段階への適用性 \{#applicability-for-different-stages-of-the-project}
84+
85+
FSDは、*プロジェクトのサポートと発展の段階でも、MVPの段階でもプロジェクトに利益をもたらすことができます。*
86+
87+
はい、MVPでは通常、<i>機能が重要であり、将来のアーキテクチャは重要ではありません</i>。しかし、限られた時間の中で、方法論のベストプラクティスを知っていることで、<i>少ないコストで済む</i>ことができ、MVPバージョンのシステムを設計する際に合理的な妥協を見つけることができます(無計画に機能を追加するよりも)。
88+
89+
*テストについても同じことが言えます。*
90+
91+
## 私たちの方法論が必要ない場合 \{#when-is-our-methodology-not-needed}
92+
93+
- プロジェクトが短期間しか存続しない場合
94+
- プロジェクトがサポートされるアーキテクチャを必要としない場合
95+
- ビジネスがコードベースと機能の提供速度の関連性を認識しない場合
96+
- ビジネスができるだけ早く注文を完了することを重視し、さらなるサポートを求めない場合
97+
98+
### ビジネスの規模 \{#business-size}
99+
100+
- **小規模ビジネス** - 通常、迅速で即効性のある解決策を必要とします。ビジネスは、成長する(少なくとも中規模に達する)と、顧客が継続的にサービスなどを利用するためには、開発される解決策の品質と安定性に時間をかける必要があることを理解し始めます。
101+
- **中規模ビジネス** - 通常、開発のすべての問題を理解しており、たとえ機能をできるだけ早くリリースしたい場合でも、品質の改善、リファクタリング、テスト(そしてもちろん、拡張可能なアーキテクチャ)に時間をかけます。
102+
- **大規模ビジネス** - 通常、すでに広範なオーディエンスを持ち、従業員の数も多く、独自のプラクティスのセットを持っているため、他のアプローチを採用するアイデアはあまり浮かびません。
103+
104+
## 目標 \{#plans}
105+
106+
主要な目標の大部分は[ここに記載されています][refs-mission--goals]が、今後のFSD方法論に対する私たちの期待についても話しておく必要があります。
107+
108+
### 経験の統合 \{#combining-experience}
109+
110+
現在、私たちは`core-team`のさまざまな経験を統合し、実践に基づいた方法論を得ることを目指しています。
111+
112+
もちろん、最終的にはAngular 3.0のようなものを得るかもしれませんが、ここで最も重要なのは、**複雑なシステムのアーキテクチャ設計の問題を探求することです。**
113+
114+
*そして、現在のFSD方法論のバージョンに対して不満があることは確かですが、私たちはコミュニティの経験も考慮しながら、共通の努力で統一的かつ最適な解決策に到達したいと考えています。*
115+
116+
### 仕様外の生活 \{#life-outside-the-specification}
117+
118+
すべてがうまくいけば、FSDは仕様やツールキットに限定されることはありません。
119+
120+
- 講演や記事があるかもしれない。
121+
- FSD方法論に従って書かれたプロジェクトの他の技術への移行のための`CODE_MODEs`があるかもしれない。
122+
- 最終的には、大規模な技術的解決策のメンテイナーに到達できるかもしれない。
123+
- *特にReactに関しては、他のフレームワークと比較して、これは主な問題である。なぜなら、特定の問題を解決する方法を示さないからである。*
124+
125+
## 参照 \{#see-also}
126+
127+
- [方法論の使命について:目標と制限][refs-mission]
128+
- [プロジェクトにおける知識の種類][refs-knowledge]
129+
130+
[refs-mission]: /docs/about/mission
131+
[refs-mission--goals]: /docs/about/mission#goals
132+
[refs-knowledge]: /docs/about/understanding/knowledge-types
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
title: 統合の側面
3+
sidebar:
4+
order: 1
5+
---
6+
7+
# 統合の側面
8+
9+
**利点**:
10+
- [概要](/docs/get-started/overview#advantages)
11+
- コードレビュー
12+
- オンボーディング
13+
14+
**欠点**:
15+
- メンタル的な複雑さ
16+
- 高い参入障壁
17+
- 「レイヤー地獄」
18+
- 機能ベースのアプローチにおける典型的な問題

0 commit comments

Comments
 (0)