DockerでReduxやTailwind CSSが使えるReact環境を作るための考え方について

Docker、というかPCについてもいまいち理解できていない初心者です。いくつか疑問があるので相談したいです。

前提・実現したいこと

将来的にフロントがReact(create-react-app, Hooks, Redux Toolkit, Tailwind CSS, Typescript等)、バックエンドがRails APIのWebアプリを就活用ポートフォリオとして、Docker上で開発したいと思ってます。
お聞きしたいのは、ReduxやTailwind CSS（その他様々なライブラリ）を含めたDocker開発環境（コンテナ？）を作るにはどうすればいいか、ということです。

質問

・docker-compose.ymlにおいて、commandにnpm install tailwindcssみたいな感じで記述すればいいのでしょうか？それとも、dokcer-compose up -dしたコンテナの中に入り、そこで普通にnpm install tailwindcssすればいいのでしょうか？

備考

DockerでRuby on Rails + Reactを別々にアプリ作成する環境構築手順
上の記事では、ルートプロジェクトの下にapiフォルダ、frontフォルダ、docker-compose.ymlを作成し、

dockercomposeyml
1version: '3'
2
3services:
4  db:
5    image: postgres
6    volumes:
7      - postgres-data:/var/lib/postgresql/data
8  api:
9    build: 
10      context: ./api/
11      dockerfile: Dockerfile
12    command: /bin/sh -c "rm -f /myapp/tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
13    image: rails:dev
14    volumes:
15      - ./api:/myapp
16      - ./api/vendor/bundle:/myapp/vendor/bundle
17    environment:
18      TZ: Asia/Tokyo
19      RAILS_ENV: development
20    ports:
21      - 3000:3000
22    depends_on:
23      - db
24  front:
25    build: 
26      context: ./front/
27      dockerfile: Dockerfile
28    volumes:
29      - ./front:/usr/src/app
30    command: sh -c "cd react-sample && yarn start"
31    ports:
32      - "8000:3000"
33volumes:
34  postgres-data:
35    driver: local

frontフォルダに

Dockerfile
1FROM node:8.16.0-alpine  
2WORKDIR /usr/src/app

を作成したうえで、

project-folder $ docker-compose run --rm front sh -c "npm install -g create-react-app && create-react-app react-sample"

を実行してください、とあります。
この記事を再現して出来上がるfrontコンテナの中では、今のところ普通のReactしか使えず、Redux ToolkitやTailwind CSS、Material-UI、SASS等を使いたければそれらを一つずつコンテナにnpm installする必要がある（typescriptに関してはcreate-react-appするときに特定のコマンドを指定するわけなので必要ない（？））と思っていますがこの認識は正しいでしょうか。
また、その方法を調べているうちに次の記事に辿り着き、
Reactの開発環境をDockerで構築（その2）
docker-compose.ymlのcommandに次のように書くアイデアが浮かんだのですがこれも正しいでしょうか？

front:
    command: sh -c "cd react-sample && npm install tailwindcss && npm install redux ... && yarn start"

初歩的な質問で恐縮です。Dockerに詳しい方、助けてください。

hoshi-takanori

2021/03/03 09:11

逆に質問なのですが、React の開発に docker を使う利点って何なのでしょうか？

moyong

2021/03/03 09:28 編集

hoshi-takanoriさん、ありがとうございます。恥ずかしながらそれに関しては思考停止してました。「就活でDocker使えますと言いたいから」「そうするよう指南してくれてる記事があるから」というのが本音なのですが出先ではmacbook、家に帰ったらwindowsのデスクトップPCで開発できたらいいなと考えてるからだとあえて言わせてください。まだよく調べきれていないのに質問するのもどうかと思うのですがRailsのAPIだけコンテナを作ってReactは普通にローカルで開発する、というようにする場合普通にデータ通信できるものなのでしょうか？（APIにはjsonの提供だけ期待しています）

hentaiman

2021/03/03 14:28

技術と学習意欲のみで評価するんだとしたら、dockerの良さを理解していない酷い使い方をしていてdocker使えますって言っている事が判明した時点で首切り理由になるから試用期間付きの採用だったら損しかなさそうだし、面接段階で判断されれば不採用理由になってしまいそうだな

moyong

2021/03/03 18:18 編集

hentaimanさん、ありがとうございます。「なぜDockerなのか」を正しく説明できなければ、Dockerを使うことがかえってマイナスに影響することもあり得るということですね。私のことを言っているのだとしたら、学び始めてまだ間もないためご容赦ください。半日色々と読み漁りました。「複数人開発において環境差異を吸収してくれることだけが唯一の利点」だとか、「エンジニア就活中の初学者がDockerを学ぶのは単なる技術意欲アピールのため」だとか、そんな勘違いをしておりました。自戒として受け止めたいと思います。

hentaiman

2021/03/03 18:36

もちろんあなたの事として言ってますが、別にdockerをやる事自体をネガティブに受け取ってコメントした訳ではないですよ。ただ就活の武器としてdocker使えると言えるようになる事を目的にやっていると言っているから、その結果今の質問内容になっているなら良くない結果になっているなと。その状態なら普通のサーバー操作を習熟した方が良いです。それかawsですね。でもまあ「kubernetes使えます」って言えるところまでを目標とした最初の一歩としてのdockerならありかもしれません。