Bir linux serverda ya da vps de uygulamalarımı yayınlamak istiyorum,

html, css, js ten oluşan bir uygulamam var,
react js ile oluşan bir uygulamam var,
next js ile oluşan bir uygulamam var,
express js ile oluşan bir api uygulamam var,
bir tane de django ile oluşan bir api uygulamam var,

bunları ip adresi üzerinden sadece url in sonuna app1, app2, react, api gibi path ekleyerek public olarak ulaşıma açmak ,
kodları githubta private olarak tutmak,
main dalına commit atınca, severdaki kodların güncellenmesi ,

Bu projeyi gerçekleştirmek için aşağıdaki adımları takip edebilirsin. Her adımı ayrıntılı olarak anlatacağım.

1. Kullanıcı Oluşturma ve Yetkilendirme

Root kullanıcısı ile işlem yapmak güvenlik riski taşır, bu nedenle özel bir kullanıcı oluşturmak daha iyidir. Yeni bir kullanıcı oluşturmak ve gerekli yetkileri vermek için aşağıdaki adımları takip edebilirsin:

Kullanıcı Oluşturma

sudo adduser deployer

deployer kullanıcısının sudo yetkisine sahip olmasını sağla:

sudo usermod -aG sudo deployer

SSH Ayarları

Kendi kullanıcı hesabından deployer kullanıcısına SSH anahtarını kopyala:

ssh-copy-id deployer@your_server_ip

2. Gerekli Yazılımların Kurulumu

Git Kurulumu

sudo apt update sudo apt install git

Node.js ve NPM Kurulumu

curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash - sudo apt-get install -y nodejs

Python ve Pip Kurulumu

sudo apt update sudo apt install python3-pip python3-dev libpq-dev

Nginx Kurulumu

sudo apt update sudo apt install nginx

3. Uygulamaları Kopyalama ve Kurulum

Git Reposunu Klonlama

deployer kullanıcısına geç ve repository'leri klonla:

su - deployer git clone git@github.com:yourusername/yourrepository.git cd yourrepository

Projelerinizi Doğru Dizinlere Yerleştirin

Öncelikle, tüm projelerinizin /home/deployer/../.. dizininde olduğunu doğrulayın. Örneğin:

HTML/CSS/JS projesi: /home/deployer/yourrepository/app1
React projesi: /home/deployer/yourrepository/react
Next.js projesi: /home/deployer/yourrepository/next
Express.js API: /home/deployer/yourrepository/api
Django API: /home/deployer/yourrepository/django

4. Continuous Deployment (CD) Yapılandırma

GitHub ile Entegrasyon

SSH Anahtarı Oluşturma

deployer kullanıcısına özel bir SSH anahtarı oluştur:

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

Oluşan anahtarı GitHub'da deploy key olarak ekle.

Webhook Ayarları

GitHub repository'ine webhook ekleyerek push sonrası sunucunun güncellenmesini sağla. Bunun için bir webhook endpoint oluşturman gerekiyor.

Webhook Handler Script (örneğin: `webhook_handler.py`)

// python
#!/usr/bin/env python3 
from flask import Flask, request import os import subprocess 
app = Flask(__name__) 
@app.route('/webhook', methods=['POST']) 
def webhook(): 
  if request.method == 'POST': 
    repo = request.json['repository']['name'] 
    branch = request.json['ref'].split('/')[-1] 
    if repo == "yourrepository" and branch == "main": 
      os.chdir('/home/deployer/yourrepository') 
      subprocess.run(["git", "pull"]) 
      subprocess.run(["bash", "deploy.sh"]) 
      return 'Success', 200 
    else: 
      return 'Forbidden', 403 

if __name__ == '__main__': 
  app.run(host='0.0.0.0', port=5000)

5. Nginx Yapılandırması

Nginx Konfigürasyonu

Nginx'i farklı uygulamalara yönlendirmek için aşağıdaki gibi bir konfigürasyon yap:

sudo nano /etc/nginx/sites-available/myapp

server { 
  listen 80; 
  server_name your_server_ip; 
  location /app1/ { 
    root /home/deployer/yourrepository/app1/build/; 
    try_files $uri /index.html; 
  } 

  location /react/ { 
    root /home/deployer/yourrepository/react/build/; 
    try_files $uri /index.html; 
  } 

  location /api/ { 
    proxy_pass http://localhost:3000/; 
    proxy_http_version 1.1; 
    proxy_set_header Upgrade $http_upgrade; 
    proxy_set_header Connection 'upgrade'; 
    proxy_set_header Host $host; proxy_cache_bypass $http_upgrade; 
  } 

  location /django/ { 
    proxy_pass http://localhost:8000/; 
    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; 
  } 

}

Oluşturduğunuz yapılandırma dosyasını sites-enabled dizinine sembolik bir bağlantı ile bağlayın:

sudo ln -s /etc/nginx/sites-available/myapp /etc/nginx/sites-enabled/

Bu dosyayı kaydettikten sonra Nginx'i yeniden başlat:

sudo nginx -t sudo systemctl restart nginx

/etc/nginx/sites-available/ dizininde yeni bir Nginx konfigürasyon dosyası oluşturun (örneğin, myapp).
Yukarıdaki Nginx konfigürasyonunu dosyaya ekleyin ve dosyayı kaydedin.
Konfigürasyon dosyasını /etc/nginx/sites-enabled/ dizinine sembolik bağlantı ile bağlayın.
Nginx yapılandırmasını test edin ve Nginx'i yeniden başlatın.

6. Uygulamaların Kurulumu ve Başlatılması

HTML/CSS/JS Uygulaması

Örneğin, app1 adında bir HTML/CSS/JS uygulamanız varsa, Nginx konfigürasyonunda belirtilen root dizinine dosyaları yerleştir.

React Uygulaması

React uygulamanı derleyip Nginx ile servis et:

cd /home/deployer/yourrepository/react 
npm install npm run build

Next.js Uygulaması

Next.js uygulamanı çalıştır:

cd /home/deployer/yourrepository/next 
npm install 
npm run build 
npm start

Express.js API

Express.js API uygulamasını çalıştır:

cd /home/deployer/yourrepository/api 
npm install node app.js

Django API

Django API uygulamasını çalıştırmak için önce gerekli bağımlılıkları yükle ve migration işlemlerini yap:

cd /home/deployer/yourrepository/django 
pip3 install -r requirements.txt 
python3 manage.py migrate 
python3 manage.py runserver 0.0.0.0:8000

7. Deploy Script Oluşturma (deploy.sh)

git pull işleminden sonra uygulamaların güncellenmesini otomatikleştirmek için bir deploy script oluştur:

#!/bin/bash 
# React 
cd /home/deployer/yourrepository/react 
npm install 
npm run build 

# Next.js 
cd /home/deployer/yourrepository/next 
npm install 
npm run build 

# Express.js 
cd /home/deployer/yourrepository/api 
npm install 

# Django 
cd /home/deployer/yourrepository/django 
pip3 install -r requirements.txt 
python3 manage.py migrate 

# Restart 
services if needed # e.g., pm2 restart all

Bu scripti çalıştırılabilir yap:

chmod +x /home/deployer/yourrepository/deploy.sh

8. Webhook Uygulamasını Başlatma

Flask uygulamasını çalıştırmak için deployer kullanıcısı altında aşağıdaki komutu kullanabilirsin:

nohup python3 /home/deployer/yourrepository/webhook_handler.py

9. Güvenlik ve Son Kontroller

Tüm dosya ve dizin izinlerini kontrol et.
Uygulamaların çalışıp çalışmadığını test et.
Güvenlik duvarı ayarlarını kontrol et (örneğin, UFW).

Bu adımlar seni HTML, CSS, JS, React, Next.js, Express.js ve Django uygulamalarını bir Linux sunucusunda yayınlama sürecinde rehberlik edecektir. Her adımı dikkatlice takip ederek uygulamalarını başarıyla yayına alabilirsin.

10. Tarayıcıdan Test Edin

Sunucunuzun IP adresini ve projelerin URL yollarını kullanarak projenizin doğru şekilde yüklendiğini kontrol edin:

HTML/CSS/JS projesi: http://your_server_ip/app1/
React projesi: http://your_server_ip/react/
Next.js projesi: http://your_server_ip/next/
Express.js API: http://your_server_ip/api/
Django API: http://your_server_ip/django/

Nginx’in varsayılan sayfasını görüyorsanız, muhtemelen yapılandırma dosyanız doğru etkinleştirilmemiş veya Nginx'in varsayılan konfigürasyon dosyası hala aktif. Sorunu çözmek için aşağıdaki adımları izleyebilirsiniz:

1. Varsayılan Nginx Yapılandırma Dosyasını Kaldırın

Öncelikle, Nginx’in varsayılan yapılandırma dosyasını kaldırarak başlayın:

sudo rm /etc/nginx/sites-enabled/default

2. Kendi Yapılandırma Dosyanızın Bağlantısını Kontrol Edin

Oluşturduğunuz yapılandırma dosyasının etkin olup olmadığını kontrol edin. Daha önce oluşturduğunuz sembolik bağlantıyı yeniden yapın:

sudo ln -sf /etc/nginx/sites-available/testapp /etc/nginx/sites-enabled/

3. Nginx Yapılandırmasını Test Edin

Yapılandırmanın doğru olup olmadığını kontrol edin:

sudo nginx -t

Herhangi bir hata mesajı alırsanız, yapılandırma dosyasını düzeltmeniz gerekecektir.

4. Nginx’i Yeniden Başlatın

Nginx’i yeniden başlatarak yeni yapılandırmaların yüklenmesini sağlayın:

sudo systemctl restart nginx

5. Yapılandırma Dosyasını Kontrol Edin

/etc/nginx/sites-available/testapp dosyasının içeriğinin doğru olduğundan emin olun. İçeriğin tam ve eksiksiz olduğuna dikkat edin. İçeriğin doğru olup olmadığını bir kez daha kontrol edelim:

server { 
  listen 80; 
  server_name 62.72.32.70; 

  location /app1/ { 
    alias /home/mesut/testapp/app1/; 
    index index.html; 
    try_files $uri $uri/ /index.html; 
  } 

  location /react/ { 
    alias /home/mesut/testapp/react/build/; 
    try_files $uri /index.html; 
  } 
 
  location /next/ { 
    proxy_pass http://localhost:3001/; 
    proxy_http_version 1.1; 
    proxy_set_header Upgrade $http_upgrade; 
    proxy_set_header Connection 'upgrade'; 
    proxy_set_header Host $host; 
    proxy_cache_bypass $http_upgrade; 
  } 

  location /api/ { 
    proxy_pass http://localhost:3000/; 
    proxy_http_version 1.1; 
    proxy_set_header Upgrade $http_upgrade; 
    proxy_set_header Connection 'upgrade'; 
    proxy_set_header Host $host; 
    proxy_cache_bypass $http_upgrade; 
  } 
   
  location /django/ { 
    proxy_pass http://localhost:8000/; 
    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; 
  } 

}

6. Nginx Log Dosyalarını Kontrol Edin

Nginx'in hata günlüklerini kontrol ederek herhangi bir hata veya uyarı mesajı olup olmadığını inceleyin:

sudo tail -f /var/log/nginx/error.log

7. Servislerin Çalıştığını Kontrol Edin

Aşağıdaki komutları kullanarak Express.js ve Django uygulamalarının doğru portlarda çalıştığından emin olun:

# Express.js uygulaması için 
curl http://localhost:3000 
# Django uygulaması için 
curl http://localhost:8000

Next.js uygulamanızın da doğru portta çalıştığından emin olun:

curl http://localhost:3001

Bu adımları takip ettikten sonra hala varsayılan Nginx sayfasını görüyorsanız, yapılandırma dosyasındaki yolların ve dosyaların doğruluğunu bir kez daha kontrol edin. Hala sorun yaşıyorsanız, yapılandırma dosyasının tam içeriğini ve dizin yapısını tekrar gözden geçirmemiz gerekebilir.

Linux Serverda Node js ve PythonUygulamaları Yayınlama