JavaScript Geliştirme Ortamı: Docker Container Yapılandırması

Günümüzün hızlı tempolu yazılım geliştirme ortamında, tutarlı ve yeniden üretilebilir bir geliştirme ortamı sağlamak çok önemlidir. Farklı işletim sistemleri, değişen yazılım sürümleri ve çakışan bağımlılıklar, korkulan "bende çalışıyor" sendromuna yol açabilir. Lider bir konteynerleştirme platformu olan Docker, geliştiricilerin uygulamalarını ve bağımlılıklarını tek, izole bir birimde paketlemelerine olanak tanıyarak bu soruna güçlü bir çözüm sunar.

Bu kılavuz, Docker container'ları kullanarak sağlam ve tutarlı bir JavaScript geliştirme ortamı kurma sürecinde size yol gösterecektir. Temel kurulumdan gelişmiş yapılandırmalara kadar her şeyi ele alacak ve ekibinizin farklı işletim sistemlerinden bağımsız olarak JavaScript projeleriniz için sorunsuz ve verimli bir iş akışı sağlayacağız.

JavaScript Geliştirme için Neden Docker Kullanmalısınız?

Detaylara dalmadan önce, JavaScript geliştirme ortamınız için Docker kullanmanın faydalarını inceleyelim:

• Tutarlılık: Docker, ekibinizdeki herkesin aynı ortamda çalıştığından emin olarak, uyumluluk sorunlarını ortadan kaldırır ve ortam farklılıklarından kaynaklanan hataların olasılığını azaltır. Bu, özellikle coğrafi olarak dağılmış ekipler için önemlidir.
• İzolasyon: Container'lar, ana sistemden izolasyon sağlayarak diğer projelerle çakışmaları önler ve bağımlılıklarınızın birbirini etkilememesini sağlar.
• Yeniden Üretilebilirlik: Docker imajları kolayca paylaşılabilir ve dağıtılabilir, bu da geliştirme ortamınızı farklı makinelerde veya üretimde yeniden üretmeyi kolaylaştırır. Bu, özellikle yeni ekip üyelerini işe alırken veya farklı bulut sağlayıcılarına dağıtım yaparken faydalıdır.
• Taşınabilirlik: Docker container'ları, Windows, macOS ve Linux dahil olmak üzere Docker'ı destekleyen herhangi bir platformda çalışabilir ve geliştiricilerin projeyi etkilemeden tercih ettikleri işletim sistemini kullanmalarına olanak tanır.
• Basitleştirilmiş Dağıtım: Geliştirme için kullanılan aynı Docker imajı, test ve üretim için de kullanılabilir, bu da dağıtım sürecini kolaylaştırır ve hata riskini azaltır.

Ön Koşullar

Başlamadan önce, aşağıdakilerin kurulu olduğundan emin olun:

• Docker: Resmi Docker web sitesinden (docker.com) işletim sisteminiz için Docker Desktop'ı indirin ve kurun. Docker Desktop, Docker Engine, Docker CLI, Docker Compose ve diğer temel araçları içerir.
• Node.js ve npm (isteğe bağlı): Container içinde olacakları için ana makinenizde kesinlikle gerekli olmasa da, Node.js ve npm'nin yerel olarak kurulu olması container dışındaki görevler için veya ilk proje yapınızı kurarken faydalı olabilir. Bunları nodejs.org adresinden indirebilirsiniz.
• Bir Kod Düzenleyici: Tercih ettiğiniz kod düzenleyiciyi seçin (örneğin, VS Code, Sublime Text, Atom). VS Code, iş akışınızı basitleştirebilecek mükemmel Docker uzantılarına sahiptir.

Temel Dockerfile Yapılandırması

Herhangi bir Docker tabanlı ortamın temeli Dockerfile'dır. Bu dosya, Docker imajınızı oluşturmak için talimatlar içerir. Bir Node.js uygulaması için temel bir Dockerfile oluşturalım:

# Bir üst imaj olarak resmi bir Node.js çalışma zamanı kullanın
FROM node:18-alpine

# Container'daki çalışma dizinini ayarlayın
WORKDIR /app

# package.json ve package-lock.json'i çalışma dizinine kopyalayın
COPY package*.json ./

# Uygulama bağımlılıklarını yükleyin
RUN npm install

# Uygulama kaynak kodunu çalışma dizinine kopyalayın
COPY . .   

# 3000 portunu dış dünyaya açın (uygulamanız farklı bir port kullanıyorsa ayarlayın)
EXPOSE 3000

# Container başlatıldığında çalıştırılacak komutu tanımlayın
CMD ["npm", "start"]

Her satırı inceleyelim:

• FROM node:18-alpine: Container için temel imajı belirtir. Bu durumda, hafif bir Linux dağıtımı olan resmi Node.js 18 Alpine imajını kullanıyoruz. Alpine, Docker imajınızı küçük tutmaya yardımcı olan küçük boyutuyla bilinir. Projeniz için uygun olan diğer Node.js sürümlerini göz önünde bulundurun.
• WORKDIR /app: Container içindeki çalışma dizinini /app olarak ayarlar. Uygulama kodunuz burada bulunacaktır.
• COPY package*.json ./: package.json ve package-lock.json (veya Yarn kullanıyorsanız yarn.lock) dosyalarını çalışma dizinine kopyalar. Bu dosyaların önce kopyalanması, Docker'ın npm install adımını önbelleğe almasına olanak tanır ve yalnızca uygulama kodunu değiştirdiğinizde derleme sürelerini önemli ölçüde hızlandırır.
• RUN npm install: package.json içinde tanımlanan uygulama bağımlılıklarını yükler.
• COPY . .: Yerel proje dizininizdeki kalan tüm dosyaları ve dizinleri container içindeki çalışma dizinine kopyalar.
• EXPOSE 3000: 3000 portunu açığa çıkararak ana makineden erişilebilir hale getirir. Uygulamanız bu portu dinliyorsa bu önemlidir. Uygulamanız farklı bir port kullanıyorsa port numarasını ayarlayın.
• CMD ["npm", "start"]: Container başlatıldığında çalıştırılacak komutu belirtir. Bu durumda, Node.js uygulamalarını başlatmak için yaygın bir komut olan npm start'ı kullanıyoruz. Bu komutun package.json dosyanızın scripts bölümünde tanımlanan komutla eşleştiğinden emin olun.

Docker İmajını Oluşturma

Dockerfile'ınızı oluşturduktan sonra, aşağıdaki komutu kullanarak Docker imajını oluşturabilirsiniz:

docker build -t my-node-app .

Nerede:

• docker build: İmajları oluşturmak için kullanılan Docker komutu.
• -t my-node-app: İmaj için etiketi (adı) belirtir. Uygulamanız için açıklayıcı bir ad seçin.
• .: Derleme bağlamını, yani mevcut dizini belirtir. Docker, imajı oluşturmak için bu dizindeki Dockerfile'ı kullanacaktır.

Docker daha sonra Dockerfile'ınızdaki talimatları yürütecek ve imajı katman katman oluşturacaktır. İmajı ilk kez oluşturduğunuzda, temel imajı indirmek ve bağımlılıkları yüklemek biraz zaman alabilir. Ancak, sonraki derlemeler çok daha hızlı olacaktır çünkü Docker ara katmanları önbelleğe alır.

Docker Container'ını Çalıştırma

İmaj oluşturulduktan sonra, aşağıdaki komutu kullanarak ondan bir container çalıştırabilirsiniz:

docker run -p 3000:3000 my-node-app

Nerede:

• docker run: Container'ları çalıştırmak için kullanılan Docker komutu.
• -p 3000:3000: Ana makinedeki 3000 portunu container içindeki 3000 portuna eşler. Bu, tarayıcınızdan localhost:3000 kullanarak uygulamanıza erişmenizi sağlar. İlk sayı ana makine portu, ikinci sayı container portudur.
• my-node-app: Çalıştırmak istediğiniz imajın adı.

Uygulamanız şimdi Docker container'ı içinde çalışıyor olmalıdır. Tarayıcınızı açıp localhost:3000'e (veya belirttiğiniz porta) giderek ona erişebilirsiniz. Uygulamanızın karşılama ekranını veya ilk kullanıcı arayüzünü görmelisiniz.

Docker Compose Kullanımı

Birden fazla hizmete sahip daha karmaşık uygulamalar için Docker Compose paha biçilmez bir araçtır. Bir YAML dosyası kullanarak çok container'lı uygulamaları tanımlamanıza ve yönetmenize olanak tanır. Node.js uygulamamız için bir docker-compose.yml dosyası oluşturalım:

version: "3.9"
services:
  app:
    build: .
    ports:
      - "3000:3000"
    volumes:
      - .:/app
    environment:
      NODE_ENV: development
    command: npm run dev

Her bölümü inceleyelim:

• version: "3.9": Docker Compose dosya formatının sürümünü belirtir.
• services: Uygulamanızı oluşturan hizmetleri tanımlar. Bu durumda, app adlı tek bir hizmetimiz var.
• build: .: İmajın mevcut dizindeki Dockerfile'dan oluşturulması gerektiğini belirtir.
• ports: - "3000:3000": docker run komutuna benzer şekilde, ana makinedeki 3000 portunu container içindeki 3000 portuna eşler.
• volumes: - .:/app: Ana makinenizdeki mevcut dizini container içindeki /app dizinine bağlayan bir volume oluşturur. Bu, ana makinenizde kodunuzda değişiklik yapmanıza ve bunların otomatik olarak container içinde yansıtılmasına olanak tanıyarak hızlı yeniden yüklemeyi etkinleştirir.
• environment: NODE_ENV: development: Container içindeki NODE_ENV ortam değişkenini development olarak ayarlar. Bu, uygulamanızı geliştirme modunda çalışacak şekilde yapılandırmak için kullanışlıdır.
• command: npm run dev: Dockerfile'da tanımlanan varsayılan komutu geçersiz kılar. Bu durumda, genellikle hızlı yeniden yükleme ile bir geliştirme sunucusu başlatmak için kullanılan npm run dev'i kullanıyoruz.

Docker Compose'u kullanarak uygulamayı başlatmak için, docker-compose.yml dosyasını içeren dizine gidin ve aşağıdaki komutu çalıştırın:

docker-compose up

Docker Compose, imajı oluşturacak (gerekirse) ve container'ı başlatacaktır. Container'ı ayrılmış modda (arka planda) çalıştırmak için -d işareti eklenebilir.

Gelişmiş Yapılandırma Seçenekleri

Dockerlaştırılmış JavaScript geliştirme ortamınızı geliştirmek için bazı gelişmiş yapılandırma seçenekleri şunlardır:

1. Çok Aşamalı Derlemeler

Çok aşamalı derlemeler, Dockerfile'ınızda, her biri farklı bir derleme aşamasını temsil eden birden fazla FROM talimatı kullanmanıza olanak tanır. Bu, derleme ortamını çalışma zamanı ortamından ayırarak son imajınızın boyutunu küçültmek için kullanışlıdır.

# Aşama 1: Uygulamayı derleyin
FROM node:18-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .   
RUN npm run build

# Aşama 2: Çalışma zamanı imajını oluşturun
FROM nginx:alpine
COPY --from=builder /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Bu örnekte, ilk aşama (builder) uygulamayı Node.js kullanarak oluşturur. İkinci aşama, oluşturulan uygulama dosyalarına hizmet etmek için Nginx'i kullanır. Yalnızca ilk aşamadaki oluşturulan dosyalar ikinci aşamaya kopyalanır, bu da daha küçük ve daha verimli bir imajla sonuçlanır.

2. Ortam Değişkenlerini Kullanma

Ortam değişkenleri, kodunuzu değiştirmeden uygulamanızı yapılandırmanın güçlü bir yoludur. Ortam değişkenlerini docker-compose.yml dosyanızda tanımlayabilir veya -e işaretini kullanarak bunları çalışma zamanında iletebilirsiniz.

services:
  app:
    environment:
      API_URL: "http://api.example.com"

Uygulamanızın içinde, bu ortam değişkenlerine process.env kullanarak erişebilirsiniz.

const apiUrl = process.env.API_URL;

3. Geliştirme için Volume Bağlama

Volume bağlama (Docker Compose örneğinde gösterildiği gibi), geliştirme için çok önemlidir çünkü ana makinenizdeki kodunuzda değişiklik yapmanıza ve bunların anında container içinde yansıtılmasına olanak tanır. Bu, her değişiklik yaptığınızda imajı yeniden oluşturma ihtiyacını ortadan kaldırır.

4. VS Code ile Hata Ayıklama

VS Code, Docker container'ları içinde çalışan Node.js uygulamalarında hata ayıklama için mükemmel desteğe sahiptir. Çalışan bir container'a bağlanmak, kesme noktaları ayarlamak, değişkenleri incelemek ve kodunuzda adım adım ilerlemek için VS Code Docker uzantısını kullanabilirsiniz.

Öncelikle VS Code'da Docker uzantısını kurun. Ardından, .vscode dizininizde aşağıdaki yapılandırmaya sahip bir launch.json dosyası oluşturun:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "attach",
      "name": "Docker'a Bağlan",
      "port": 9229,
      "address": "localhost",
      "remoteRoot": "/app",
      "localRoot": "${workspaceFolder}"
    }
  ]
}

Node.js uygulamanızın --inspect veya --inspect-brk işaretiyle başlatıldığından emin olun. Örneğin, bu işareti içermek için docker-compose.yml dosyanızı değiştirebilirsiniz:

services:
  app:
    command: npm run dev -- --inspect=0.0.0.0:9229

Ardından, VS Code'da "Docker'a Bağlan" yapılandırmasını seçin ve hata ayıklamayı başlatın. Container içinde çalışan kodunuzda kesme noktaları ayarlayabilecek ve hata ayıklayabileceksiniz.

5. Özel bir npm Kayıt Defteri Kullanma

Özel npm paketleri içeren bir proje üzerinde çalışıyorsanız, Docker container'ınızı özel npm kayıt defterinizle kimlik doğrulaması yapacak şekilde yapılandırmanız gerekecektir. Bu, docker-compose.yml dosyanızda NPM_TOKEN ortam değişkenini ayarlayarak veya proje dizininizde bir .npmrc dosyası oluşturup container'a kopyalayarak yapılabilir.

# Dockerfile
FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
COPY .npmrc .
RUN npm install
COPY . .   
EXPOSE 3000
CMD ["npm", "start"]

.npmrc dosyası kimlik doğrulama belirtecinizi içermelidir:

//registry.npmjs.org/:_authToken=YOUR_NPM_TOKEN

YOUR_NPM_TOKEN'ı gerçek npm belirtecinizle değiştirmeyi unutmayın. Bu belirteci güvende tutun ve herkese açık deponuza göndermeyin.

6. İmaj Boyutunu Optimize Etme

Docker imajınızın boyutunu küçük tutmak, daha hızlı derleme ve dağıtım süreleri için önemlidir. İmaj boyutunu optimize etmek için bazı ipuçları şunlardır:

• node:alpine gibi hafif bir temel imaj kullanın.
• Derleme ortamını çalışma zamanı ortamından ayırmak için çok aşamalı derlemeler kullanın.
• İmajdan gereksiz dosya ve dizinleri kaldırın.
• Derleme bağlamından dosya ve dizinleri hariç tutmak için .dockerignore dosyası kullanın.
• Katman sayısını azaltmak için birden çok RUN komutunu tek bir komutta birleştirin.

Örnek: Bir React Uygulamasını Dockerlaştırma

Bu kavramları pratik bir örnekle açıklayalım: Create React App ile oluşturulmuş bir React uygulamasını Dockerlaştırma.

Öncelikle, Create React App'i kullanarak yeni bir React uygulaması oluşturun:

npx create-react-app my-react-app
cd my-react-app

Ardından, projenin kök dizininde bir Dockerfile oluşturun:

FROM node:18-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .   
RUN npm run build

FROM nginx:alpine
COPY --from=builder /app/build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Bir docker-compose.yml dosyası oluşturun:

version: "3.9"
services:
  app:
    build: .
    ports:
      - "3000:80"
    volumes:
      - .:/app
    environment:
      NODE_ENV: development

Not: Nginx uygulamaya 80 portunda hizmet verdiğinden, ana makinedeki 3000 portunu container içindeki 80 portuna eşliyoruz. Uygulamanızın yapılandırmasına bağlı olarak port eşlemesini ayarlamanız gerekebilir.

Son olarak, uygulamayı oluşturmak ve başlatmak için docker-compose up komutunu çalıştırın. Ardından, tarayıcınızda localhost:3000'e giderek uygulamaya erişebilirsiniz.

Yaygın Sorunlar ve Sorun Giderme

Dikkatli yapılandırma ile bile, Docker ile çalışırken sorunlarla karşılaşabilirsiniz. İşte bazı yaygın sorunlar ve çözümleri:

• Port Çakışmaları: docker-compose.yml veya docker run komutunuzda eşlediğiniz portların ana makinenizdeki diğer uygulamalar tarafından zaten kullanılmadığından emin olun.
• Volume Bağlama Sorunları: Bağladığınız dosya ve dizinlerdeki izinleri kontrol edin. Docker'ın dosyalara erişmek için gerekli izinlere sahip olmayabilir.
• İmaj Derleme Hataları: Hatalar için docker build komutunun çıktısını dikkatlice inceleyin. Yaygın nedenler arasında yanlış Dockerfile sözdizimi, eksik bağımlılıklar veya ağ sorunları bulunur.
• Container Çökmeleri: Container'ınızın günlüklerini görüntülemek ve çökmenin nedenini belirlemek için docker logs komutunu kullanın. Yaygın nedenler arasında uygulama hataları, eksik ortam değişkenleri veya kaynak kısıtlamaları bulunur.
• Yavaş Derleme Süreleri: Çok aşamalı derlemeler kullanarak, bağımlılıkları önbelleğe alarak ve katman sayısını en aza indirerek Dockerfile'ınızı optimize edin.

Sonuç

Docker, tutarlı ve yeniden üretilebilir JavaScript geliştirme ortamları oluşturmak için güçlü ve çok yönlü bir çözüm sunar. Docker'ı kullanarak uyumluluk sorunlarını ortadan kaldırabilir, dağıtımı basitleştirebilir ve ekibinizdeki herkesin aynı ortamda çalıştığından emin olabilirsiniz.

Bu kılavuz, Dockerlaştırılmış bir JavaScript geliştirme ortamı kurmanın temellerinin yanı sıra bazı gelişmiş yapılandırma seçeneklerini de kapsamıştır. Bu adımları izleyerek, karmaşıklıklarından veya ekibinizin boyutundan bağımsız olarak JavaScript projeleriniz için sağlam ve verimli bir iş akışı oluşturabilirsiniz. Docker'ı benimseyin ve JavaScript geliştirme sürecinizin tüm potansiyelini ortaya çıkarın.

Sonraki Adımlar:

• Belirli ihtiyaçlarınıza uygun önceden oluşturulmuş imajlar için Docker Hub'ı keşfedin.
• Çok container'lı uygulamaları yönetmek için Docker Compose'a daha derinlemesine dalın.
• Üretim ortamlarında Docker container'larını düzenlemek için Docker Swarm ve Kubernetes hakkında bilgi edinin.

Bu en iyi uygulamaları iş akışınıza dahil ederek, JavaScript uygulamalarınız için daha verimli, güvenilir ve ölçeklenebilir bir geliştirme ortamı oluşturabilir ve günümüzün rekabetçi pazarında başarı sağlayabilirsiniz.