B3S
menu close

雑記

モダンな Javascript ~ Trello にあこがれて ~


John

更新日:2024/06/27


こんにちは。

 

Reactについては

過去にサーバー/ミドルウェアの構築に加えて

バックエンドを Laravel(PHPフレームワーク) にて整備したりした経験がある john です。

 

 

そういった経緯がありながらも

コンパイル等の手間の兼ね合いにより

今回はフロントエンドの開発に重点を置いて着手してみました。

 

 

 

 

結論としては、こんな画面になります。

 

 

 

ディレクトリ構成については、こんな感じ。

 

 

では、アプリケーションの構成について。

メインで利用するライブラリ”react-beautiful-dnd” のリファレンス等を参考に複数のコンポーネントにて構成しました。

 

インフラ環境(コンテナ)については、シンプルにnode.jsが動く環境のみを準備

 

アプリについては以下つらつらと

 

 

 

 

 

 

利用技術の通りにはなりますが

コンパイルの手間等の兼ね合いにより

Dockerにてコンテナ内にミドルウェア(node.js)等を構築、内部にてパッケージマネージャ(yarn)を利用したビルトインサーバー(開発サーバー)を起動する仕様としています。

 

この開発環境にて開発したReactソースを、そのままReact*Laravelに移管作戦って感じですね。

ただ上手に使いこなせれば、React*Laravel構成でもホットリロード的環境での開発が出来る気がしないでもないですが。。笑

 

 

今回はここまでです。

 

 

今後ともどうぞよしなに。