リアクトについて

リアクトとは、UIを作ることに特化したJavaScriptライブラリ。JavaScript はコード書いていくとだんだんぐちゃぐちゃになって管理がしづらいそうなので、管理がしやすいのだとか。

tutumi のばあい

website > src の中に入っているデータがリアクトの内容。 App.jsx や main.jsx は根幹にかかわるデータらしいがあんまり触らないのだとか。
src > pages のフォルダに入っているデータがリアクトを使って作ったページの内容。
src > components のフォルダに入っているデータがリアクトを使って作ったページで使うパーツのデータ。
画像はcomponents のフォルダの中から PageHeader.jsx をひらいた画像。 こんな感じでパーツのコードがかかれている。

上記のページ・コンポーネントの中に入っている jsx データはGeminiを通して修正することは可能だが、Geminiがおかしい時やGeminiにかける時間を短縮したい時は、直接コードを書き替えて変更することも可能である。

<余談>

リアクトは独自のタグを作れるが、独自のタグはHTMLにした時に使用できない。最後にGeminiにビルドしてと頼む時、「ビルドする時にHTMLで出力して。」とお願いするのはそういうこと。

<赤松さんが①からリアクトを使ってサイトを作る時>

・先方からきいたこんな風なサイトを作りたいというURLをきいて、そのサイトのデザインをスクショして、細かく言語化する。(どういう雰囲気がいいか?色は?構成は?など)

・その内容にあてはめて、まずはトップページを作成する。(気に入るものができるまでひたすら出力する)