【要望・提案】ディレクトリの整理など

[nzws]

要望・提案を思いついた経緯

• どのファイルがどこで使われているのかわかりにくいと感じた

要望・提案の内容

• このディレクトリは何が入ってるのか、何に必要かなどを記載したドキュメントを新たに作成する
• ディレクトリの整理を行う fixed in ディレクトリの整理 #244
  • css/ images/ は assets/ の下に配置すると良い気がします
  • images/ 内も、どのページがどの画像に依存しているのかわからないので、ページ名のディレクトリを新たに作るとわかりやすくなると思います
  • pages/ は現状診断のページしか入っていませんが、もしも診断のページしかおかないなら sindan みたいな名前に変更する / 他のサブ(?)ページを全て pages/ に集約する？
    • 書いた後に気がついたのですが今更htmlの場所変更しちゃうと既にSNS上に投稿されたものがリンク切れおこしちゃうのでこればっかりはどうしようもなさそうです

[s4na]

書いた後に気がついたのですが今更htmlの場所変更しちゃうと既にSNS上に投稿されたものがリンク切れおこしちゃうのでこればっかりはどうしようもなさそうです

もしやれることがあるとするなら、リダイレクト用のページを置いておいて、内部に「経緯＋編集しないでほしい旨」書いておく感じですかね

現状、 sindan/ のリンクがたくさん出回ってるとかはなさそうなので、早めに変えちゃうのも手かと思いますが

[s4na]

とりあえず、Draft作ってみますね

[archetypus]

• ディレクトリの整理を行う
  • css/ images/ は assets/ の下に配置すると良い気がします
  • images/ 内も、どのページがどの画像に依存しているのかわからないので、ページ名のディレクトリを新たに作るとわかりやすくなると思います

∔1です。デザインやUI、レイアウト周りを見直したいと思っていたためSCSS導入やUIコンポーネント化＆画像のminifyなどをwebpackとyarnで自動化しようと考え大幅なディレクトリ整理をやろうとしましたが、どれが現状生きていてどこで使われているのか判断できずpreactなど専門外の実装のほうに影響が出てしまい兼ねないのでとても悩んでいました。

上記が整備されてるとvue化やReact化なども現実的に視野に入れやすく良い運用になると思います。

[nzws]

SCSS導入やUIコンポーネント化
webpackとyarnで自動化

これらですが、 #12 で議論が行われた内容ですが、特定の環境に依存せずどのような開発者でもPRを作れると良いという方針(?)ができたため、当初Jekyll (scssなど)で管理していたものを巻き戻した過去があり、見送った方が良さそうです。
　
(ただいくつかのページが中途半端にreactやvueに依存しまくってんのはちょっとどうなんかなという気はするのですが)

[s4na]

#244

@nzws
一応こんな感じかな？という状態までできました。
確認できる範囲で構わないので、確認してもらってもいいですか？

[archetypus]

当初Jekyll (scssなど)で管理していたものを巻き戻した過去があり、見送った方が良さそうです。

そうだったんですね… 小規模サイトとはいえPureCSSの手書き運用は昨今きついんじゃないかな、と思うのですが（実際UXに影響しやすいグローバルナビゲーションなどの共通されるべきUIがメインページとシンクロ二ティのページで一致してなかったりが既に起きてますし）

ただいくつかのページが中途半端にreactやvueに依存

そうなんですよね
完全なPureCSSとHTMLのスタティックページのみ。と言う前提ならわかるのですが、webpackやpreactなども導入されてる時点で「どのような開発者でもPRを作れる」というレールからはすでに外れかかってる気もします

[sometrouble]

https://twitter.com/omesis_ray/status/1209057136992387072

元のツイートでは

おめシスのホームページをGithubのプルリクで更新していったらどうなるのか、こっそり検証中です。そのうち動画にします！

というようにあり, (プロダクトという意味での)Webサイトを作ろうと言う企画ではないので
ディレクトリ構造の整理はともかく運用やビルド環境の統一は多くの人が参加できるか否か, という点についてちょっと本題から外れてしまっている感じがします。

いつおめシスが動画にしてMRを締め切るかわからないので, それまでの間に可能な限りコンテンツを増やすことに注力したほうが良いですね。

[sometrouble]

.
├── index.html
├── pages                        # index.html以外のサブページ
│   ├── 404.html
│   ├── alpha.html
│   ├── synchronity.html
│   └── shindan                  # サブページから更に派生するなどの場合
│       ├── index.html
│       ├── shindan_ray.html
│       ├── shindan_rio.html
│       └── shindan_unchan.html
├── assets                       # srcからビルド, もしくは素のCSS, JSを書く人が弄る用
│   ├── css
│   ├── js
│   ├── sounds
│   └── images
│       └── shindan
└── src                          # ビルド前のファイル
    ├── scss
    └── ts

ざっくり分けるとしてこのような感じはいかがでしょう, 割と初期のインターネット感はありますが。

https://omegasisters.github.io/pages/shindan/ray.html
などのように, MECEを意識したディレクトリの命名がユーザ目線からも良いと思います

---

追記:
#244 で対応してくださったみたいですね, 地獄のような作業をありがとうございます。

[archetypus]

@sometrouble

いつおめシスが動画にしてMRを締め切るかわからないので, それまでの間に可能な限りコンテンツを増やすことに注力

たしかに！カオスに向かう様もおめシスらしいエンタメですもんね 🤣
そうすると自分がやろうとしていたことはいらぬ世話だったかもしれません
（githubにいるとOSS貢献思考がつい出てしまう…:sweat_drops:）