(自分用)UdemyのReactを動かす環境をdockerで作る(備忘録)
はじめに
自分用備忘録です。
仕事で急にdockerとdjangoとreactを使うことになったので勉強していきます。
djangoは先にdjango girlsと公式チュートリアルをやったのでReactの動画を見ていきます。
dockerは触りながら覚えていきます。
Dockerの準備
dockerImageはここを参考に作成
https://qiita.com/kerochelo/items/1063da8893026de5ebbf
FROM node:12 ←新しいのにしておく
WORKDIR /usr/src/app
ちなみにDockerfileにyarn入ってなくね?と思って
RUN npm install --global yarnってするとERRORになります。
nodeのImageは既にyarnが入っているかららしいです。
version: '3'
services:
web:
build:
context: .
dockerfile: Dockerfile
volumes:
- ./:/usr/src/app
ports:
- "3000:3000"
tty: true ←これ追加
tty: true入れないとコンテナ立ち上げた時にexitになってしまう。。。
よくわからないがとりあえず入れておきます。
あとでちゃんと調べます。
Docker起動
Dockerfileとdocker-compose.yml置いている場所に行ってビルド&起動
cd ~/docker-react-app
// Dockerのビルドと起動
docker-compose up -d --build
Reactのモジュール作成
cretate-react-appのコマンド
~/docker-react-app/udemy-react-redux-crud-application ←作業ディレクトリ
$docker-compose run --rm web sh -c "yarn global add create-react-app && create-react-app ./udemy-react-redux-crud-application"
imageの中に入って作ってもいいです
~/docker-react-app ←Dockerfile置いてるディレクトリ
$docker exec -it docker-react-app_web_1 bash
root@b:/usr/src/app#yarn global add create-react-app
root@b:/usr/src/app#create-react-app ./udemy-react-redux-crud-application"
create-react-appを立ち上げてみる
docker-compose run --rm web sh -c "cd udemy-react-redux-crud-application && yarn run start"
docker-compose.ymlにcommand入れておけばコンテナ起動した時に立ち上げてくれます。
version: '3'
services:
web:
...
command: sh -c "cd udemy-react-redux-crud-application && yarn start"
予定
とりあず、Udemyの動画をベースに勉強しつつ、チュートリアルを眺めていく。
最終的にはDockerでNingx + Django + React + Postgresのコンテナ作って適当なwebアプリ作ってみたい。
覚えなきゃいけないことがいっぱいで大変だけど頑張ろう。
仕事が急に別の業務に変わらない限りは。。。
Author And Source
この問題について((自分用)UdemyのReactを動かす環境をdockerで作る(備忘録)), 我々は、より多くの情報をここで見つけました https://qiita.com/mototoke/items/50ff27e884f2d94d9655著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .