Takip et

Next.js Uygulamanızı AWS EC2’ye Docker, Nginx ve GitHub Actions ile Dağıtın

Next.js Uygulamanızı AWS EC2’ye Docker, Nginx ve GitHub Actions ile Dağıtın

Merhaba! Ben Fatih Soysal ve bu makalede, Next.js uygulamalarınızı AWS EC2 üzerinde Docker ve Nginx kullanarak nasıl dağıtabileceğinizi ve GitHub Actions ile tüm süreci nasıl otomatikleştirebileceğinizi detaylı bir şekilde açıklayacağım. Bu, geliştirme sürecini hızlandıracak ve daha verimli bir çalışma akışı sağlayacaktır. Öncelikle, gereken adımları maddeler halinde inceleyelim.

Gerekli Ön Koşullar

Başlamadan önce, aşağıdaki araçlara ve hizmetlere sahip olmanız gerekmektedir:

  • Bir AWS hesabı
  • Bir EC2 örneği (Ubuntu önerilir)
  • Docker ve Docker Compose kurulu bir EC2 örneği
  • Bir GitHub hesabı ve deponuz
  • Kurulmuş bir Next.js uygulaması
  • Temel Linux komut satırı bilgisi

Docker ve Docker Compose ile Next.js Uygulamasının Hazırlanması

İlk adım, Next.js uygulamanızı Docker kullanarak kapsayıcılaştırarak başlar. Bunun için bir Dockerfile oluşturacaksınız. Aşağıdaki Dockerfile örneği, Next.js uygulamanız için uygun bir başlangıç noktasıdır:


FROM node:16-alpine

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

EXPOSE 3000

CMD ["npm", "start"]

Ardından, Nginx ters proxy sunucusu kullanarak uygulamayı dağıtmak için bir docker-compose.yml dosyası oluşturmanız gerekecektir. Bu dosya, hem Next.js uygulamasının hem de Nginx’in nasıl çalıştırılacağını tanımlar. İşte bir örnek:


version: "3.9"
services:
  web:
    build: .
    ports:
      - "80:3000"
    volumes:
      - ./:/app
  nginx:
    image: nginx:latest
    ports:
      - "80:80"
    volumes:
      - ./nginx.conf:/etc/nginx/conf.d/default.conf

Son olarak, Nginx yapılandırma dosyanız olan nginx.conf dosyasını oluşturmanız gerekir. Bu dosya, istekleri Next.js uygulamanıza yönlendirir. İşte bir örnek:


server {
    listen 80;
    server_name your_domain.com; # Domain adınızı buraya girin

    location / {
        proxy_pass http://web:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

Bu dosyaları oluşturduktan sonra, EC2 örneğinize docker-compose up -d komutunu çalıştırarak uygulamanızı başlatabilirsiniz.

GitHub Actions ile Otomasyon

Şimdi, dağıtım sürecini GitHub Actions ile otomatikleştirelim. GitHub deponuzda bir .github/workflows dizini oluşturun ve içine deploy.yml adında bir dosya ekleyin. Bu dosya, kod değişikliklerinde otomatik dağıtım işlemini başlatacak komutları içerecektir.


name: Deploy to EC2

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v3
      # ... diğer adımlar (SSH ile EC2'ye bağlanma, docker-compose up -d vb.) ...

Bu kısım, güvenlik nedeniyle detaylı olarak açıklanmamaktadır. SSH anahtarlarını ve diğer hassas bilgileri GitHub Actions’da güvenli bir şekilde yönetmek için GitHub Secrets’ı kullanmanız önemlidir. Daha detaylı bilgi için GitHub Secrets dokümantasyonuna göz atabilirsiniz.

Sonuç

Tebrikler! Next.js uygulamanızı AWS EC2’ye Docker ve Nginx kullanarak başarıyla dağıttınız ve GitHub Actions ile otomatikleştirdiniz. Bu süreç, uygulamalarınızın sürekli entegrasyon ve sürekli dağıtım (CI/CD) süreçlerine dahil edilmesini sağlar. Bu yöntem, hızlı ve güvenilir bir dağıtım sistemi oluşturmanıza yardımcı olacaktır. Daha fazla bilgi için web sitemi ziyaret edebilirsiniz.

Umarım bu makale size yardımcı olmuştur. Herhangi bir sorunuz varsa, lütfen bana bildirin. Ayrıca, daha fazla kaynak için buraya bakabilirsiniz.

#Etiketler

Next.js, AWS EC2, Docker, Nginx, GitHub Actions, Dağıtım, Otomasyon, Cloud, CI/CD, Fatih Soysal


Yorumlar
İçeriği beğendiniz mi? Bir tartışma başlatın veya görüşlerinizi paylaşın.
Yorum Yaz

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

E-posta Bülteni
Yazılım Topluluğuna Katılın
En son güncellemeleri, yaratıcı ipuçlarını ve özel kaynakları doğrudan e-posta kutunuza alın. Tasarım ve inovasyonun geleceğini birlikte keşfedelim.