React uygulamasına Dockerfile eklenmesi 💫

Dockerfile oluşturarak React uygulamamızı Docker ile ayağa kaldırabiliriz. Bu yazımda daha önce webpack ile sıfırdan oluşturduğum React uygulamasını kullanacağım.

Docker ile ilgili yazıdığım yazılara aşağıdaki linkten ulaşabilirsin.

Docker Notlarım

Dockerfile Örnek:

FROM node:19-slim
WORKDIR /src
COPY . .
RUN npm install --force
RUN npm install -g live-server
RUN npm run build
EXPOSE 8080
CMD ["live-server","build/"]

FROM ile node’un 19-slim versiyonu base image olarak ayarlanır.
WORKDIR ile çalışılcak dizin söylenir.
src klasöründeki herşey COPY ile aktarılır.
RUN ile gerekli bağımlılıklar indirildikten sonra uygulamanın build’i alınır.
EXPOSE ile bu image’in container olduğunda kullanıcağı port söylenir
CMD ile projeyi çalıştırıcak komut söylenir.

Dockerfile dosyasını oluşturduktan sonra build komutu container oluşturulur.

docker build . -t react-app

Oluşan containerı run komutu ile çalıştıralım:

docker run -p 9000:8080 react-app

Dışarı 9000 portu ile açılır.

http://127.0.0.1:9000/ adresinden uygulamaya erişebiliyoruz.

Docker Compose Ekleme

docker-compose.yml örnek:

version: "3.4"
services:
  react-app:
    container_name: react-app
    build: .
    ports:
      - 9000:8080

versionlara göre farklı davranış gösterebiliyor.
services altında ayrı ayrı imageler için tanımlamaları yapılır.
react-app altında bulunan build ile bulunduğu dizindeki Dockerfile ile build al denir.
container_name ile container adı tanımlanır.
ports ile birden fazla port tanımı yapılabilir. Bu tanımlamada 9000 üzerinden çalışır ama docker host üzerinde 8080 portunu alır.

Docker-compose dosyasının çalıştırılması için (build alır ve çalıştırır):

docker-compose up

http://127.0.0.1:9000/ adresinden uygulamaya erişebiliyoruz.

Sadece build alması için:

docker-compose build

Container kapatmak ve silmek için:

docker-compose down

Okuduğun için teşekkürler 💐

Github Proje Link

Elif